WordPress: RSS Feed einbinden

Um keine Chance auszulassen, Abonnenten für Deinen Blog zu gewinnen, sollte ein RSS Feed immer sichtbar eingebunden sein.

Glücklicherweise macht WordPress einen Teil der Arbeit automatisch, was Du z.B. mit dem Firefox am fett markierten RSS-Symbol neben der Adressleiste erkennst:

Vergleiche (RSS-Feed eingerichtet):

rss-feed-wordpress-einrichten

mit (RSS-Feed nicht eingerichtet):

rss-feed-wordpress-einrichten2

Sinnvoll ist jedoch auch die Einbindung in eine Socia-Media-Leiste.

Hierzu suchst Du im Internet nach hübschen (und kostenlosen) Icon-Sets und lädst Sie Dir in einen Ordner.

Der voreingerichtete WordPress-Feed ist hat folgende URL:

http://x.it-kosmopolit.de/index.php/feed/

Um diese Icons:

rss-feed-wordpress-einrichten3

zu erzeugen, habe ich beispielsweise folgenden Code genutzt:




<div id="social_media" style="position:absolute; right:5%; margin-left:130px;">
	<a href="https://www.facebook.com/projektfisch" target="_blank">
		<img src="http://www.projekt-fisch.de/freelancer/images/social-media-icons-2015/projekt-fisch-facebook.svg" alt="projekt-fisch-facebook-button" style="width:40px;height:40px;"/>
	</a>
	<a href="https://twitter.com/ProjektFisch" target="_blank">
		<img src="http://www.projekt-fisch.de/freelancer/images/social-media-icons-2015/projekt-fisch-twitter.svg" alt="projekt-fisch-twitter-button" style="width:40px;height:40px;"/>
	</a>
	<a href="https://plus.google.com/111580706390601723057" target="_blank">
		<img src="http://www.projekt-fisch.de/freelancer/images/social-media-icons-2015/projekt-fisch-google+.svg" alt="projekt-fisch-google+-button" style="width:40px;height:40px;"/>
	</a>
	<a href="https://www.xing.com/profile/Michael_Wowro" target="_blank">
		<img src="http://www.projekt-fisch.de/freelancer/images/social-media-icons-2015/projekt-fisch-xing.svg" alt="projekt-fisch-xing-button" style="width:40px;height:40px;"/>
	</a>
	<a href="http://x.it-kosmopolit.de/it-freelancer-magazin/index.php/feed/" target="_blank">
		<img src="http://www.projekt-fisch.de/freelancer/images/social-media-icons-2015/projekt-fisch-rss.svg" alt="projekt-fisch-rss-button" style="width:40px;height:40px;"/>
	</a>
</div>



Beim GeneratePress-Theme habe ich diesen HTML-Code einfach in die footer.php eingebaut. Direkt unter den Start-Tag: <footer>

Beachte: Wenn Du Dein Theme updatest, ist die Änderung wahrscheinlich futsch.

Word Press (Theme: Twentyfifteen): nur Auszug (excerpt) der Startseiten-Artikel zeigen

Du möchtest nicht, dass auf Deiner Startseite die vollständigen Artikel erscheinen, aber trotzdem das Twentyfifteen-Theme nutzen. Hiermit geht das schnell & einfach:

Die Macher des Twentyfifteen haben sich offensichtlich gegen eine Darstellung von verkürzten Artikeln auf der Startseite entschieden. Ich möchte dies trotzdem, weil sonst die Übersicht verloren geht. Auch schalte ich Google-Werbung innerhalb meiner Texte auf den Einzel-Artikelseiten, die dann logischerweise weniger besucht werden. Es entgeht mir also bares Geld. Wer tiefer in das Thema einsteigen will, ließt diesen englischen Artikel, wer schnell zum Ergebnis kommen möchte ließt einfach weiter. Du musst einfach die Datei

wp-content\themes\twentyfifteen\content.php

ändern. Zuerst speicherst Du eine Sicherheitskopie dieser Datei. Dann löschst Du alles, was zwischen <div class=“entry-content“> und </div><!– .entry-content –> steht, und ersetzt es mit:

 
 <?php
if ( is_single() ) :
 /* translators: %s: Name of current post */
 the_content( sprintf(
 __( 'Continue reading %s', 'twentyfifteen' ),
 the_title( '<span class="screen-reader-text">', '</span>', false )
 ) );
 
 wp_link_pages( array(
 'before'      => '<div class="page-links"><span class="page-links-title">' . __( 'Pages:', 'twentyfifteen' ) . '</span>',
 'after'       => '</div>',
 'link_before' => '<span>',
 'link_after'  => '</span>',
 'pagelink'    => '<span class="screen-reader-text">' . __( 'Page', 'twentyfifteen' ) . ' </span>%',
 'separator'   => '<span class="screen-reader-text">, </span>',
 ) );
else :
 
