Wie füge ich nach jedem Beitrag ein Dropdown-Menü zum Teilen hinzu? (Javascript)
Die folgende Dropdown-Liste zum Teilen des aktuellen Beitrags mit einer Reihe von Websites wurde dem WordPress-Blog hinzugefügt (Sie können ihn auch zu Ihrer eigenen Website hinzufügen).
Freigabe-Dropdown-Liste-Javascript
Der Javascript- und HTML-Code sieht wie folgt aus und Sie können ihn an der Stelle hinzufügen, an der die Artikel angezeigt werden (z. B. single.php im WordPress-Template).
<script language="Javascript">
function openlink(link) {
if (link) {
var title = document.title.split(" | ")[0];
var url = window.location;
var x = "";
if (link == "milnk") {
x = "<a class="vglnk" target="_blank" href="http://milnk.com/link/submit?u=" rel="nofollow"><span>http</span><span>://</span><span>milnk</span><span>.</span><span>com</span><span>/</span><span>link</span><span>/</span><span>submit</span><span>?</span><span>u</span><span>=</span></a>" + encodeURIComponent(url) + "&t=" + encodeURIComponent(title);
}
else if (link == "wayback") {
x = "<a class="vglnk" target="_blank" href="http://web.archive.org/save/" rel="nofollow"><span>http</span><span>://</span><span>web</span><span>.</span><span>archive</span><span>.</span><span>org</span><span>/</span><span>save</span><span>/</span></a>" + url;
}
if (x) {
window.open(x);
}
}
}
</script>
<select onchange="javascript:openlink(this.value)">
<option selected="">Share This to...</option>
<option value="milnk">Milnk</option>
<option value="wayback">Wayback Machine</option></select>
Die aktuelle URL wird mit Javascript window.location und der Titel mit document.title abgerufen. Die Funktion encodeURIComponent wird verwendet, um die Sonderzeichen in der URL-Zeichenfolge zu codieren.
Um weitere Optionen zu aktivieren (Website teilen), müssen Sie nur entsprechend weitere if-Anweisungen hinzufügen. Um dies zu sehen, zeigen Sie den HTML-Quellcode der aktuellen Seite an und Sie sehen eine vollständige Liste der Freigabeoptionen.
Update: 02.01.2016 Einfaches HinzufügenDieser Code ist auf github verfügbar: (Optionen für Tumblr- und QR-Code hinzufügen )
https://github.com/DoctorLai/addthis
Verwendungszweck:
<script>
var sharedropdown_english = true; // Set false if using Chinese
var sharedropdown_rss = null; // Feed URL subscription
</script>
<div id="sharedropdown"> </div>
<div id="sharedropdown_qr"> </div>
<script src="<a class="vglnk" target="_blank" href="https://helloacm.com/js/addthis.js" rel="nofollow"><span>https</span><span>://</span><span>helloacm</span><span>.</span><span>com</span><span>/</span><span>js</span><span>/</span><span>addthis</span><span>.</span><span>js</span></a>" async></script>