Header verlinken

[Michael]

Hi zusammen

Ich stehe gerade etwas auf dem Schlauch...
Suche die einfachste Variante mein Header-Image immer mit der Startseite zu verlinken. Also auf jeder Seite ist der gleiche Header und der soll jeweils auf die Startseite verlinkt sein.

Habe das Header-Image per CSS eingebaut:

<div id="header">

CSS: background: url(http://...header-image.jpg)

Beste Dank!
Michael

[lucina]

Vermutlich fährst Du besser, wenn Du ein Modul vom Typ 'eigenes HTML' nach folgendem Muster anlegst ...

<div id="head">
<a href="{{env::url}}"><img src="foo.jpg" /></a>
</div>

... dieses dann ins Layout einbindest und die restlichen Eigenschaften wie Breite und so weiter per CSS festlegst.

Carolina.

[Toflar]

Du musst das Bild als <img /> einbinden, weil div's im Normalfall ja nicht klickbar sind

[Oden]

Wenn du das Bild mittels CSS ausgibst, kannst du keinen direkten Link auf das Bild setzen. Hier bietet es sich dann an, das Bild als Modul 'Eigenes HTML' einzubinden. Zum Bsp. ein Modul mit Namen Logo oder sowas. Das dann im Seitenlayout im Kopfbereich fest definieren.


cu.Oden

[Michael]

Wow!

Vielen Dank für die schnellen 3 Antworten. Werde es gerade testen!

Beste Grüsse
Michael

[codedreality]

Ich nehme das Modul "Eigener HTML-Code" und pack das hier rein:

<a href="http://www.meinehp.de/"><img style="display:block;" src="tl_files/images/header.jpg" alt="Header Image" /></a>

[Michael]

Hat bestens funktioniert. Ein kleines CSS-Problem habe ich dann noch...

[Michael]

Habe noch ein kleines Problem:
Habe nun folgendes HTML-Gerüst:

<div id="headimg">
<div id="topmenu">

Das Topmenü sind zwei Textlinks zum Anmelden. Leider überdeckt das Headerimage diese zwei Links.
Kriege es per CSS einfach nicht hin...

Zu sehen hier: www.fch.ch

Besten Dank einen Tipp!
Michael

[BugBuster]

Also, als erstes gibts du deinem Header erstmal ne passende Höhe, 1px ist arg wenig. (Layout Einstellung)

#header {
height:120px;
}

Dann nimmst du das position:absolut aus #headimg raus.

Dann änderst du #topmenü:

#topmenu {
color:#FFFFFF;
font-size:11px;
font-weight:bold;
position:absolute;
right:100px;
top:4px;
}

Durch die neue Höhe bei Header müssen wir nun noch den margin im #container korrigieren:

margin-top:10px;

Und das kommt bei raus.

Übrigens alles kurz mit FF und FireBug zusammen geklickt.

[Michael]

Hi Bugbuster

Gewusst wie! Besten Dank!

Michael