<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>wemaflo.net &#187; SchülerVZ</title>
	<atom:link href="http://wemaflo.net/tag/schulervz/feed/" rel="self" type="application/rss+xml" />
	<link>http://wemaflo.net</link>
	<description>...nicht die Frage ist indiskret, sondern die Antwort.</description>
	<lastBuildDate>Tue, 17 Jan 2012 19:44:02 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>Tutorial: Teilen-Buttons zu sozialen Netzwerken selbstgemacht</title>
		<link>http://wemaflo.net/2010/11/tutorial-teilen-buttons-zu-sozialen-netzwerken-selbstgemacht/</link>
		<comments>http://wemaflo.net/2010/11/tutorial-teilen-buttons-zu-sozialen-netzwerken-selbstgemacht/#comments</comments>
		<pubDate>Sun, 14 Nov 2010 22:14:14 +0000</pubDate>
		<dc:creator>wemaflo</dc:creator>
				<category><![CDATA[Bloggen]]></category>
		<category><![CDATA[Internet]]></category>
		<category><![CDATA[Tutorials]]></category>
		<category><![CDATA[WordPress]]></category>
		<category><![CDATA[Facebook]]></category>
		<category><![CDATA[meinVZ]]></category>
		<category><![CDATA[Netzwerke]]></category>
		<category><![CDATA[SchülerVZ]]></category>
		<category><![CDATA[Social Bookmarks]]></category>
		<category><![CDATA[StudiVZ]]></category>
		<category><![CDATA[Tutorial]]></category>
		<category><![CDATA[Twitter]]></category>
		<category><![CDATA[Wordpress]]></category>

		<guid isPermaLink="false">http://wemaflo.net/?p=3140</guid>
		<description><![CDATA[Vor einiger Zeit (entschuldige bitte, lieber Einsender! Hab dich total vergessen!) bekam ich eine Mail, in der ich gefragt wurde, mit welchem Plugin ich die Buttons zu Twitter, Facebook und den VZ-Netzwerken einbinde. Aus diesem gegebenen Anlass hier nun die &#8230; <a href="http://wemaflo.net/2010/11/tutorial-teilen-buttons-zu-sozialen-netzwerken-selbstgemacht/">Weiterlesen <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>Vor einiger Zeit (entschuldige bitte, lieber Einsender! Hab dich total vergessen!) bekam ich eine Mail, in der ich gefragt wurde, mit welchem Plugin ich die Buttons zu Twitter, Facebook und den VZ-Netzwerken einbinde. Aus diesem gegebenen Anlass hier nun die öffentliche Antwort: Mit keinem, diese Buttons sind von mir in den Quelltext meines Themes geschrieben worden. Ich nutze also keine externen Dienste, die Ladezeiten unnötig in die Länge ziehen. Hier beschreibe ich nun, wie das jeder selbst tun kann, denn kompliziert ist es nicht.<span id="more-3140"></span></p>
<p><strong>Kleiner Tipp für die, die nicht wissen wollen, wie es geht, sondern nur wollen, dass es geht</strong>: Am Ende des Artikels findet ihr die Codezeilen, die ihr in den Quelltext eures Themes einfügen müsst, lediglich der Abschnitt über Twitter ist zu beachten!</p>
<p>Zuerst mal zum Prinzip: Wir haben einen Button (solche Buttons gibt es im Internet kostenlos zur nicht kommerziellen Nutzung), der mit einem Link auf das jeweilige Netzwerk hinterlegt ist, der gleichzeitig Titel und Link des zu teilenden Artikels enthält. Dafür haben die drei Netzwerke unterschiedliche Vorrichtungen.</p>
<p>Wenden wir uns zuerst einmal Facebook und den VZ-Netzwerken zu, bei ihnen ist die Länge des Links unerheblich, da es nicht wie bei Twitter ein Limit auf 140 Zeichen gibt, bzw. der Link selbst gar nicht angezeigt wird.</p>
<p><strong>Facebook</strong> nutzt dafür eine Datei namens sharer.php. An sie müssen Permalink und Titel des Artikels übergeben werden. Das tun wir über einen Link wie diesen: <a href="http://www.facebook.com/sharer.php?u=example.com&amp;t=Beispiel-Link" target="_blank">http://www.facebook.com/sharer.php?u=example.com&amp;t=Beispiel-Link</a></p>
<p>Facebook empfängt also die URL &#8220;example.com&#8221; und den Titel &#8220;Beispiel-Link&#8221;. Nun wollen wir natürlich, dass automatisch unser Permalink auf dem Artikel und der Titel desselben in diesem Link stehen. Dafür nutzen wir die WordPress Template Tags für den Permalink und den Artikel-Titel, &lt;?php the_permalink(); ?&gt; und &lt;?php the_title(); ?&gt; und setzen diese in den oben genannten Link ein:<em><br />
http://www.facebook.com/sharer.php?u=&lt;?php the_permalink(); ?&gt;&amp;t=&lt;?php the_title(); ?&gt;</em><br />
Wenn wir diesen Link so wie er ist in unser Theme schreiben würden, hätten wir bereits einen funktionierenden Link, der es dem Leser ermöglicht, den Link zu teilen. Ein Ausschnitt des Textes wird von Facebook automatisch eingefügt. Der fertige HTML-Schnipsel kann so aussehen:</p>
<p><code>&lt;a href="http://www.facebook.com/sharer.php?u=&lt;?php  the_permalink(); ?&gt;&amp;t=&lt;?php the_title(); ?&gt;"  target="_blank"&gt;&lt;img  src="/pfad/zum/button/facebook-share.png"  alt="Facebook"/&gt;&lt;/a&gt;</code></p>
<p><strong>Die VZ-Netzwerke</strong> (StudiVZ, SchülerVZ und MeinVZ) handhaben das ähnlich. Hier müssen Permalink, Titel und der Name der Website an eine Vorschaltseite weitergegeben werden, auf der der Nutzer auswählen kann, in welchem Netzwerk er ist und den Linkt teilen möchte. Wir benötigen hier einen Link der aussieht wie dieser:<br />
<a href="http://www.studivz.net/Link/Selection/Url/?u=example.com&amp;desc=Titel&amp;prov=Blogname" target="_blank">http://www.studivz.net/Link/Selection/Url/?u=example.com&amp;desc=Titel&amp;prov=Blogname</a></p>
<p>Auch hier ersetzen wir wieder Link und Titel durch die Template Tags, fügen aber noch das Template Tag für den Blognamen mit an:<br />
<em>http://www.studivz.net/Link/Selection/Url/?u=&lt;?php the_permalink();  ?&gt;&amp;desc=&lt;?php the_title(); ?&gt;&amp;prov=&lt;?php  bloginfo(&#8216;name&#8217;); ?&gt;</em><br />
Auch das ist schon alles. Hier wieder der beispielhafte HTML-Schnipsel fürs eigene Template:</p>
<p><code>&lt;a href="http://www.studivz.net/Link/Selection/Url/?u=&lt;?php  the_permalink(); ?&gt;&amp;desc=&lt;?php the_title();  ?&gt;&amp;prov=&lt;?php bloginfo('name'); ?&gt;"  target="_blank"&gt;&lt;img  src="/pfad/zum/button/vz-share.png"  alt="VZ-Netzwerke"/&gt;&lt;/a&gt;</code></p>
<p>Nun kommen wir zu Twitter. An Twitter wollen wir den Titel, den Link und einen kurzen Einleitungstext wie beispielsweise &#8220;Ich lese gerade:&#8221; schicken. Hier brauchen wir einen Link nach folgendem Schema:<br />
<a href="http://twitter.com/home?status=Ich+lese+gerade:+Titel+http://example.com/" target="_blank">http://twitter.com/home?status=Ich+lese+gerade:+Titel+http://example.com/</a></p>
<p>Hier wird es dann etwas komplizierter, denn Twitter erlaubt höchstens 140 Zeichen pro Tweet, es ist daher nicht zu empfehlen, lange Permalinks an Twitter zu senden. WordPress hat allerdings noch eine sehr Kurze URL-Form, sie besteht lediglich aus der Domain und der Post-ID: http://example.com/?p=123. Mit dieser können wir arbeiten. Um diese Form für einen einzelnen Link zu bekommen, müssen wir etwas in der functions.php unseres Themes arbeiten.<br />
Vor längerer Zeit fiel mir der folgende Codeschnipsel in die Hände, ich weiß nicht mehr, woher ich ihn habe, lediglich steht im Quellcode, <a href="http://toscho.de/2009/shortlinks-in-wordpress/" target="_blank">auf wessen Überlegungen er basiert</a>. Dieses Stückchen Code fügen wir nun unserer functions.php hinzu:</p>
<p><code>if(!function_exists('get_tweet_this_link')){<br />
function get_tweet_this_link($message_template = 'Ich lese gerade: %TITLE %URL', $link_title='&lt;img src="/wp-content/themes/DEIN-THEME/pfad/zum/button/twitter-share.png" alt="Twitter" /&gt;', $title_length = 80){<br />
global $post;<br />
// Via http://toscho.de/2009/shortlinks-in-wordpress/<br />
$tinyurl = trim(get_option('home'), '/') . '/?p=' . $post-&gt;ID;<br />
// Titel des Artikels kürzen<br />
$title = $post-&gt;post_title;<br />
if(strlen($title) &gt; $title_length){<br />
$short_title = substr($title, 0, $title_length);<br />
$short_title .= '...';<br />
}<br />
else{<br />
$short_title = $title;<br />
}<br />
// Link erstellen<br />
$message = str_replace(array('%TITLE', '%URL'), array($short_title, $tinyurl), $message_template);<br />
$message = urlencode($message);<br />
return '&lt;a href="http://twitter.com/home?status='.$message.'" target="_blank"&gt;'.$link_title.'&lt;/a&gt;';<br />
}<br />
}</code></p>
<p>Es muss lediglich noch (recht weit oben) der Pfad zum Twitter-Button angepasst und eventuell die kurze Nachricht geändert werden. Den gesamten Link zu Twitter fügen wir nun im Quelltext des Theme mit dem folgenden selbstgemachten Template-Tag auf: <em>&lt;?php echo get_tweet_this_link() ?&gt;</em></p>
<p>Und das war es auch schon. Wir haben nun die drei Links erstellt und den Lesern eine Möglichkeit geschaffen, mit wenig Aufwand anderen unsere Artikel zu zeigen.</p>
<p>Wenn wir also die drei Schritte gegangen sind, könnten wir uns einen kleinen Block mit den Netzwerk-Buttons zusammengebastelt haben, der in etwa so aussieht:<br />
<code>Zeig's Ihnen!&lt;br /&gt;<br />
Auf Twitter: &lt;?php echo get_tweet_this_link() ?&gt; | Auf Facebook: &lt;a href="http://www.facebook.com/sharer.php?u=&lt;?php the_permalink(); ?&gt;&amp;t=&lt;?php the_title(); ?&gt;" target="_blank"&gt;&lt;img src="/pfad/zum/button/facebook-share.png" alt="Facebook"/&gt;&lt;/a&gt;<br />
| In den VZ-Netzwerken: &lt;a href="http://www.studivz.net/Link/Selection/Url/?u=&lt;?php the_permalink(); ?&gt;&amp;desc=&lt;?php the_title(); ?&gt;&amp;prov=&lt;?php bloginfo('name'); ?&gt;" target="_blank"&gt;&lt;img src="/pfad/zum/button/vz-share.png" alt="VZ-Netzwerke"/&gt;&lt;/a&gt;</code></p>
<p>Viel Erfolg beim &#8220;Nachbauen&#8221;! Fragen und Anregungen sind in den Kommentaren natürlich gern gesehen!<br />
<strong><br />
Ergänzung:</strong><br />
In den Kommentaren wies Gunni darauf hin, dass urlencode() genutzt werden sollte, womit er natürlich Recht hat, das Script für den Twitter-Kurzlink ist bereits dementsprechend geschrieben worden.<br />
Prinzipiell geht es ohne, wer aber urlencode() nutzen möchte, kann den oben genannten Codeblock gegen diesen ersetzen:</p>
<p><code>Zeig's Ihnen!&lt;br /&gt;<br />
Auf Twitter: &lt;?php echo get_tweet_this_link() ?&gt; | Auf Facebook:<br />
&lt;?php $query_string = '?u=' . urlencode(get_permalink()) . '&amp;t=' . urlencode(get_the_title());<br />
echo '&lt;a href="http://www.facebook.com/sharer.php' . htmlentities($query_string) . '" target="_blank"&gt;<br />
&lt;img src="/pfad/zum/button/facebook-share.png" alt="Facebook"/&gt;&lt;/a&gt;';?&gt;<br />
| In den VZ-Netzwerken:<br />
&lt;?php $query_string = '?u=' . urlencode(get_permalink()) . '&amp;desc=' . urlencode(get_the_title()) . '&amp;prov=' . urlencode(get_bloginfo('name'));<br />
echo '&lt;a href="http://www.studivz.net/Link/Selection/Url/' . htmlentities($query_string) . '" target="_blank"&gt;<br />
&lt;img src="/pfad/zum/button/vz-share.png" alt="VZ-Netzwerke"/&gt;&lt;/a&gt;';?&gt;</code></p>
<p>Viel Erfolg!</p>
 <p><a href="http://wemaflo.net/?flattrss_redirect&amp;id=3140&amp;md5=d06f32f88aebaa0f587b9495d9e3a487" title="Flattr" target="_blank"><img src="http://wemaflo.net/wp-content/plugins/flattr/img/flattr-badge-large.png" alt="flattr this!"/></a></p>]]></content:encoded>
			<wfw:commentRss>http://wemaflo.net/2010/11/tutorial-teilen-buttons-zu-sozialen-netzwerken-selbstgemacht/feed/</wfw:commentRss>
		<slash:comments>6</slash:comments>
		<atom:link rel="payment" href="http://wemaflo.net/?flattrss_redirect&amp;id=3140&amp;md5=d06f32f88aebaa0f587b9495d9e3a487" type="text/html" />
	</item>
		<item>
		<title>SchülerVZ: Oliver Skopec geht&#8230;</title>
		<link>http://wemaflo.net/2008/11/schulervz-oliver-skopec-geht/</link>
		<comments>http://wemaflo.net/2008/11/schulervz-oliver-skopec-geht/#comments</comments>
		<pubDate>Sat, 22 Nov 2008 23:14:53 +0000</pubDate>
		<dc:creator>wemaflo</dc:creator>
				<category><![CDATA[Computer]]></category>
		<category><![CDATA[Internet]]></category>
		<category><![CDATA[CEO]]></category>
		<category><![CDATA[Community]]></category>
		<category><![CDATA[Markus Riecke]]></category>
		<category><![CDATA[Oliver Skopec]]></category>
		<category><![CDATA[Paetzold]]></category>
		<category><![CDATA[Projektleiter]]></category>
		<category><![CDATA[Riedl]]></category>
		<category><![CDATA[SchülerVZ]]></category>
		<category><![CDATA[StudiVZ]]></category>

		<guid isPermaLink="false">http://wemaflo.net/?p=419</guid>
		<description><![CDATA[&#8230;beziehungsweise ging. Wie er heute im &#8220;Klartext&#8221;, sozusagen dem Newsletter des SchülerVZ, mitteilte, wird die Community bereits seit August von Nikola Paetzold geleitet. Wieso der bisherige Projektleiter das SchülerVZ verlassen hat, ist in der Nachricht nicht so richtig ersichtlich, vielleicht &#8230; <a href="http://wemaflo.net/2008/11/schulervz-oliver-skopec-geht/">Weiterlesen <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>&#8230;beziehungsweise ging. Wie er heute im &#8220;Klartext&#8221;, sozusagen dem Newsletter des SchülerVZ, mitteilte, wird die Community bereits seit August von Nikola Paetzold geleitet.</p>
<p>Wieso der bisherige Projektleiter das SchülerVZ verlassen hat, ist in der Nachricht nicht so richtig ersichtlich, vielleicht ist es das angesprochene Studium, vielleicht stehen auch andere Gründe hinter dem Weggang&#8230;</p>
<p><a title="Holtzbrinck tauscht StudiVZ-Chef Riecke aus" href="http://wemaflo.net/holtzbrinck-tauscht-studivz-chef-riecke-aus.html" target="_blank">Schon im Oktober</a> wurde der CEO des StudiVZ, Markus Riecke, durch Clemens Riedl ersetzt.</p>
 <p><a href="http://wemaflo.net/?flattrss_redirect&amp;id=419&amp;md5=b0011f91dfb81621e0ff912fe3b89b84" title="Flattr" target="_blank"><img src="http://wemaflo.net/wp-content/plugins/flattr/img/flattr-badge-large.png" alt="flattr this!"/></a></p>]]></content:encoded>
			<wfw:commentRss>http://wemaflo.net/2008/11/schulervz-oliver-skopec-geht/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		<atom:link rel="payment" href="http://wemaflo.net/?flattrss_redirect&amp;id=419&amp;md5=b0011f91dfb81621e0ff912fe3b89b84" type="text/html" />
	</item>
	</channel>
</rss>

