Sidebar
ein-/ausblenden

WP - Headerbild verlinken

Plugin für WordPress SEO

Anzeige

Im Allgemeinen gehört es zum guten Ton einer Website, wenn das Bild im Header auf die Startseite der Internet-Präsentation verlinkt. Da dies bei WordPress standardmäßig nicht so ist, sollte man folgenden Code in die header.php einfließen lassen. 


onclick="location.href='http://www.website.domain/';"
 onkeypress="location.href='http://www.website.domain/';" style="cursor: pointer;"

Update:
Von webdesign-in wurde ich darauf hingewiesen, wie man diese Erhöhung der Benutzerfreundlichkeit für alle Webuser brauchbar macht. Im Artikel ist ersichtlich, dass onclick und onkeypress zusammen gehören. Da ich barrierefreie Websiten natürlich für sinnvoll erachte, habe ich eine Codeänderung vorgenommen. Jetzt sollte der Code barrierearm/-frei sein.

Das ist schnell erledigt und erhöht so das Usability der Seite. Das ganze kann man lokal durchführen, oder aber in der Admin-Oberfläche deines WP unter --> Themes --> Theme-Editor --> Header Template.

suche nach:


<div id="header">
 <div id="headerimg" >
  <h1><a href="<?php echo get_settings('home'); ?>"><?php bloginfo('name'); ?></a></h1>
  <div class="description"><?php bloginfo('description'); ?></div>
 </div>
</div>

ändere in:


<div id="header">
 <div id="headerimg" onclick="location.href='<?php bloginfo('url'); ?>';"
onkeypress="location.href='<?php bloginfo('url'); ?>';" style="cursor: pointer;">
  <h1><a href="<?php echo get_settings('home'); ?>" title="<?php bloginfo('name'); ?>">
<?php bloginfo('name'); ?></a></h1>
  <div class="description"><?php bloginfo('description'); ?></div>
 </div>
</div>
Artikel #39, 16. November 2005 · Tipps, WordPress · 18 Kommentare · Kommentar schreiben
Tags: , , , ,
Kommentar-Feed zum Artikel · TrackBack URL · Kurzlink

«
»

11 Kommentare und 7 Trackbacks zu „WP - Headerbild verlinken“

  1. 1
    Kommentar von steinhau
    14. November 2005 um 18:35

    Habe nach sinnfälligem googeln diesen Tipp gefunden, der exakt mein Problem löste. Vielen Dank dafür!

  2. 2
    Trackback von professional WebDesign barrierefrei
    16. November 2005 um 01:34
  3. 3
    Pingback von onclick onkeypress Header verlinken
    16. November 2005 um 01:35
  4. 4
    Kommentar von twelve
    18. Dezember 2005 um 00:53

    Yo! Kann mich meinem Vorredner nur anschliessen - kurze und knackige Lösung. Bin begeiestert! Danke.

  5. 5
    Pingback von david’s blog » Blog Archive » Änderungen am Header-Image
    22. März 2006 um 11:35
  6. 6
    Pingback von Plugins und Features auf Blog der CVP Luzern
    19. April 2006 um 10:14
  7. 7
    Pingback von WP - WordPress 2.0 und die Plugins - bueltge.de [by:ltge.de]
    14. Mai 2006 um 14:21
  8. 8
    Pingback von Ronan@Tirion » Archive du blog » Klein, aber fein!
    26. Juli 2006 um 19:16
  9. 9
    Kommentar von grunet
    8. November 2006 um 14:22

    Leider funktioniert bei meinem Theme der Tipp nicht. Das Bild ist im Background, kann es ev.t daran liegen? benutze das "Bleibt alles anders"-Thema.

  10. 10
    Kommentar von Frank Bültge
    8. November 2006 um 17:28

    Nein, dss Bild ist in den meisten Themen im Hintergrund, wird also per CSS eingefügt. Der Tipp basiert darauf, dass der Container mit dem Scipt erweitert wird und nicht das Bild.
    LG Frank

  11. 11
    Kommentar von Domme
    20. Dezember 2006 um 18:43

    Danke! :)
    Genau danach hab ich gesucht.

  12. 12
    Pingback von plagiat bloggen » header image verlinken
    21. August 2007 um 10:25
  13. 13
    Kommentar von Kathrin Siemokat
    19. November 2008 um 20:30

    Vielen lieben Dank für diesen Hinweis! Endlich kann ich mein Headerbild verlinken :-) Bin total glücklich

  14. 14
    Kommentar von jc0967
    12. Mai 2009 um 23:35

    Hallo Leute, kann mir bitte jemand helfen! Was mache ich falsch? Ich kann mein Bild im Header nicht verlinken???? Danke Euch


    <div id="headerimg" onclick="location.href='';"
    onkeypress="location.href='';" style="cursor: pointer;">
    <a href="" title="">

  15. 15
    Kommentar von Philip M
    22. August 2010 um 17:16

    mmh.. ich weiß nicht wie viele deine Kommentarregeln lesen.. ", dann lösche ich deinen Kommentar" ?? entweder ganz falsch oder richtig...

    trotzdem danke der Headerlink funktioniert auch bei 3.0.1

  16. 16
    Kommentar von derx
    2. Mai 2011 um 21:21

    Ich habe in der page.php:
    <div class="art-header-jpeg"
    ersetzt durch:

    haut hin & freu,

    lg

  17. 17
    Kommentar von derx
    2. Mai 2011 um 21:26

    div class="art-header-jpeg" onclick="location.href='http://www.graumann.at/wp/index.php';" style="cursor: pointer;"></div

    ok, also da gehört dazu, dann kann man aber das was dazwischen ist hier nicht sehen, sorry ;)

  18. 18
    Kommentar von Christian Fredebeul
    4. September 2011 um 23:30

    Vielen Dank auch von mir - wenn man es weiss, ist es doch so einfach :)

