Social Media-Buttons: statische Links per Popup öffnen

Social Media-Links per Popup-Fenster öffnen
Geschätzte Lesezeit: 2 Minuten

Vor einiger Zeit entschied ich mich, meine Social Media-Buttons nach Tanjas Lösung statisch in meinen Blogs einzubinden. Eine kleine Ergänzung, wie auch Posttags des jeweiligen Beitrages als Hashtags dem Tweet hinzugefügt werden können, habe ich bei  Lioman gefunden.
Somit wäre bis auf den fehlenden Url-Verkürzer das Teilen via statischem Link „fast“ perfekt. Denn eine Kleinigkeit hat mich immer noch gestört: dass sich die Links als Tab oder Fenster öffnen statt als Popup.

Aber auch hierfür habe ich eine geniale und gleichzeitig einfache Lösung gefunden. Auf der Seite Homepage-Buttons ist nicht nur sehr schön beschrieben, wie ich ein Popup-Fenster ohne Javasript erstellen kann. Auch ein Beispielcode mit Erklärung der einzelnen Parameter steht zur Verfügung.

Beispiel Twitter

So sah der Code für meinen Twitter-Button vorher aus:

<div class="e-twitter">
 <a href="https://twitter.com/intent/tweet?source=webclient&text=<?php echo rawurlencode(strip_tags(get_the_title())).'&via=RebuSylvi&url=' , urlencode(get_permalink($post->ID))?>&hashtags='<?php $posttags = get_the_tags();$count=0;if ($posttags) {foreach($posttags as $tag) {$count++;if ($count <= 3) {echo $tag->name . ',';}}}?>" target="blank" title="Bei Twitter empfehlen"><img src="<?php bloginfo('template_url')?>/eigene-buttons/twitter_1.png" alt="Twittern" style="float:left;width:71px;" /></a>
 <div class="e-zaehler">
  <?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'] );
  } ?>
  <div class="e-zaehler-text"><?php echo get_retweets($URL);?></div>
 </div>
</div>

Und hier die Version, nachdem ich den Popup-Code hinzugefügt habe:

<div class="e-twitter">
 <a target="popup" onclick="window.open  ('', 'popup', 'width=500,height=500,scrollbars=no, toolbar=no,status=no,resizable=yes,menubar=no,location=no,directories=no,top=50,left=50') "href="https://twitter.com/intent/tweet?source=webclient&text=<?php echo rawurlencode(strip_tags(get_the_title())).'&via=RebuSylvi&url=' , urlencode(get_permalink($post->ID))?>&hashtags='<?php $posttags = get_the_tags();$count=0;if ($posttags) {foreach($posttags as $tag) {$count++;if ($count <= 3) {echo $tag->name . ',';}}}?>" target="blank" title="Bei Twitter empfehlen"><img src="<?php bloginfo('template_url')?>/eigene-buttons/twitter_1.png" alt="Twittern" style="float:left;width:71px;" /></a>
 <div class="e-zaehler">
  <?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'] );
  } ?>
  <div class="e-zaehler-text"><?php echo get_retweets($URL);?></div>
 </div>
</div>

 

Sollte das Popup-Fenster nicht gleich funktionieren, so könnte es an den Zeilenumbrüchen innerhalb des Codes liegen. Daher bitte darauf achten, dass der Code nicht umbrochen wird.

Viel Spaß beim Ausprobieren. smilie

Hinweis
Dieser Beitrag bezieht sich auf Codierungen oder/und Funktionen, die ich noch in meinem alten Template umgesetzt habe. Es ist möglich, dass sie in dem aktuellen Blog-Theme nicht übernommen wurden und somit die Darstellung bzw. Funktion nicht mehr existiert.

Die Autorin:

Sylvi

Meine Beiträge beinhalten eigene Erfahrungen über Soft- und Hardware, Social Media und die ich als WordPress-Bloggerin und Joomlanerin gesammelt habe. Zudem widme ich mich dem schönen Hobby "Fotografie".

10 Kommentare

Kommentare hinzufügen

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Du kannst diese HTML-tags und attribute verwenden: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

* Ich bin mit den Datenschutzbedingungen von Sylvis Blog einverstanden.

Copyright © Sylvis Blog • 2019. Alle Rechte vorbehalten. •   Impressum   •    Datenschutzerklärung