MovableType mit Heise 2 Klick Lösung.

heise-2-klick.jpegAuch wenn ich selbst die Buttons wenig nutze wollte ich den Lesern auf dem Blog eine aus meiner Sicht Datenschutzakzeptable Lösung anbieten und die 2 Klick Lösung von Heise einbauen. Auf diese Weise kann ein Leser der sich dazu entscheidet die Buttons von Facebook und Co drücken währen ein andere Nutzer nicht schon beim Betreten des Blogs diese direkt Facebook mitteilt. 

Auf diese Weise konnte ich dies einrichten.
Auspacken des Codes von hier in das Stammverzeichnis des Blogs (bei mir /socialshareprivacy) kopieren. Das notwendige jquery Plugins ist schon durch die bootstrap Installation vorhanden. Ansonsten müsste das ebenfalls noch auf dem Web Server abgelegt werden

In das Modultemplate Header folgende Zeilen in den html header einfügen

<link href="<$mt:BlogURL$>socialshareprivacy/socialshareprivacy.css" rel="stylesheet">
<script src="<$mt:BlogURL$>bootstrap/js/jquery.min.js"></script>
<script type="text/javascript" src="<$mt:BlogURL$>socialshareprivacy/jquery.socialshareprivacy.js"></script>
  .....
</head>

Wichtig. Es muss anscheinend auch das Javascript in den Header. Normalerweise füge ich JS erst am Ende ein, aber wenn man dies hier macht dann klappt es nicht.

Ziel war es das Modul so zu installieren das es mehrfach auf einer Seite aufgerufen werden kann. Das hat leider nicht so richtig geklappt also habe ich erstmal ein Template Modul "SocialSharePrivacy" erstellt das ich in die das "Entry" Template eingefügt habe.

<div id="social-<$mt:EntryID$>"></div>
<script type="text/javascript">
    jQuery(document).ready(function($)
    {
      if($('#social-<$mt:EntryID$>').length > 0)
      {
        $('#social-<$mt:EntryID$>').socialSharePrivacy(
           {
           services :
             {
                   facebook : {'perma_option'  : 'on'},
                   twitter : { 'perma_option' : 'on' },
                   gplus : {'perma_option' : 'on'  }
              }
           },
        { uri : "<$mt:EntryPermalink$>"}
         );
      }
    });
  </script>

Jetzt werden noch Änderungen in der socialshareprivacy.css und der jquery.socialshareprivacy.js notwendig. Die relativen Pfade auf die Images müssen in absolute umgewandelt werden.

    socialshareprivacy/images/socialshareprivacy_on_off.png
    /socialshareprivacy/images/socialshareprivacy_on_off.png


Vielleicht bekomme ich es noch später hier diese Plugin auch mehrfach in den Index Archiven einzubauen