/* translators: %s: Name of current post */
 the_excerpt( sprintf(
 __( 'Continue reading %s', 'twentyfifteen' ),
 the_title( '<span class="screen-reader-text">', '</span>', false )
 ) );
 
 wp_link_pages( array(
 'before'      => '<div class="page-links"><span class="page-links-title">' . __( 'Pages:', 'twentyfifteen' ) . '</span>',
 'after'       => '</div>',
 'link_before' => '<span>',
 'link_after'  => '</span>',
 'pagelink'    => '<span class="screen-reader-text">' . __( 'Page', 'twentyfifteen' ) . ' </span>%',
 'separator'   => '<span class="screen-reader-text">, </span>',
 ) );
endif;
 
 ?>

Die default-Länge eines Auszugs (excerpt) liegt bei 55 Wörtern. Da meine Teaser jedoch wesentlich kürzer sind, ändere ich die Länge auf 30 Wörter. Dazu muss ich in

\wp-content\themes\twentyfifteen\functions.php

folgende zwei Zeilen ganz am Ende hinzufügen:

function twenty_fifteen_excerpt_length( $length ) {
return 30;
}
add_filter( 'excerpt_length', 'twenty_fifteen_excerpt_length', 999 );

Einrichtung eines WordPress-Blogs

Früher habe ich mit Editor, HTML und viel Zeit meine Websites selbst gebastelt – so sahen sie dann auch aus. Nun bin ich schlauer und nutze dankbar das, was andere erschaffen haben: WordPress!

Einstellungen

Stelle unter Settings (Einstellungen) die gewünschte Sprache, das Datumsformat und das Format der Uhrzeit ein. Allerdings kann man die Permalinks auf diese Weise nur beim Setup einer WordPress-Instanz umstellen – macht man es später, kann es sein, dass die Blog-internen Links danach ins Leere laufen.

Permalinks -> hier „Beitragsname“ auswählen. Der Artikel nimmt per default sonst das Datum der Veröffentlichung in die URL mit rein, z.B.

http://x.it-kosmopolit.de/index.php/2017/03/20/visitenkarten-uvm-erstellen-mit-canva-com/

Das bringt zwei Nachteile: 1.) SEO: je weniger irrelevante Teile in der URL, desto besser 2.) Ich kann auch schon auf einen Artikel verlinken, der erst in ein paar Tagen veröffentlicht wird, ohne dass die URL sich ändert.

 

Headerbild

Nimm ein Headerbild, welches der in Bild gegossene Ausdruck Deines Blogs ist und/oder ein Bild, das Deine Leser überrascht und sich dadurch einprägt. Wenn Du ein selbst geschossenes Foto nimmst, wo außer Dir keine Menschen, Logos, o.Ä. zu erkennen sind, kann Dir wohl niemand bezüglich (Urheber-)recht ans Bein pinkeln. Außerdem nimm Image Resizer for Windows, um das Bild so leicht wie möglich zu machen. Je weniger Kilobyte es wiegt, desto schneller lädt die Seite.

Theme

Wähle ein Theme (Template), welches reponsive ist, sprich auch auf mobilen Endgeräten schön angezeigt wird. Google rankt Deinen hervorragenden Content für die mobile Suche gnadenlos runter, wenn Deine Website auf mobilen Endgeräten scheiße aussieht. Such Dir einfach in der Standard-Datenbank ein kostenloses Theme aus oder hier ein kostenloses responsive Theme aus.

Plugins

Plugins sind das Fleisch von WordPress – also habe ich die WordPress-Plugins aufgelistet, auf die keiner verzichten kann.

Google Search Console

(ehemals Webmaster Tools) Die Search Console vermittelt Tipps, wie man sein Ranking bei der Google Suche verbessern kann. Auch sorgst Du mit einer Registrierung Deiner (Sub-)Domain dafür, dass Google Deine Seite schnell indiziert und damit schnell in den Suchergebnissen auftaucht. Beim Registrierungsprozess musst Du die Inhaberschaft bestätigen, dazu wählst Du ‚Property hinzufügen‘ und danach am besten „HTML-Datei hochladen“, weil das am einfachsten ist. Wichtig ist auch die Suchanalyse, die Du im Dashboard findest, die jedoch erst etlichen Stunden nach der Registrierung mit Inhalt gefüllt wird.

Google Analytics

Da die Analyse des Nutzerverhaltens essenziell ist, um das Angebot immer weiter zu verbessern, nutze ich Google Analytics. Hier findest Du eine fantastische Anleitung für die Integration von Google Analytics in WordPress.

WordPress: Google Analytics integrieren

Disclaimer: Der folgende Beitrag ist keine juristische Beratung zum Thema Google Analytics. Auch gibt es keine Garantie, dass diese Anleitung zu einer datenschutzkonformen Einbindung von Google Analytics führt. Wer rechtliche Fragen hat, sollte im Zweifelsfall einen Anwalt konsultieren.

