AddThis插件不能排除移动工具箱中的服务

Question

我在addThis之后实现了他们的指示共享框。我只想在共享工具箱中包含以下服务，它在桌面浏览器上工作良好，但在移动环境中却被忽略，这意味着每个服务都显示在共享框的移动版本上。

还有人遇到过这个问题吗？怎样才能解决这个问题呢？

​

<script src="https://s7.addthis.com/js/300/addthis_widget.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="share_btn">Press me to test sharing!!!!</div>
<script>
var addthis_config = { 
    services_expanded: 'facebook,twitter,email,tumblr,link,sinaweibo,whatsapp'
}

$(".share_btn").on("click", function () {
    addthis.update('share', 'url', 'http://google.com');
    addthis_sendto('more');
});
</script>

​

JSFiddle - 测试链路

Answer 1

这是个小虫子

您正确地应用了配置，问题是，这是一个已经存在了几年的bug：

一个用户在2013年6月问：

我们有一个addthis控件，它只正确地显示我们在使用桌面浏览器查看时指定的共享服务。当从移动设备(在本例中是iphone)中查看它时，它切换到移动视图I a新选项卡(这很好)，但是它会显示所有可能的服务，而不是我们想要显示的特定服务。除了我们已经在做的事情之外，我们还需要做一些额外的配置吗？

，AddThis团队的一名成员对此做出回应：

我在本地环境中进行了测试，并经历了同样的结果。我已经和我们的开发团队一起为将来的发行版做了一个修正。谢谢你向我们报告。

