Thema: Header verlinken

Naja. Du solltest dich erst mal grundlegend mit HTML und CSS beschäftigen.
Einen Link kannst du erst mal nur per <a href=.... setzen. Dann sollte da ein <img> und kein per css-background eingebundenes bild sein.
Es gibt natürlich auch verschiedene andere Möglichkeiten per image-map oder per javascript, aber sorry, das hier ist ein Joomla und kein HTML-Anfänger Forum, vielleicht solltest du dir erst mal bisschen was dazu durchlesen.

Ja, stimmt! Fast alle Tutorials und Templates zielen darauf ab, die Bilder aus dem Header ins CSS zu packen. Doch wie kaspurlu schon sagt, ist das für deinen Zweck keine Lösung.

Links können nur im HTML funtionieren, weshalb du hierfür deine templates/PHP-Datei bearbeiten musst. Wenn ich das richtig sehe, hast du darin sowieso schon Tabellen aufgezogen. Dann binde dort einfach die Grafik an entsprechender Stelle ein.

Den Rahmen enfernst du mit border="0" oder gleich global für alle Bilder in deiner CSS mit

img {
border: 0px;
}

das ganze kann man sehrwohl so lösen, dass das bild über die css kommt und der link dazu eben von der index.php des templates

... und wie sähe das dann im Quellcode der PHP aus?

Code:

code in der index.php:
<div id="logo"><a href="index.php" title="Zur Startseite"><span>Startseite</span></a></div>


code in der css:
#logo span{
display:none;
}
#logo a{
height:xxx px;
width:xxx px;
background:url(../xxx/xxx.jpg) no-repeat;
}

Ah OK. Muss ich mal bei Gelegenheit ausprobieren. Frage mich, ob das span-Element dann im HTML zwingend erforderlich ist. Ein ja, wäre eher unschön. Aber ich teste das einfach irgendwann selbst mal aus.

Hallo Huchmampf,

als erstes würde ich erstmal im CSS (der Codeschnipsel den du geschickt hast) die Eigenschaft "background" entfernen. Dann müsste schonmal das logo weg sein.

Als nächstes musst Du dir eine geignete Stelle für Dein logo finden... leider ist dein Template mit Tabellen aufgebaut, was sehr unschön ist, da Tabellen immer ein Dorn im Auge der Barrierefreiheit sind.

Zum Thema CSS hier eine gute Seite:
http://www.css4you.de/wscss/css01.html

Also zurück zur Deiner Tabelle:

Code:

<table width="760" height="100" border="0" cellpadding="0" cellspacing="0" id="header">

dies ist erst der Start der Tabelle jede Tabelle bestimmt immer aus dem Start / Zeile / Spalte...

Code:

<table>  <--- Anfang der Tabelle
   <tr>    <--- Anfang der Zeile
      <td>INHALT</td>          <--- Anfang und Ende einer Spalte MERKEN!
   </tr>  <-- Ende der Zeile
</table> <-- Ende der Tabelle

So ein Aufbau sieht natürlich einfach aus, kann sich je nach Template aber auch über deinen Gesamten Quellcode erstrecken. Was Du nun machen musst ist die 1. Spalte in deinem Header zu suchen und dort einfach:

Code:

<a href="ZIELURL" title="TITEL">
   <img src="BILDERURL" alt="Alternative für bild in form von Text" title="Titel des Bildes">
</a>

Einfügen...

Aber! sollte in der 1. Spalte was drinstehen, verdrengst du es natürlich damit auch...
dann könntest es evtl. noch so machen: (vor die 1. Spalte schreiben)

Code:

<td>
   <a href="ZIELURL" title="TITEL">
   <img src="BILDERURL" alt="Alternative für bild in form von Text" title="Titel des Bildes">
</a>
</td>

Wie Du siehst steht jetzt ein Spalten Anfang und ein Spalten ende noch drin. Mit anderen Worten wir haben uns einfach eine neue Spalte geschaffen, was natürlich die anderen beiden Spalten mit verdrängt und zusammenrücken lässt...

Ich hoffe ich konnte Dir etwas helfen.

P.S: Seit weit werden in diesem Board Anfänger gleich verdrängt ?