Statische Share-Buttons

Statische Buttons für mehr Performance

Statisch ist fast immer besser, denn statisch verbraucht keine unnötigen Ressourcen und telefoniert nicht nach Haus. Gerade in Zeiten, in denen der Datenschutz immer wichtiger wird, ist eine statische Lösung daher eine saubere. Die gibt es sogar mit Counter, sodass ihr nicht einmal auf die Anzeige der Anzahl an Share etc. verzichten müsst. Sucht euch einfach die Gewünschte Variante aus und fügt den Code einfach dort ein, wo die Share-Buttons erscheinen sollen.

Statische Share-Buttons als Text:

<b>Teilen auf...</b>
<a title="Bei Twitter empfehlen" href="https://twitter.com/intent/tweet?source=webclient&amp;text=&lt;?php echo rawurlencode(strip_tags(get_the_title())) ?&gt; &lt;?php echo urlencode(get_permalink($post-&gt;ID)); ?&gt;" target="blank" rel="nofollow">Twitter</a> |
<a title="Bei Facebook empfehlen" href="https://www.facebook.com/sharer/sharer.php?u=&lt;?php echo urlencode(get_permalink($post-&gt;ID)); ?&gt;&amp;t=&lt;?php echo rawurlencode(strip_tags(get_the_title())) ?&gt;" target="blank" rel="nofollow">Facebook</a> |
<a title="Bei Google+ empfehlen" href="https://plusone.google.com/_/+1/confirm?hl=de&amp;url=&lt;?php echo urlencode(get_permalink($post-&gt;ID)); ?&gt;&amp;title=&lt;?php echo rawurlencode(strip_tags(get_the_title())) ?&gt;" target="blank" rel="nofollow">Google+</a>

Beispiel:

 


Statische Share-Buttons mit farbigen Text:

<b>Teilen auf...</b>
<a style="color: #5db5de; font-weight: bold;" title="Bei Twitter empfehlen" href="https://twitter.com/intent/tweet?source=webclient&amp;text=&lt;?php echo rawurlencode(strip_tags(get_the_title())) ?&gt; &lt;?php echo urlencode(get_permalink($post-&gt;ID)); ?&gt;" target="blank" rel="nofollow">Twitter</a> |
<a style="color: #3d62b3; font-weight: bold;" title="Bei Facebook empfehlen" href="https://www.facebook.com/sharer/sharer.php?u=&lt;?php echo urlencode(get_permalink($post-&gt;ID)); ?&gt;&amp;t=&lt;?php echo rawurlencode(strip_tags(get_the_title())) ?&gt;" target="blank" rel="nofollow">Facebook</a> |
<a style="color: #d34836; font-weight: bold;" title="Bei Google+ empfehlen" href="https://plusone.google.com/_/+1/confirm?hl=de&amp;url=&lt;?php echo urlencode(get_permalink($post-&gt;ID)); ?&gt;&amp;title=&lt;?php echo rawurlencode(strip_tags(get_the_title())) ?&gt;" target="blank" rel="nofollow">Google+</a>

Beispiel:

Statische-Share-Buttons-mit-farbigen-Text

 


Statische Share Buttons mit CSS:

<a style="background: #5DB5DE; font-weight: bold; color: #fff; padding: 5px 15px 5px 15px;" title="Bei Twitter empfehlen" href="https://twitter.com/intent/tweet?source=webclient&amp;text=&lt;?php echo rawurlencode(strip_tags(get_the_title())) ?&gt; &lt;?php echo urlencode(get_permalink($post-&gt;ID)); ?&gt;" target="blank" rel="nofollow">Twitter</a>
<a style="background: #3D62B3; font-weight: bold; color: #fff; padding: 5px 15px 5px 15px;" title="Bei Facebook empfehlen" href="https://www.facebook.com/sharer/sharer.php?u=&lt;?php echo urlencode(get_permalink($post-&gt;ID)); ?&gt;&amp;t=&lt;?php echo rawurlencode(strip_tags(get_the_title())) ?&gt;" target="blank" rel="nofollow">Facebook</a>
<a style="background: #D34836; font-weight: bold; color: #fff; padding: 5px 15px 5px 15px;" title="Bei Google+ empfehlen" href="https://plusone.google.com/_/+1/confirm?hl=de&amp;url=&lt;?php echo urlencode(get_permalink($post-&gt;ID)); ?&gt;&amp;title=&lt;?php echo rawurlencode(strip_tags(get_the_title())) ?&gt;" target="blank" rel="nofollow">Google+</a>

Beispiel:

