2

如果访问者已经推荐了该页面,我如何向访问者隐藏 Google+ 按钮。我不想只在点击后隐藏它,也不想在用户下次访问页面时隐藏按钮。

4

2 回答 2

3

我会小心隐藏这样的按钮,如果用户愿意,可能无法删除他们的 +1,这可能会导致糟糕的体验。如果您出于美观原因将其隐藏,这是可以理解的 - 例如,如果您想显示一条消息,然后呈现一个遵循Google+ 品牌Google+ 按钮政策的不同按钮。

如果你想这样做,你可以使用回调在用户的机器上放置一个 cookie。以下演示显示了完整的实现:

<html itemscope itemtype="http://schema.org/Article">
  <title>Demo: Hiding +1 after first click</title>
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
  <head>

  </head>
  <body>
    <div id="pluscontainer"></div>
    <h1>Demo: Plus button here</h1>
    <p>
      <span id="plusButton" style="display:none">
        <g:plusone size="tall" callback='cookieAdd'></g:plusone>
      </span>
      <span id="plusMessage" style="display:none;" >
        You have already +1'd this page, click <button onClick='cookieDrop();'>here</button>
        to reshow the button
      </span>
    </p>
  </body>

<script type="text/javascript">
  (function() {
    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
    po.src = 'https://apis.google.com/js/plusone.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
    if (document.cookie != undefined && document.cookie.indexOf('enrolled=1') > -1){
      // User +1'd
      $('#plusButton').hide();
      $('#plusMessage').show();
    }else{
      // User hasn't +1'd
      $('#plusButton').show();
      $('#plusMessage').hide();
    }
  })();

  // Remove the cookie (show +1 button)
  function cookieDrop(){
    document.cookie = 'enrolled=0';
    $('#plusMessage').hide();
    $('#plusButton').show();
  }

  // Add the cookie (hide +1 button)
  function cookieAdd(state){
    if (state.state == 'on'){
      document.cookie = 'enrolled=1;expires=0';
      $('#plusMessage').show();
      $('#plusButton').hide();
    }
  }
</script>
</html>
于 2013-05-21T02:02:57.510 回答
0

如果 Mindbreaker 的解决方案不起作用,您可以添加触发器并保存 +1 用户的 IP 地址。当访问者返回时,您可以简单地使用 CSS 删除 +1 按钮display:none

于 2013-05-20T18:10:50.483 回答