WordPress Head Bereich bearbeiten und bereinigen

In diesem Artikel zeige ich Dir wie Du den WordPress Head Bereich bearbeiten und bereinigen kannst.

Es geht also um den Inhalt des <head> Elements – deutsch HTML Kopf – welcher sich ganz am Anfang des HTML Dokuments befindet.

Verwechselt dies bitte nicht mit dem Header Bereich innerhalb des <body> Elements – deutsch HTML Körper – welcher den Kopf des sichtbaren Bereiches der Webseite meint.

Der folgende Code enthält den kompletten Head Bereich des WordPress Themes Twenty Seventeen. Ich habe hier nur die Inhalte der Style- und Script-Bereiche entfernt um das Ganze etwas einzukürzen.

&lt;head&gt;
    &lt;meta charset="UTF-8"&gt;
    &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
    &lt;link rel="profile" href="http://gmpg.org/xfn/11"&gt; 
    &lt;script&gt; ... Inhalt entfernt ... &lt;/script&gt;
    &lt;title&gt;Wordpress&lt;/title&gt;
    &lt;link rel="dns-prefetch" href="//fonts.googleapis.com"&gt;
    &lt;link rel="dns-prefetch" href="//s.w.org"&gt;
    &lt;link href="https://fonts.gstatic.com" crossorigin="" rel="preconnect"&gt;
    &lt;link rel="alternate" type="application/rss+xml" title="Wordpress » Feed" href="http://www.wordpress.local/feed/"&gt;
    &lt;link rel="alternate" type="application/rss+xml" title="Wordpress » Kommentar-Feed" href="http://www.wordpress.local/comments/feed/"&gt;
    &lt;script type="text/javascript"&gt; ... Inhalt entfernt ... &lt;/script&gt;
    &lt;script src="http://www.wordpress.local/wp-includes/js/wp-emoji-release.min.js?ver=4.7.3" type="text/javascript" defer=""&gt;&lt;/script&gt;
    &lt;style type="text/css"&gt; ... Inhalt entfernt ... &lt;/style&gt;
    &lt;link rel="stylesheet" id="twentyseventeen-fonts-css" href="https://fonts.googleapis.com/css?family=Libre+Franklin%3A300%2C300i%2C400%2C400i%2C600%2C600i%2C800%2C800i&amp;amp;subset=latin%2Clatin-ext" type="text/css" media="all"&gt;
    &lt;link rel="stylesheet" id="twentyseventeen-style-css" href="http://www.wordpress.local/wp-content/themes/twentyseventeen/style.css?ver=4.7.3" type="text/css" media="all"&gt;
    &lt;!--[if lt IE 9]&gt;
        &lt;link rel='stylesheet' id='twentyseventeen-ie8-css' href='http://www.wordpress.local/wp-content/themes/twentyseventeen/assets/css/ie8.css?ver=1.0' type='text/css' media='all' /&gt;
    &lt;![endif]--&gt;
    &lt;!--[if lt IE 9]&gt;
        &lt;script type='text/javascript' src='http://www.wordpress.local/wp-content/themes/twentyseventeen/assets/js/html5.js?ver=3.7.3'&gt;&lt;/script&gt;
    &lt;![endif]--&gt;
    &lt;script type="text/javascript" src="http://www.wordpress.local/wp-includes/js/jquery/jquery.js?ver=1.12.4"&gt;&lt;/script&gt;
    &lt;script type="text/javascript" src="http://www.wordpress.local/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.4.1"&gt;&lt;/script&gt;
    &lt;link rel="https://api.w.org/" href="http://www.wordpress.local/wp-json/"&gt;
    &lt;link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://www.wordpress.local/xmlrpc.php?rsd"&gt;
    &lt;link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://www.wordpress.local/wp-includes/wlwmanifest.xml"&gt; 
    &lt;meta name="generator" content="WordPress 4.7.3"&gt;
&lt;/head&gt;

<head>

<title>Wordpress</title>

<!--[if lt IE 9]>

<![endif]-->

<!--[if lt IE 9]>

<![endif]-->

</head>

Es handelt sich hier wohlgemerkt um eine WordPress Standard-Installation mit dem aktuellen Standard Theme, ohne Admin-Bar und ohne zusätzliche Plugins oder andere Theme Funktionalitäten.

WordPress Head Bereich optimieren

Wie man sieht ist der Head Bereich mit META-Angaben, LINK-Verlinkungen, sowie Style- und Script-Code völlig überladen.

Dies muss nicht so bleiben, denn der Head Bereich kann nur durch ein paar Zeilen Code optimiert werden.