Kommentar schreiben

Kommentarregeln: Bleib cool, kritisch ist in Ordnung, aber wenn du unhöflich bist, dann lösche ich deinen Kommentar. Bitte benutze deinen persönlichen Namen oder Initialen und nicht den Namen eines Unternehmens, dies würde als Spam gewertet und wird gelöscht. Der Zusammenhang zwischen Namen und URL sollte nicht offensichtlich auf Spam hindeuten! ♥ Ansonsten, vielen Dank für den Kommentar und viel Spaß mit meinem Blog.

E-Mail-Benachrichtigung bei weiteren Kommentaren.
Auch möglich: Abo ohne Kommentar.

Kommentar-Hilfe

händischer Spam:
Beachte die Kommentarregeln, jede Form von versuchtem Spam wird gelöscht. Warum und wieso steht in einem meiner Beiträge.

Bezug auf Textstellen:
Du kannst direkt bezug auf Textstellen im Beitrag nehmen. Dazu muss lediglich der Bereich im Artikel markiert werden; daraufhin erscheint ein Button, der den markierten Text in das Kommentarfeld übernimmt und als Zitat auszeichnet. Die Funktion ist nur bei aktivem JavaScript nutzbar.

xHTML:
Du kannst folgende Tags benutzen: <a href="" title=""> <abbr title=""> <acronym title=""> <blockquote cite=""> <code> <pre> <em> <strong> <strike> <ul> <ul> <li>

Achte darauf, wenn du Code im Kommentar hinterlegen willst, dann muss der Code maskiert sein. Dann wird er nicht interpretiert. Der Code muss mit Hilfe von HTML-Entities dargestellt werden, d.h. dass man z.B. < als &lt; und > als &gt; einfügt.

E-Mail-Benachrichtigung bei neuen Kommentaren ?
Wenn der Haken in der Checkbox gesetzt ist, dann wirst du über neue Kommentare vie E-Mail informiert. Der Versand erfolgt nur, wenn du die URL in der Bestätigungs-E-Mail genutzt hast oder schon Abonnent hier im Blog bist.

Kommentar erscheint nicht:
Alle Kommentare werden manuell geprüft, freigegeben und nach Möglichkeit beantwortet. Bitte um etwas Geduld und Nachsicht.

Identifikationsbilder (Avatare):
Auf Gravatar.com kann man sich mit seiner E-Mail-Adresse registrieren und ein Bild hochladen, dann erscheint dieses Gravatar hier und in vielen weiteren Blogs.

Spamschutz:
Das Kommentarformular ist mit einem Spamschutz ausgerüstet. Solltest du diesen Artikel ohne JavaScript besuchen und kommentieren wollen, so muss du die Frage beantworten und das jeweilige Wort in das Textfeld eingeben.