Statische-Share-Buttons-mit-CSS-Hintergrund

 


Statische Share Buttons mit CSS und Counter:

<div id="share"><a style="background: #3D62B3; color: #fff; padding: 3px 10px 3px 10px;" title="Bei Facebook empfehlen" href="https://www.facebook.com/sharer/sharer.php?u=&lt;?php echo urlencode(get_permalink($post-&gt;ID)); ?&gt;&amp;t=&lt;?php echo rawurlencode(strip_tags(get_the_title())) ?&gt;" target="blank" rel="nofollow">Facebook <!--?php $URL = get_permalink();function get_shares($URL) { $json_string = file_get_contents('http://graph.facebook.com/?ids=' . $URL); $json = json_decode($json_string, true); return intval( $json[$URL]['shares'] );} ?--><!--?php echo get_shares($URL); ?--></a> <a style="background: #5DB5DE; color: #fff; padding: 3px 10px 3px 10px;" title="Bei Twitter empfehlen" href="https://twitter.com/intent/tweet?source=webclient&amp;text=&lt;?php echo rawurlencode(strip_tags(get_the_title())) ?&gt; ➨ &lt;?php echo urlencode(get_permalink($post-&gt;ID)); ?&gt;" target="blank" rel="nofollow">Twitter <!--?php $URL = get_permalink();function get_retweets($URL) { $SBstring = file_get_contents('http://urls.api.twitter.com/1/urls/count.json?url=' . $URL); $SBarray = json_decode($SBstring, true); return intval( $SBarray['count'] );} ?--><!--?php echo get_retweets($URL);?--></a> <a style="background: #D34836; color: #fff; padding: 3px 10px 3px 10px;" title="Bei Google+ empfehlen" href="https://plusone.google.com/_/+1/confirm?hl=de&amp;url=&lt;?php echo urlencode(get_permalink($post-&gt;ID)); ?&gt;&amp;title=&lt;?php echo rawurlencode(strip_tags(get_the_title())) ?&gt;" target="blank" rel="nofollow">Google+ <!--?php $URL = get_permalink();function get_plusone($url) { $curl = curl_init(); curl_setopt($curl, CURLOPT_URL, "https://clients6.google.com/rpc"); curl_setopt($curl, CURLOPT_POST, 1); curl_setopt($curl, CURLOPT_POSTFIELDS, '[{"method":"pos.plusones.get","id":"p","params":{"nolog":true,"id":"' . $url . '","source":"widget","userId":"@viewer","groupId":"@self"},"jsonrpc":"2.0","key":"p","apiVersion":"v1"}]'); curl_setopt($curl, CURLOPT_RETURNTRANSFER, true); curl_setopt($curl, CURLOPT_HTTPHEADER, array('Content-type: application/json')); $curl_results = curl_exec ($curl); curl_close ($curl); $json = json_decode($curl_results, true); return intval( $json[0]['result']['metadata']['globalCounts']['count'] );} ?--><!--?php echo get_plusone($URL); ?--></a></div>

Beispiel:

Statische-Share-Buttons-mit-CSS-Hintergrund-und-Counter

 


 

Schnell und benutzerfreundlich

Das gute an statischen Social-Buttons ist, wie bereits erwähnt, vor allem die Geschwindigkeit. Doch auch abseits der Performance bringen die Buttons Vorteile, denn sie sind auch wesentlich benutzerfreundlicher und lassen sich, da sie nur Bilder verwenden oder sogar nur aus ein wenig CSS bestehen, relativ frei an die eigene Website anpassen. So sind Designs möglich, die sich perfekt in das verwendete WordPress Theme integrieren und daher einen hübscheren Gesamteindruck hinterlassen. Letztendlich ist es aber wirklich nur die Performance, die ausschlaggebend dafür ist, dass wirklich jeder Blogger statische Buttons verwenden sollte. Da dies ganz einfach ist, stellt es auch keinerlei Ansprüche und kann selbst von Anfängern umgesetzt werden.

 

Christian
Christian
Mein Name ist Christian und ich bin Mitgründer der Plattform fastWP. Hier im Magazin bin ich für die eher "technisch" lastigen Themen zuständig aber schreibe gerne über das Thema SEO, das nun bereits seit über 10 Jahren zu meiner Leidenschaft gehört.

HINTERLASSEN SIE EINE ANTWORT

Please enter your comment!
Please enter your name here

fastWP

Finde den passenden WordPress Dienstleister in deiner Region!

Deine Werbung hier?

Nutze die Reichweite von fastWP und erreiche deine Zielgruppe!

weiter zu Raidboxes