Allgemeines

Sämtliche interessanten Reports finden sich in Google Analytics selbst, weshalb die einschlägigen WP-Plugins nur rudimentäre Reports bereitstellen. Der wichtigste Report ist die Übersicht zu den Besuchen und Absprungraten einzelner Seiten (VERHALTEN -> Websitecontent -> Alle Seiten)

Der Datenschutz-konforme Einsatz von Google Analytics ist in Deutschland spätestens seit 2013 eine besondere Herausforderung. Rechtsanwalt Schwenke stellt die diesbezüglichen Anforderungen an Webmaster hier vor. Er ergänzt sie um die Empfehlungen für die Anforderungen durch mobile Nutzung.

Für die Erstellung einer Datenschutzerklärung nutzt man den  Datenschutzerklärungs-Generator von RA Schwenke.

Für diese Anleitung wird vorausgesetzt, dass Du einen Google Analytics-Account hast und dort ein Property zu Deiner WordPress-Instanz angelegt hast.

WP-Plugin: Google Analytics by MonsterInsights

Initialisierung

Damit Google Analytics mit dem Sammeln der Daten auf Deiner WordPress-Instanz beginnen kann, musst Du Dich bei Google Analytics authentifizieren: Dashboard -> Autheticate with Google Account -> Wizard ausfüllen. Mit einer Verzögerung von bis zu 24 Stunden erscheinen nun die Tracking-Ergebnisse.

Anonymisierung IP-Adresse

Für WordPress eignet sich das Plugin Google Analytics for WordPress by MonsterInsights. Mit diesem Plugin kann man zumindest die geforderte IP-Anonymisierung vornehmen: Menüpunkt: Insights -> Settings -> Tracking -> Demographics -> Anonymize IP Adress.

Custom-Code in MonsterInsights

Um den Anforderungen an die mobile Nutzung gerecht zu werden, muss man dem Nutzer die Möglichkeit bieten ein Stop-Tracking-Cookie zu setzen. Hier das Code-Snippet von RA Schwenke, was das umsetzt:

// Set to the same value as the web property used on the site
var gaProperty = 'UA-XXXXXXXX-Y';
var disableStr = 'ga-disable-' + gaProperty;
 
// Disable tracking if the opt-out cookie exists.
if (document.cookie.indexOf(disableStr + '=true') > -1) {
  window[disableStr] = true;
}
 
// Opt-out function
function gaOptout() {
  document.cookie = disableStr + '=true; expires=Thu, 31 Dec 2099 23:59:59 UTC; path=/';
  window[disableStr] = true;
}

Den eigenen UA-Code einsetzen (den findet man bei Insights -> Settings -> General -> Analytics Profile). Dann das Snippet in Insights -> Settings -> Tracking -> Compatibility -> Custom Code einfügen und speichern. In der durch den Generator erzeugten Datenschutzerklärung ist ein Link, durch welchen der Besucher den obigen Code schließlich aktivieren kann.

Erfolgskontrolle: Ausloggen aus WordPress (weil MonsterInsights per default Administratoren und Redakteure vom Tracking ausschließt). Klicke den Link „… klicken Sie bitte diesen Link …“ in der Datenschutzerklärung und prüfe, ob ein Cookie mit dem Namensbestandteil ga-disable- angelegt wurde. Hier findest Du Kurzanleitungen um die Cookies in den verschiedenen Browsern anzuzeigen.

 

WP-Plugin: Google Analytics Dashboard for WP

TBC

Initialisierung

Folge einfach den Anleitungen von „Plugin autorisieren“.

Anonymisierung IP-Adresse

Tracking-Code -> Grundeinstellungen -> Basic Tracking -> „IP-Adressen anonymisieren“

Fitmachen für mobile Nutzung

https://drschwenke.de/google-analytics-mobile-nutzung-update-anleitung#jqueryopt

WordPress: Bilder werden nicht hochgeladen, Fenster bleibt leer

Gelöst: Wie ärgerlich, ich lade ein Bild in WordPress hoch und es klappt nicht. Gerade eben hat es noch funktioniert. Es wird auch ein Objekt angelegt, doch das Fenster bleibt leer. Eine Fehlermeldung, die mir einen Hinweis geben könnte erscheint auch nicht.

Das ist ein Beispiel für ein Bild, das ich hochladen möchte:

WordPress Fehler Bild hochladen original

Und das ist das Ergebnis in der Media Library:

WordPress Fehler Bild hochladen 2

Lösung:
WordPress (in der Standardinstallation) kann mit deutschen Umlauten (ä, ö, ü) nicht umgehen. Die Bilddatei trägt den Namen: „Schöner LKW.png“ – das ö war in diesem Fall also der Übeltäter. Einfach die Bilddateien folgendermaßen umbenennen: ä -> ae, ö -> oe, ü -> ue, dann klappt das Bilder-Hochladen wieder wie am Schnürchen.