AddThis支持(http://support.addthis.com/customer/portal/questions/1150668-addthis-mobile-not-respecting-services-compact-or-services-expanded-)

当另一个用户问它是否在一年后被修复时，这个问题仍然没有解决。

你能做什么？

看来，您唯一的选择是使用services_exclude，这似乎确实适用于移动设备。这将导致更长的列表和更多的配置头痛，但它应该可以让您几乎得到您要在移动菜单上的列表。

​

<script src="https://s7.addthis.com/js/300/addthis_widget.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="share_btn">Press me to test sharing!!!!</div>
<script>
  var addthis_config = {
    services_exclude: 'dashboard,menu,compact,email,facebook_like,foursquare,google_plusone,pinterest,100zakladok,a97abi,addressbar,adfty,adifni,advqr,amazonwishlist,amenme,aim,aolmail,apsense,arto,baang,baidu,balatarin,balltribe,beat100,biggerpockets,bitly,bizsugar,bland,blogger,blogkeen,blogmarks,blurpalicious,bobrdobr,bonzobox,socialbookmarkingnet,bookmarkycz,bookmerkende,box,brainify,bryderi,buddymarks,buffer,camyoo,care2,foodlve,chiq,citeulike,classicalplace,google_classroom,cleanprint,cleansave,cndig,colivia,technerd,link,cosmiq,cssbased,delicious,diary_ru,digaculturanet,digg,diggita,digo,diigo,domelhor,douban,draugiem,dzone,edcast,efactor,mailto,embarkons,evernote,stylishhome,fabulously40,informazione,thefancy,fashiolista,favable,faves,favlogde,favoritende,favorites,favoritus,financialjuice,flipboard,folkd,thefreedictionary,fresqui,funp,gg,gmail,govn,goodnoows,google,googleplus,googletranslate,google_plusone_share,hackernews,hatena,gluvsnap,hedgehogs,historious,hootsuite,hotmail,w3validator,identica,ihavegot,indexor,instapaper,iorbix,irepeater,jamespot,jappy,jolly,kaevur,kaixin,kakao,ketnooi,kik,kindleit,kledy,latafaneracat,librerio,lidar,lineme,linkedin,linkuj,livejournal,mymailru,margarin,markme,meinvz,memonic,memori,mendeley,meneame,mixi,moemesto,moikrug,mrcnetworkit,myspace,myvidster,n4g,naszaklasa,netlog,netvibes,netvouz,newsmeback,newsvine,nujij,nurses_lounge,odnoklassniki_ru,oknotizie,openthedoor,oyyla,packg,pafnetde,pdfonline,pdfmyurl,phonefavs,pinboard,pinterest_share,planypus,plaxo,plurk,pocket,posteezy,print,printfriendly,pusha,qrsrc,quantcast,qzone,reddit,rediff,redkum,renren,researchgate,safelinking,scoopat,scoopit,sekoman,select2gether,shaveh,shetoldme,skype,skyrock,slack,smiru,sodahead,sonico,spinsnap,yiid,startaid,startlap,studivz,stuffpit,stumbleupon,stumpedia,sulia,sunlize,supbro,surfingbird,svejo,symbaloo,taringa,telegram,tencentweibo,thewebblend,thisnext,tuenti,tulinq,twitthis,typepad,urlaubswerkde,viadeo,viber,virb,visitezmonsite,vk,vkrugudruzei,voxopolis,vybralisme,wanelo,internetarchive,sharer,webnews,domaintoolswhois,windows,wirefan,wishmindr,wordpress,raiseyourvoice,wykop,xanga,xing,yahoomail,yammer,yardbarker,yigg,yookos,yoolink,yorumcuyum,youmob,yummly,yuuby,zakladoknet,ziczac,zingme'
  }

  $(".share_btn").on("click", function() {
    addthis.update('share', 'url', 'http://google.com');
    addthis_sendto('more');
  });
</script>

​

堆栈代码段似乎无法工作，因此要查看此代码段，请查看此https://jsfiddle.net/z3qzh388/5/。

不幸的是，使用这种方法会发现另一个错误，它会导致Facebook、Twitter和Tumbler按钮的复制(如上文所示)。似乎没有一种方法来配置AddThis来停止这种复制，但是，这可以从不同的角度来解决。

移动菜单被赋予独特的类(以区别于桌面菜单)，重复的菜单总是显示为前三项。这意味着我们可以使用CSS隐藏前三个列表项，并通过扩展从视图中删除重复项。

​

.at4m-listitem:nth-child(-n+3) {
  display: none;
}

<script src="https://s7.addthis.com/js/300/addthis_widget.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="share_btn">Press me to test sharing!!!!</div>
<script>
  var addthis_config = {
    services_exclude: 'dashboard,menu,compact,email,facebook_like,foursquare,google_plusone,pinterest,100zakladok,a97abi,addressbar,adfty,adifni,advqr,amazonwishlist,amenme,aim,aolmail,apsense,arto,baang,baidu,balatarin,balltribe,beat100,biggerpockets,bitly,bizsugar,bland,blogger,blogkeen,blogmarks,blurpalicious,bobrdobr,bonzobox,socialbookmarkingnet,bookmarkycz,bookmerkende,box,brainify,bryderi,buddymarks,buffer,camyoo,care2,foodlve,chiq,citeulike,classicalplace,google_classroom,cleanprint,cleansave,cndig,colivia,technerd,link,cosmiq,cssbased,delicious,diary_ru,digaculturanet,digg,diggita,digo,diigo,domelhor,douban,draugiem,dzone,edcast,efactor,mailto,embarkons,evernote,stylishhome,fabulously40,informazione,thefancy,fashiolista,favable,faves,favlogde,favoritende,favorites,favoritus,financialjuice,flipboard,folkd,thefreedictionary,fresqui,funp,gg,gmail,govn,goodnoows,google,googleplus,googletranslate,google_plusone_share,hackernews,hatena,gluvsnap,hedgehogs,historious,hootsuite,hotmail,w3validator,identica,ihavegot,indexor,instapaper,iorbix,irepeater,jamespot,jappy,jolly,kaevur,kaixin,kakao,ketnooi,kik,kindleit,kledy,latafaneracat,librerio,lidar,lineme,linkedin,linkuj,livejournal,mymailru,margarin,markme,meinvz,memonic,memori,mendeley,meneame,mixi,moemesto,moikrug,mrcnetworkit,myspace,myvidster,n4g,naszaklasa,netlog,netvibes,netvouz,newsmeback,newsvine,nujij,nurses_lounge,odnoklassniki_ru,oknotizie,openthedoor,oyyla,packg,pafnetde,pdfonline,pdfmyurl,phonefavs,pinboard,pinterest_share,planypus,plaxo,plurk,pocket,posteezy,print,printfriendly,pusha,qrsrc,quantcast,qzone,reddit,rediff,redkum,renren,researchgate,safelinking,scoopat,scoopit,sekoman,select2gether,shaveh,shetoldme,skype,skyrock,slack,smiru,sodahead,sonico,spinsnap,yiid,startaid,startlap,studivz,stuffpit,stumbleupon,stumpedia,sulia,sunlize,supbro,surfingbird,svejo,symbaloo,taringa,telegram,tencentweibo,thewebblend,thisnext,tuenti,tulinq,twitthis,typepad,urlaubswerkde,viadeo,viber,virb,visitezmonsite,vk,vkrugudruzei,voxopolis,vybralisme,wanelo,internetarchive,sharer,webnews,domaintoolswhois,windows,wirefan,wishmindr,wordpress,raiseyourvoice,wykop,xanga,xing,yahoomail,yammer,yardbarker,yigg,yookos,yoolink,yorumcuyum,youmob,yummly,yuuby,zakladoknet,ziczac,zingme'
  }

  $(".share_btn").on("click", function() {
    addthis.update('share', 'url', 'http://google.com');
    addthis_sendto('more');
  });
</script>

​

堆栈代码段似乎无法工作，因此要查看此代码段，请查看此https://jsfiddle.net/z3qzh388/6/。

Answer 2

在移动浏览器上，您应该使用TouchEvents。

尝试在这里添加touchstart：

$(".sharing").on("click touchstart", function () {
    ...
});

Answer 3

是在每一部手机里还是只有iOS？如果只在ios上尝试这样做：

$(document).ready(function() {
  var $ua = navigator.userAgent;
  var $event = ($ua.match(/(iPod|iPhone|iPad)/i)) ? "touchstart" : "click";

  $(document).on($event, function(ev) {
    addthis.update('share', 'url', 'http://google.com');
    addthis_sendto('more');
  });
});