Alternative zu 2-Klick-Button Lösung mit erweiterten Eigenschaften
Hi Folks,
die 2-Klick-Lösung von Heise empfand ich immer als umständlich un unschön, wenn auch diese Ihren Zweck erfüllte.
Vor geräumer Zeit hatte Heise eine weitere Möglichkeit veröffentlicht:
Heise Bericht Shariff >>
Nun, ja ich habe diese Lösung bis zu einem gewissen Grad, als erweiterte Eigenschaften für Siq. Web/Shop und Web-/-Shop to Date integriert ...
- Systemvoraussetzung: mindestens PHP 5.5 und JQuery 1.7.0
- ! Dateien, die verändert werden sollen immer vorher sichern !
Installation:
========
1.) Datei entpacken. Daraus das shariff-Verzeichnis in dem Common-Verzeichnis von Siquando / Web to Date / Shop kopieren.
2.) in der config.ccml einfügen:
--------------------------------
Code:
<cc:*>Shariff Social Networks 1-Klick Lösung</cc:*>
<cc:property id="socialbutton.shariff.on" caption="Script für Website aktivieren" folder="Shariff Social Network 1-Klick" targettype="site" type="boolean" default="0" >
<cc:property id="socialbutton.shariff.fontawesome.ready" caption="Font Awesome bereits vorhanden?" folder="Shariff Social Network 1-Klick" targettype="site" type="boolean" default="0">
<cc:property id="socialbutton.shariff.shareurl.link" caption="Zu teilende Webseite-Adresse eingeben" folder="Shariff Social Network 1-Klick" targettype="site" type="link">
<cc:property id="socialbutton.shariff.info.on" caption="Info Button allgemein an" folder="Shariff Social Network 1-Klick" targettype="site" type="boolean" default="1">
<cc:property id="socialbutton.shariff.facebook.on" caption="Facebook Button an" folder="Shariff Social Network 1-Klick" targettype="paragraph" targetsubtype="text" type="boolean" default="0">
<cc:property id="socialbutton.shariff.twitter.on" caption="Twitter Button an" folder="Shariff Social Network 1-Klick" targettype="paragraph" targetsubtype="text" type="boolean" default="0">
<cc:property id="socialbutton.shariff.googleplus.on" caption="Google Plus Button an" folder="Shariff Social Network 1-Klick" targettype="paragraph" targetsubtype="text" type="boolean" default="0">
<cc:property id="socialbutton.shariff.addthis.on" caption="AddThis Button an" folder="Shariff Social Network 1-Klick" targettype="paragraph" targetsubtype="text" type="boolean" default="0">
<cc:property id="socialbutton.shariff.linkedin.on" caption="LinkedIn Button an" folder="Shariff Social Network 1-Klick" targettype="paragraph" targetsubtype="text" type="boolean" default="0">
<cc:property id="socialbutton.shariff.pinterest.on" caption="Pinterest Button an" folder="Shariff Social Network 1-Klick" targettype="paragraph" targetsubtype="text" type="boolean" default="0">
<cc:property id="socialbutton.shariff.reddit.on" caption="Reddit Button an" folder="Shariff Social Network 1-Klick" targettype="paragraph" targetsubtype="text" type="boolean" default="0">
<cc:property id="socialbutton.shariff.stumbleupon.on" caption="StumbleUpon Button an" folder="Shariff Social Network 1-Klick" targettype="paragraph" targetsubtype="text" type="boolean" default="0">
<cc:property id="socialbutton.shariff.xing.on" caption="Xing Button an" folder="Shariff Social Network 1-Klick" targettype="paragraph" targetsubtype="text" type="boolean" default="0">
<cc:property id="socialbutton.shariff.whatsapp.on" caption="WhatsApp Button an" folder="Shariff Social Network 1-Klick" targettype="paragraph" targetsubtype="text" type="boolean" default="0">
<cc:property id="socialbutton.shariff.mail.on" caption="Mail Button an" folder="Shariff Social Network 1-Klick" targettype="paragraph" targetsubtype="text" type="boolean" default="0">
<cc:property id="socialbutton.shariff.tumblr.on" caption="Tumblr Button an" folder="Shariff Social Network 1-Klick" targettype="paragraph" targetsubtype="text" type="boolean" default="0">
<cc:property id="socialbutton.shariff.flattr.on" caption="Flattr Button an" folder="Shariff Social Network 1-Klick" targettype="paragraph" targetsubtype="text" type="boolean" default="0">
<cc:property id="socialbutton.shariff.diaspora.on" caption="Diaspora Button an" folder="Shariff Social Network 1-Klick" targettype="paragraph" targetsubtype="text" type="boolean" default="0">
<cc:property id="socialbutton.shariff.threema.on" caption="Threema Button an" folder="Shariff Social Network 1-Klick" targettype="paragraph" targetsubtype="text" type="boolean" default="0">
<cc:property id="socialbutton.shariff.mail.link" caption="EMail-Adresse für Mail-Button" folder="Shariff Social Network Settings" targettype="paragraph" targetsubtype="text" type="link">
<cc:property id="socialbutton.shariff.orientation" caption="Anordnung der Buttons" folder="Shariff Social Network Settings" targettype="paragraph" targetsubtype="text" type="combo" comboitems="horizontal|vertical" default="horizontal">
<cc:property id="socialbutton.shariff.theme" caption="Layout Variante" folder="Shariff Social Network Settings" targettype="paragraph" targetsubtype="text" type="combo" comboitems="standard|grey|white" default="standard">
<cc:property id="socialbutton.shariff.flattr.kat" caption="Kategorie für Flattr-Spende" folder="Shariff Social Network Settings" targettype="paragraph" targetsubtype="text" type="string" default="Ohne Angabe">
<cc:property id="socialbutton.shariff.flattr.receiver" caption="Benutzer der die Flattr-Spende erhält" folder="Shariff Social Network Settings" targettype="paragraph" targetsubtype="text" type="string" default="Ohne Angabe">
3.) in der global.ccml einfügen:
--------------------------------
Code:
<cc:*>Shariff Social Networks 1-Klick Lösung</cc:*>
<cc:include src="\shariff\ccml\global_shariff.ccml" common="1">
4.) in der navigation.ccml einfügen:
-------------------------------------
a.) im <head>-Bereich, unmittelbar nach dem letzten <link rel="..." ....>
Code:
<cc:include src="\shariff\ccml\navigation_head.ccml" common="1">
b.) Evtl. die notwendige JQuery-Bibliothek wie folgt einbinden (1.7.0 oder höher:
Code:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
Die Zeile darunter wie folgt auskommentieren:
Code:
<cc:*><script type="text/javascript" src="<cc:print value="&jquery.url">"></script></cc:*>
c.) Unmittelbar vor dem schliessenden Body-Tag (</body>)einfügen:
Code:
<cc:include src="\shariff\ccml\navigation_foot.ccml" common="1">
5.) Backend [OPTIONAL]:
--------------------------
Wer ein Zähler wünscht muss noch das Backend installieren. Da gibt es diverse Möglichkeiten und Konfigurationen --> siehe
Original-Doku von Shariff-Heise.
Es werden lt. Heise noch nicht alle Portale unterstützt.
Folgende werden derzeit unterstützt: "GooglePlus","Facebook","LinkedIn","Reddit","Stumb leUpon","Flattr","Pinterest","Xing","AddThis"
Ich habe eine Grundkonfiguration mit eingebaut - konnte es jedoch noch nicht ausführlich testen ... Tja, so ist das, wenn man nicht soooo in den sozialen Netzwerken unterwegs ist ...
WICHTIG: Solange Ihr die Seite mit Siquando erzeugt, ist alles prima. Wenn Ihr aber die Seite veröffentlicht, neigt das FTP-Modul von siquando, alles schön in "Kleinschrift" zu übertragen ...
Dabei ist es jedoch absolut erforderlich die Dateien unverändert zu lassen. Einige der Dateien sind nämlich auch mit großen Anfangsbuchstaben versehen und werden so von den Scripts nicht mehr gefunden ... Heißt das Backend mit einem externen FTP-Programm hochladen !
Der Backend-Ordner befindet sich nach dem Erzeugen der Seite im assets-Verzeichnis und heißt schlicht backend. Diesen Ordner im assets-Verzeichnis der Online-Seite hochladen ...
6.) Funktionsweise:
---------------------
I. Es gibt 4 erweiterte Websiten-Eigenschaften:
Code:
<cc:property id="socialbutton.shariff.on" caption="Script für Website aktivieren" folder="Shariff Social Network 1-Klick" targettype="site" type="boolean" default="0" >
<cc:property id="socialbutton.shariff.fontawesome.ready" caption="Font Awesome bereits vorhanden?" folder="Shariff Social Network 1-Klick" targettype="site" type="boolean" default="0">
<cc:property id="socialbutton.shariff.shareurl.link" caption="Zu teilende Webseite-Adresse eingeben" folder="Shariff Social Network 1-Klick" targettype="site" type="link">
<cc:property id="socialbutton.shariff.info.on" caption="Info Button allgemein an" folder="Shariff Social Network 1-Klick" targettype="site" type="boolean" default="1">
a.) Damit das Modul überhaupt funktioniert MUSS:
"Script für Website aktivieren" --> auf "ja" geschaltet sein
b.) Die Heise-Lösung berücksichtigt die Möglichkeit ob Font Awesome evtl. andersweitig schon eingebunden ist. In den Fall SOLLTE:
"Font Awesome bereits vorhanden?" --> auf "ja" geschaltet werden
c.) Der Pfad der Webseite, die geteilt werden soll (die Domain zu dieser URL sollte in der Backend-Datei shariff.json unter der Option Domain angepasst werden)
d.)
"Info Button allgemein an" --> Darüber lässt sich das Info-Button ein-und ausblenden
II. Um die Buttons der Platformen an unterschiedlichen Stellen der Seite anzuzeigen, füge ich einfach einen Text-Absatz hinzu (kann auch leer sein) und setze die erweiterte Eigenschaften des Absatzes für meine Einstellungen.
Das war's !
Viel Spaß !
DEMO >>
DOWNLOAD DATEIEN >>
(Enthalten sind: obige Anleitung im TXT-Format, die Master Dateien und Backend-Dateien)
