SocialMediaBar mit TypoScript

Wer wollte nicht schon immer mal für seine eigene Seite eine SocialMediaBar haben und auf jeder Seite Like’n / Google’n oder Twittern können…
hier mit dem kleinen TypoScript kann man das locker umsetzen.

Konstanten:
baseURL = http://www.domain.ltd/

Setup:
# **
# * socialmediabox
# ********************
lib.field_smb = COA
lib.field_smb {
  10 = TEXT
  10 {
    typolink.parameter.data = getIndpEnv:REQUEST_URI
    typolink.returnLast = url
    wrap (
    <li class="google">
    <div class="g-plusone" data-size="medium" data-href="{$baseURL}|"></div>
    <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);
      })();
    </script>
    </li>
    )
  }
  20 = TEXT
  20 {
    typolink.parameter.data = getIndpEnv:REQUEST_URI
    typolink.returnLast = url
    wrap (
    <li class="twitter"><a href="https://twitter.com/share" class="twitter-share-button" data-url="{$baseURL}|" data-size="medium">Tweet</a>
    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
    </li>
  )
  }
  30 = TEXT
  30 {
    typolink.parameter.data = getIndpEnv:REQUEST_URI
    typolink.returnLast = url
    wrap (
    <li class="facebook"><div class="fb-like" data-href="{$baseURL}|" data-send="false" data-layout="button_count" data-width="450" data-show-faces="false"></div>
    <div id="fb-root"></div>
    <script>(function(d, s, id) {
      var js, fjs = d.getElementsByTagName(s)[0];
      if (d.getElementById(id)) return;
      js = d.createElement(s); js.id = id;
      js.src = "//connect.facebook.net/de_DE/all.js#xfbml=1&appId=459667507386498";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));</script>
    </li>
    )
  }
 wrap = <ul class="smb">|</ul> 
}

Viel Spaß damit 😉

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.