Genesis nutzt das WordPress-Feature um ein Logo im Header zu setzen, anstatt des Titels und der Beschreibung. Allerdings wird die Bildgröße beim Logo auf die tatsächlichen Pixel festgelegt.
Um die doppelte Pixeldichte bei Retina (iPhone) zu unterstützen muss das Logobild die doppelte Pixelgröße haben. Über die CSS-Property background-size wird dann die normale width und height des Logos festgelegt.
Um das im Genesis-Framework umzusetzen gehst Du wie folgt vor:
- Standardfunktionalität überschreiben mit
add_theme_support( 'custom-header', array(
'header_image' => '',
'header-selector' => '.site-title a',
'header-text' => false,
'height' => 150,
'width' => 500,
) );
Das lässt sich entweder über die functions.php (nur bei eigenem Theme welches man selbst weiterentwickelt!) oder z.B. über das Plugin My Custom Functions erweitern.
2. height und width aus dem Beispiel oben muss durch die zweifache Größe des eigentlichen Logos ersetzt werden. Also in diesem Beispiel hat das Logo die Abmessungen 250×75.
3. Im eigenen CSS ergänzen:
/* replace width and height with actual size, it means half the size you used above in theme support for custom-header */
.header-image .site-title > a {
background-size: <width>px <height>px;
}
Danke an Anything graphic (https://anythinggraphic.net/override-header-image-logo-genesis-wordpress-retina-2x-version/)