Die folgenden Code-Beispiele sollten in der function.php Datei des Child-Theme oder des eigenen Themes hinterlegt werden.

Grundsätzlich ist es natürlich auch möglich die header.php Datei ins Child-Theme zu kopieren und dort direkt zu bearbeiten. Darauf möchte ich hier aber nicht eingehen.

meta tag „generator“ entfernen

Wenn eine der folgenden Zeilen im Head Bereich deiner Webseite ausgegeben wird, kann jeder deine verwendete WordPress Version auslesen.

&lt;meta name="generator" content="WordPress 4.6.1"&gt;

1	<meta name="generator" content="WordPress 4.6.1">

&lt;meta name="generator" content="WooCommerce 2.6.8"&gt;

1	<meta name="generator" content="WooCommerce 2.6.8">

Wenn man diese Information besitzt, kann ein potentieller Angreifer die bekannten Sicherheitslücken dieser Version gezielt angreifen.

Du solltest die Anzeige der WordPress Version also besser entfernen und evtl. Schwachstellen verschleiern.

Folgende Codezeile entfernt den meta tag „generator“ aus dem Kopfbereich deiner Website:

remove_action( 'wp_head', 'wp_generator' );

1	remove_action( 'wp_head', 'wp_generator' );

link tag „wlwmanifest“ entfernen

Da du den Windows Live Writer höchstwahrscheinlich nicht benutzt und folgenden Code in deinem Head Bereich vorfindest solltest du ihn entfernen.

&lt;link="wlwmanifest" type="application/wlwmanifest+xml" href="http://www.example.com/wp-includes/wlwmanifest.xml"&gt;

1	<link="wlwmanifest" type="application/wlwmanifest+xml" href="http://www.example.com/wp-includes/wlwmanifest.xml">

Folgende Codezeile entfernt den link tag „wlwmanifest“ aus dem Kopfbereich deiner Website:

remove_action( 'wp_head', 'wlwmanifest_link' );

1	remove_action( 'wp_head', 'wlwmanifest_link' );

Zusätzlich solltest du den HTTP-Zugriff auf die Datei /wp-includes/wlwmanifest.xml über deine .htaccess Datei im root directory der WordPress Installation sperren. Dies ist folgendermaßen möglich:

&lt;files /wp-includes/wlwmanifest.xml&gt;
  Order deny,allow
  deny from all
&lt;/files&gt;

Order deny,allow

deny from all

</files>

link tag „EditURI“ entfernen

Falls du deine Inhalte nur über den WP Adminbereich pflegst und folgende Zeile in deinem Head Bereich findest solltest du sie entfernen.

&lt;link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://www.example.com/xmlrpc.php?rsd"&gt;

1	<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://www.example.com/xmlrpc.php?rsd">

Folgende Codezeile entfernt den link tag „EditURI“ aus dem Kopfbereich deiner Website:

remove_action( 'wp_head', 'rsd_link' );

1	remove_action( 'wp_head', 'rsd_link' );

link tag „shortlink“ entfernen

Wenn du keine Dienste nutzt die den Shortlink benötigen und folgende Zeile in deinem Head Bereich findest solltest du sie entfernen.

&lt;link rel="shortlink" href="http://www.example.com/?p=123"&gt;

1	<link rel="shortlink" href="http://www.example.com/?p=123">

Folgende Codezeile entfernt den link tag „shortlink“ aus dem Kopfbereich deiner Website:

remove_action( 'wp_head', 'wp_shortlink_wp_head' );

1	remove_action( 'wp_head', 'wp_shortlink_wp_head' );

link tags „prev“ und „next“ entfernen

Wenn du keine Paginierung verwenden willst und folgende Zeilen in deinem Head Bereich findest kannst du sie entfernen. Eine Paginierung kann nützlich sein, muss dann aber auch korrekt angewendet werden.

&lt;link rel="prev" href="http://www.example.com/article?story=abc&amp;page=1" /&gt;

&lt;link rel="next" href="http://www.example.com/article?story=abc&amp;page=3" /&gt;

Folgende Codezeile entfernt die link tags „prev“ und „next“ aus dem Kopfbereich deiner Website:

remove_action( 'wp_head', 'adjacent_posts_rel_link_wp_head', 10 );

1	remove_action( 'wp_head', 'adjacent_posts_rel_link_wp_head', 10 );

Schlussfolgerung

Mit ein paar Zeilen Code ist es möglich unnötigen Ballast aus dem WordPress Head Bereich deines verwendeten Themes zu entfernen. Das bringt dir nicht nur mehr Sicherheit sondern auch kürzere Ladezeiten.