MODUL: Facebook, Twitter & Google+ datenschutzkonform mit Shariff

[indigo]

Hallo zusammen,

nachdem ich eigentlich das socialshareprivacy-Plugin verwendet hatte, habe ich nun auf den Shariff aktualisiert und möchte euch gerne mein Vorgehen beim Einbau vorstellen:

1) Shariff herunterladen (https://github.com/heiseonline/shariff/releases/latest) und entpacken. Es bietet sich an in Shop-Installation ein Unterverzeichnis "shariff" anzulegen und die Dateien dort hin zu legen.

2) Das Shariff Backend in PHP (https://github.com/heiseonline/shariff-backend-php/releases) herunterladen und entpacken. Es wird nur der Inhalt des Ordners "build" benötigt. Diesen am besten in den im ersten Schritt angelegten "shariff" Ordner schieben und in "backend" umbenennen.

2a) Die Datei shariff/backend/shariff.json euren Wünschen anpassen. Zumindest hier eure URL eintragen. Anpassungsmöglichkeiten findet ihr unter https://github.com/heiseonline/shariff-backend-php

3) die includes/header.php öffnen und eine geeignete Stelle suchen. Zum Beispiel vor

Code: PHP  [Auswählen]

if (strstr($PHP_SELF, FILENAME_CHECKOUT_PAYMENT)) {

folgenden Code einfügen:

Code: PHP  [Auswählen]

// BOF - shariff social share plugin
echo '<link href="/shariff/shariff.complete.css" rel="stylesheet">';
// EOF - shariff social share plugin

Bitte beachten: Wenn ihr bereits den Webfont "Font Awesome" auf euer Seite verwendet, dann könnt ihr stattdessen shariff.min.css referenzieren.

4) Die includes/application_bottom.php bearbeiten und vor

Code: PHP  [Auswählen]

// end of page
echo '</body>';

folgenden Code einfügen:

Code: PHP  [Auswählen]

// BOF - shariff social share plugin
echo '<script src="/shariff/shariff.complete.js"></script>';
// EOF - shariff social share plugin

5) Je nachdem wo ihr überall die Anzeige für die Social Buttons verwenden möchtet, entweder die index.html oder eine der Dateien unter module/product_info/ bearbeiten und dort an gewünschter Stelle die Anzeige einbauen:

Code: PHP  [Auswählen]

<div class="shariff" data-backend-url="/shariff/backend" data-theme="grey" data-orientation="horizontal"></div>

Hinweis: Wenn ihr die index.html nutzt empfiehlt es sich ggf. die Anzeige der Buttons im Checkout-Prozess (Warenkorb etc.) auszublenden. Das könnt ihr realisieren mit:

Code: PHP  [Auswählen]

{if !strstr ($smarty.server.PHP_SELF, 'checkout')}
                <div class="shariff" data-backend-url="/shariff/backend" data-theme="grey" data-orientation="horizontal"></div>
          {/if}

Dabei könnt ihr noch mittels "data-theme" und "data-orientation" das Design anpassen. Mehr Infos und Vorschau gibt's hier: https://github.com/heiseonline/shariff

Viele Grüße
Christian

Screenshots aus Modul für Shopversion 2.x:

[ Für Gäste sind keine Dateianhänge sichtbar ] [ Für Gäste sind keine Dateianhänge sichtbar ] [ Für Gäste sind keine Dateianhänge sichtbar ] [ Für Gäste sind keine Dateianhänge sichtbar ]

[EDIT Tomcraft 19.05.2016: Modul für Shopversion 2.x eingefügt, Danke an kgd.]
[EDIT Tomcraft 20.05.2016: Modul für Shopversion 2.x aktualisiert, Danke an kgd.]
[EDIT Tomcraft 20.05.2016: Modul für Shopversion 2.x aktualisiert, Danke an kgd.]
[EDIT Tomcraft 20.05.2016: Modul für Shopversion 2.x aktualisiert, Danke an kgd.]
[EDIT Tomcraft 20.05.2016: Fehler in Modul für Shopversion 2.x korrigiert, Danke an kgd.]
[EDIT Tomcraft 20.05.2016: Screenshots aus Modul für Shopversion 2.x angehängt & Modul für Shopversion 2.x aktualisiert, Danke an kgd.]
[EDIT Tomcraft 27.05.2016: Modul für Shopversion 2.x aktualisiert.]
[EDIT Tomcraft 06.06.2016: Modul für Shopversion 2.x aktualisiert.]
[EDIT Tomcraft 08.06.2016: Modul für Shopversion 2.x aktualisiert.]
[EDIT Tomcraft 17.06.2016: Modul für Shopversion 2.x aktualisiert.]
[EDIT Tomcraft 28.07.2016: Modul für Shopversion 2.x aktualisiert.]
[EDIT Tomcraft 28.07.2016: Modul für Shopversion 2.x aktualisiert.]
[EDIT Tomcraft 12.08.2016: Modul für Shopversion 2.x aktualisiert.]
[EDIT Tomcraft 16.03.2018: Modul v1.24.0 aktualisiert und neue Version v3.0.0 ergänzt.]
[EDIT Tomcraft 18.03.2018: Fehler in Modulen für Shopversion 2.x korrigiert, Danke an kgd.]
[EDIT Tomcraft 02.03.2019: Fehler in Modulen für Shopversion 2.x korrigiert, Danke an noRiddle.]
[EDIT Tomcraft 28.03.2019: Fehler in Modulen für Shopversion 2.x korrigiert, Danke an voodoopupp.]
[EDIT Tomcraft 12.06.2019: Fehler in Modulen für Shopversion 2.x korrigiert, Danke an noRiddle.]
[EDIT Tomcraft 12.04.2021: Fehler in Modulen für Shopversion 2.x korrigiert.]
[EDIT Tomcraft 24.05.2022: Fehler in Modulen für Shopversion 2.x korrigiert.]
[EDIT Tomcraft 14.11.2022: Neue Version v3.2.1 ergänzt.]

