TwentyEleven: Logo statt Titel mit relativem Pfad (und Verlinkung auf Startseite)

Hallo Forum!

Ich bin gerade dabei eine Wordpress-Seite ein wenig anzupassen. Nun möchte ich den Titel der Seite im Twenty-Eleven-Theme ein wenig modifizieren, es soll ein Logo statt dem Seitentitel angezeigt werden.

Das Logo möchte ich per relativer Pfadangabe einbinden, etwa über einen PHP-Code-Schnipsel, welcher über einen Pfad mit der Angabe des Document-Roots (oder Ähnliches) das Bild in einem IMG-Tag einbindet.

Den Lösungsansatz den ich verfolge ist, die Zeilen in der header.php zu ersetzen.

Ursprüngliche Zeilen:

<hgroup>
                <h1 id="site-title"><span><a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></span></h1>
                <h2 id="site-description"><?php bloginfo( 'description' ); ?></h2>
            </hgroup>

Neue Zeilen:

<hgroup>
                <a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><img src="<?php echo $_SERVER['DOCUMENT_ROOT']."/wordpress/wp-content/themes/twentyeleven/images/logo/logo.jpg";?>" /></a>
            </hgroup>

Leider sehe ich den Bereich des Headers mit Titel etc. nun gar nicht mehr, geschweige denn wird mein Logo angezeigt.

Was mache ich falsch? ich habe mir schon diverse Threads hier im Forum durchgelesen, unter anderem auch die Variante mit CSS nach diesem Schema:
http://forum.wpde.org/design/89385-l…nty-eleven.html

Ich poste hierzu auch mal meinen Code:

<hgroup>
        <style type="text/css">
            .robot{
             background-image: url(wp-content/uploads/2013/02/logo.jpg);
            /* width: 182px;*/
             height: 100px;
             margin-left:10%;
            }
        </style>
        <p class="robot">&thinsp;</p>
    </hgroup>

Wobei hier auch nur eine weiße Zeile oberhalb des eigentlichen Header-Bildes des TwentyEleven-Themes angezeigt wird. Die Verlinkung fehlt hier auch noch, das wäre aber nicht so wild - wenn wenigstens mein Logo angezeigt werden würde :evil:

Kann mir jemand weiterhelfen?
Am Liebsten wäre mir ja die Variante mit weniger CSS und diesem einfachen IMG-Tag.
Muss ich an dieser Stelle vielleicht noch was in der CSS anpassen?

Bin für jede Lösung / jeden Hinweis dankbar...

Hallo Wordpress-User!

Ich habe eine Lösung gefunden, ich setze den Link (inkl. img-Verweis) innerhalb des <hgroup>-Tags ein und formatiere das Bild direkt. Den relativen Pfad habe ich mittels "echo esc_url( home_url(...))" neu zusammengebaut.

Hier mein Code:

<hgroup>
<a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><p style="height: 100px; width: 200px; margin-top: 20px; margin-bottom: -20px; margin-left: -40px;"><img src="<?php echo esc_url( home_url( '/wp-content/themes/twentyeleven/images/logo/logo.jpg' ) );?>" /></p></a>
</hgroup>

Zitat von MegaWork

Warum so kompliziert? Warum nicht einfach per CSS den Text verschieben, die Abmessungen des Links festlegen und die Logografik als Hintergrundbild anzeigen lassen?

Ich glaube für mich ist das Verschieben, Abmessungen festlegen und Grafik als Hintergrundbild anzeigen lassen ein erheblich größerer Aufwand. CSS ist (bisher) nicht so meine Spielwiese :wink:

Zitat

Das reduziert den Aufwand, die Fehleranfälligkeit und der Text kann trotzdem noch von Screenreadern und Suchmaschinen gelesen werden!

Ist der angezeigte Text denn relevant für das Pageranking?

Zitat von MegaWork

Wenn Du ein Logo in der gewünschten Größe hast, hast Du doch automatisch die benötigten Abmessungen.

Richtig! Wenn ich das Bild allerdings als Hintergrundbild im Header anzeigen lasse, wird es vergrößert und pixelig.

Zitat von MegaWork

Ich gehe einmal davon aus, dass Du mit einem Child-Theme arbeitest, da Du ja Änderungen am Header programmiert hast. In dem Fall hast Du ja auch schon eine style.css in der Du die eigenen Stil Anpassungen eintragen kannst. (Textverschiebung per text-indent:-999em; hintergrundbild background:url(Pfad zur Grafik) )
CSS zu lernen ist unerlässlich wenn Du Dich mit Webseitenerstellung ernsthaft befassen willst.

Ein Child-Theme habe ich soeben in#s Leben gerufen. Unabhängig von meinem Thema ist es wohl schon klug so etwas zu tun, da man sich bei Updates ja die kompletten Änderungen zerschießen kann (modifizierte Files werden überschrieben).

Zitat von MegaWork

Nun ja, in der Regel ist es der Name deiner Webseite und eine kurze Beschreibung der Seite - ich würde schon behaupten, das diese Informationen relevant sind, vor allem weil Suchmaschinen Bilder ja nicht "lesen" können.

Das Problem ist: Mein Logo ist eher eine Wortmarke als ein Bild. Daher wäre dieser Text dann doppelt...
Ich werde die Änderungen jetzt mal so drin lassen, immerhin funktioniert ja mein neuer Header inklusive Anzeige des Logos und relativer URL.