WordPress

Farbiger Browserrahmen im Android Chrome – So geht’s mit WordPress (theme-color)

Von 19. Juli 2018 März 15th, 2019 No Comments
Die Webseite der Werbeagentur MEWIGO auf einem Smartphone. Geschätzte Lesedauer: 1 Minute

Sicherlich ist es einigen von Ihnen bereits aufgefallen: Der Chrome Browser auf Android Smartphone zeigt bei einigen Webseiten einen farbigen „Rahmen“ bzw. ein farbiges „Theme“ an. Diese sogenannte „theme-color“ ist sowohl in der Standard-Ansicht des Chrome-Browsers sichtbar als auch in der Übersicht der geöffneten Tabs. Folgend hierzu eine Beispiel-Ansicht, an welcher die theme-color Einstellung verdeutlicht werden kann:

theme-color Einstellung für eine WordPress-Webseite

Die theme-color Einstellung für den Android-Chrome Browser lässt sich recht simpel über eine meta-Anweisung im head-Bereich der Webseite einfügen. Dazu reicht folgende Zeile Code:

<meta name="theme-color" content="#0066a6">

Der Farbwert für das Attribut content enthält die gewünschte Farbe des Browser-Themes.

Um diese Zeile Code im head-Bereich einer WordPress Seite einzufügen, kann man beispielsweise eine kleine Funktion in der functions.php des aktiven Themes (bzw. Child-Themes) schreiben:

function add_android_color_code() { ?>
<meta name="theme-color" content="#0066a6">
<?php }

add_action('wp_head', 'add_android_color_code');

Wenn Sie Fragen zur theme-color Funktionalität haben oder Unterstützung bei der Umsetzung benötigen, kontaktieren Sie uns einfach unverbindlich. Als WordPress Agentur in Berlin helfen wir Ihnen gerne weiter!

Jetzt Chat starten

Jetzt kontaktieren

 

Links: https://developers.google.com/web/updates/2014/11/Support-for-theme-color-in-Chrome-39-for-Android

13 votes, average: 5,00 out of 513 votes, average: 5,00 out of 513 votes, average: 5,00 out of 513 votes, average: 5,00 out of 513 votes, average: 5,00 out of 5
Diego Hinz

Autor Diego Hinz

Diego Hinz ist Inhaber der WordPress Agentur und Werbeagentur MEWIGO. Seine persönlichen Stärken liegen im Bereichen WordPress, Grafik, Druck und Außenwerbung. Zudem gibt er sein Wissen als WordPress Experte in WordPress-Schulungen und bei WordPress Meetups an Kunden/Interessenten weiter.

Mehr Beiträge von Diego Hinz
KONTAKT
Bänschstraße 37 |10247 Berlin
Tel. 030 / 602 682 11
E-Mail: kontakt@mewigo.de
PGlmcmFtZSBzcmM9Imh0dHBzOi8vd3d3Lmdvb2dsZS5jb20vbWFwcy9lbWJlZD9wYj0hMW0xNCExbTghMW0zITFkOTcxMS4yNjgzOTg2MTM1MDkhMmQxMy40NjM3ODghM2Q1Mi41MTg2NDkhM20yITFpMTAyNCEyaTc2OCE0ZjEzLjEhM20zITFtMiExczB4MCUzQTB4NTY3ZDg4YjY1MTdjY2UwZiEyc01FV0lHTytXZXJiZWFnZW50dXIhNWUwITNtMiExc2RlITJzZGUhNHYxNDE4MzMxNTg1OTk0IiBzdHlsZT0iYm9yZGVyOiAwcHggbm9uZTsgdmlzaWJpbGl0eTogdmlzaWJsZTsgb3BhY2l0eTogMTsiIGZyYW1lYm9yZGVyPSIwIiBoZWlnaHQ9IjEwMCUiIHdpZHRoPSIxMDAlIj48L2lmcmFtZT4=
Vielen Dank. Wir werden uns so schnell wie möglich bei Ihnen melden.