Linkback: https://www.modified-shop.org/forum/index.php?topic=32738.0

[MW]

Ich sage einfach mal Danke für das erstellen deiner Anleitung! 

Hatte mir das zwar schon im Dezember, kurz nach dem Beitrag in der C't in einen Shop verbaut, habe aber jetzt die Gelegenheit genutzt gleich mit deiner Umsetzung auf die neuste Version umzusteigen. 

[noRiddle (revilonetz)]

Vielen Dank indigo für die Anleitung.

Ein wenig Kritik:
Die CSS-Einbindung gehört in /templates/YOUR_TEMPLATE/css/general.css.php .
Die Javascript-Einbindung gehört in /templates/YOUR_TEMPLATE/javascript/general.js.php .

Dafür sind diese Dateien nämlich da um sich im Falle der Bearbeitung von CSS und/oder JS nicht alles zusammensuchen zu müssen.

Wer Javascript im Footerbereich laden möchte, was sehr sinnvoll ist für die Ladegeschwindigkeit der Seite, sollte das Include der general.js.php aus der /includes/header.php in die /includes/application_bottom.php verlagern.

Gruß,
noRiddle

[Markhth]

Hallo liebe Comunity,

Ich hab' eine Frage an euch bezüglich den Sozialen Buttons.
Ich möchte die vertikal untereinander auf der rechten bodyseite (aussen), und möchte nicht nur google facebook und tweeter haben sondern auch alle anderen buttons. weiss jemand wie ich dass hinbekomme, habs laut anleitung versucht, aber ich komme nicht wirklich klar damit, hab zwar 3 von denen auf die seite gebracht, mehr habe ich aber nicht geschafft.

Bez. dem wie ichs haben möchte habe ich zur veranschaulichung noch ein bild angehängt.
würde mich sehr über hilfreiche antworten freuen.

Danke
LGM

[TrueSlide]

Wäre das hier vielleicht etwas für dich?
http://www.modified-shop.org/forum/index.php?topic=13847.0

[Markhth]

Ja genau das habe ich gesucht! ganz vielen dank!

lgm

[hunt33r]

Genau das habe ich gesucht. Werde ich mal testen.
Vielen Dank an noRiddle, diese Optimierungen sind goldwert!

[StigPfau]

Hallo,

die Sharing Buttons werden leider nicht angezeigt.
Siehe hier:

Code in product_listing:

Code: PHP  [Auswählen]

             {if $PRODUCTS_DATE_AVIABLE != ''}<p>{$PRODUCTS_DATE_AVIABLE}</p>{/if}

                <div class="shariff" data-backend-url="/shariff/backend" data-theme="grey" data-orientation="horizontal"></div>

    <hr>

Kann hier jemand helfen?

[karsta.de]

Der Ordner shariff sollte im Hauptverzeichnis liegen (ohne slash davor).

Bei mir funktioniert es so:

Code: Text  [Auswählen]

<div class="shariff" data-backend-url="shariff/backend" data-theme="grey" data-orientation="horizontal"></div>

Und das JavaScript sollte unbedingt in der application_bottom.php liegen.
Also vor echo '</body></html>'; das einfügen:

Code: PHP  [Auswählen]

<script src="<?php echo 'templates/'.CURRENT_TEMPLATE; ?>/javascript/shariff.complete.js" type="text/javascript"></script>

[Bonsai]

Ja, das Javascript UNBEDINGT unten einbauen und nicht im Header!

Wer wissen will wie man mehr als 3 Knöpfe hinbekommt:

Code: PHP  [Auswählen]

<div class="shariff" data-backend-url="/shariff/backend" data-orientation="vertical" data-services=["facebook","googleplus","twitter","linkedin","xing","reddit","pinterest","flattr","stumbleupon","whatsapp","info"]></div>

Ergibt das:

[ Für Gäste sind keine Dateianhänge sichtbar ]

[StigPfau]

Ach super.
Vielen Dank.

[rjung]

Super Sache, aber warum werden bei mir die Verlinkungen nicht gezählt ?

zb. diesen Artikel hab ich bei Facebook geteilt
http://www.firework-shop.de/Feuerwerk-und-Zubehoer/Anzuendmittel/Visco-und-Anzuendlitze/Visco-Anzuendlitze-gruen-ca-30-s-m-10m-Rolle::104058.html

grüße
René

[rjung]

Beim Teilen via pinterest kommt die Fehlermeldung

Hoppla!

Parameter 'image_url' (value http:) is not a valid URL format.

[karsta.de]

Das Anzeigen der Follower wird erst ab PHP 5.4 unterstützt.
https://github.com/heiseonline/shariff-backend-php/blob/master/composer.json

Mußte du mal schauen, was du bei deinem Provider eingestellt hast.

[scooterama]

Sieht super aus, vielen Dank für das Bereitstellen. Hat jemand von euch das schon mehrsprachig in betrieb? Das wäre jetzt noch das "Tüpfelchen auf dem i"