Seite 1 von 1

Icon im Header

Verfasst: 30.08.2010 14:27
von editor2
Hallo,

gerne möchte ich in meinem Header ein paar Favicon + Verlinkung einbinden.
Icon sind fertig erstellt worden und haben eine Größe von: 32x32 px.

Headervorschau:
http://www.abload.de/img/sbbfu2.jpg

Möchte dort, wo der rote Balken ist, die Icon einbinden. Wie genau mache ich das?

Gruß,
editor2

Re: Icon im Header

Verfasst: 30.08.2010 15:21
von 7emper5i
Die Platzierung erfolgt per CSS.

Da wir dein Style nicht kennen und es dir gar nichts bringen würde, wenn wir dir alles fertig vorformuliert hier niederschreiben, ist es am einfachsten, wenn du dir die Grundlagen anließt:

Peter Kropff: CSS Grundladen (sehr einfach geschrieben und vor allem in einem systematischen Fluss für Einsteiger geeignet)

Und dir dann ein zwei Beispiele im Quelltext anguckst, wo andere User das schon mal gemacht haben.

Zum Beispiel DJChrissnet - Der hat die Twitter, Facebook, etc Favicons auch ähnlich eingebunden.

Re: Icon im Header

Verfasst: 30.08.2010 16:07
von gloriosa
Hallo,
es gibt sogar eine Anleitung namens [HowTo] Neuer Link mit Icon im phpBB-Kopf die mit Sicherheit weiterhilft und sich auch über die, viel zu selten benutzte, boardeigene Funktion Suchen zu finden lässt. :wink:

Re: Icon im Header

Verfasst: 30.08.2010 20:09
von editor2
Danke für euere Antwort.

Hat man nicht die Möglich mit HTML mit den Befehlen wight und hight innerhalb overall_header.html zu platzieren?

Re: Icon im Header

Verfasst: 30.08.2010 20:16
von 7emper5i
Ne du ;)

denn, dass das du da geschrieben hast, beschreibt nur die Größe des von dir zu benutzenden Bildes. (PS: width..)

Was du aber machen kannst, ist die CSS-Angaben in HTML einbinden. Für Kleinigkeiten ist das manchmal wesentlich einfacher, aber ratsam ist es bei Großprojekten nicht.

Diesbezüglich kannst du dich aber auch beim Peter schlau lesen, einfach auf den HTML Link klicken.
Einfacher kann man dir die Materie nicht näher bringen :)


Wobei ich gerade sehe, dass es sich der DJ auch einfach gemacht hat, was ja nicht schlecht ist ;)

Schau dir seinen Quellcode an, dann siehst du, dass er zwei Container aufgemacht hat und dort seiner Bilderkes eingefügt hat. Als Anschauungsobjekt sollte dir das genug Hilfestellung geben:

Code: Alles auswählen

<div style="float:left; width:460px;">
        	<a href="./?sid=177affbc2df25a4ac9ca5b7494b29d6e" title="Foren-Übersicht"><img src="./styles/prosilver/theme/images/head_logo.png" height="138" width="460" alt="Djchrisnet Webtechnik" style="margin-left:50px;" /></a>
		</div>
		<div style="float:right; width:200px;">
        	<a href="http://twitter.com/djchrisnet" title="Twitter:djchrisnet"><img src="./images/twitter.png" height="64" width="64" alt="Follow djchrisnet on twitter" style="margin-top:17px;" /></a>

            <a href="http://www.facebook.com/djchrisnet" title="Facebook:djchrisnet"><img src="./images/facebook.png" height="64" width="64" alt="Facebook:djchrisnet" style="margin-top:17px;" /></a>
            <a href="https://www.xing.com/profile/xxxxxxx2" title="XING:djchrisnet!"><img src="./images/xing.png" height="64" width="64" alt="XING:djchrisnet!" style="margin-top:17px;" /></a>
        	</div>
		<span class="corners-bottom"><span></span></span></div>
	</div>
Quelle: http://djchrisnet.de/