| Erstelle eine eigene Community! 
tutorial
WIe Baue ich externe Webtemplates ein?Beispiel meine testseite
www.keinsingle.de.tl
Ok fangen wir an.
Du suchst dir im netz ein Template aus.
Lädst es runter und eventuell entpackst du es.
1. Schritt ( die grafikdateien und der css code )
zuerst öffnest du die im ordner enthaltene css datei mit hilfe des editors.
lässt es geöffnet.
Öffne dann den Ordner mit den grafiken (meistens images genannt)
Lade jede Grafik hoch (entweder hier im hpbk oder extern zb. directupload.de )
Im css code findest du statt der ImagesURL eine beschreibung zb. backroundbg dort fügst du die dazugehörige hochgeladene grafikurl ein.
Das machst du mit jeder grafik die der css code verlangt.
speichern !
2. Schritt ( Html navi links )
Nun öffnest du im Webtemplate ordner die Index.html datei mittel dem Editor.
Kopierst alles ! raus und speicherst diese in einer Textdatei ab.
3.Schritt ( HPBK vorbereitungen)
Log dich ein
Design einstellungen
CSS Profi Design auswählen
speichern
erweiterte einstellungen
Text über dem design:
da kommt die ganz index.htm datei rein, also was ihr vorher kopiert habt.
Style ohne Tags:
hier kommt der css code rein den wir zuvor mit den grafiken gefüttert haben.
Dann müssen wir noch die extras ausschalten wie navi usw
dazu fügst du auch diesen Code bei Style ohne Tags ein:
#extraDiv1 {display: none;}
#extraDiv2 {display: none;}
#extraDiv3 {display: none;}
#extraDiv4 {display: none;}
#extraDiv5 {display: none;}
#extraDiv6 {display: none;}
#pre_header {display: none;}
#post_header {display: none;}
#pre_content {display: none;}
#nav_heading{display: none;}
#nav{display: none;}
div.header{display: none;}
h1#title{display: none;}
h2#title span {display: none;}
Speichern und bewundern :-)
4. Schritt Navi einfügen:
So um eure navi so zu machen wie im template macht ihr folgendes.
Bei text über dem design könnt Ihr die navipunkte finden die im Template zusehen sind.
zb.
#extraDiv2 {display: none;}
#extraDiv3 {display: none;}
#extraDiv4 {display: none;}
#extraDiv5 {display: none;}
#extraDiv6 {display: none;}
#pre_header {display: none;}
#post_header {display: none;}
#pre_content {display: none;}
#nav_heading{display: none;}
#nav{display: none;}
div.header{display: none;}
h1#title{display: none;}
h2#title span {display: none;}
Speichern und bewundern :-)
4. Schritt Navi einfügen:
So um eure navi so zu machen wie im template macht ihr folgendes.
Bei text über dem design könnt Ihr die navipunkte finden die im Template zusehen sind.
zb.
<h1>menu</h1>
<ul>
<li><a href="#" target="_top" onfocus="this.blur()">home</a></li>
<li><a href="#" target="_top" onfocus="this.blur()">about</a></li>
<li><a href="#" target="_top" onfocus="this.blur()">sitemap</a></li>
<li><a href="#" target="_top" onfocus="this.blur()">photos</a></li>
<li><a href="#" target="_top" onfocus="this.blur()">links</a></li>
Statt nun Home about usw könnt Ihr eure navi einbinden.
Verlinken tut Ihr sie dann so:
<li><a href="#" beim
#
kommt euer link rein zb. http://www.deineseite.de.tl/home
Hoffe Ihr habt es soweit verstanden :-)
Bei einigen Templates kann es probleme beim content geben.
Falls ja bitte ich euch mich zu kontaktieren ich werde euch weiterhelfen !
LG
Patrick
Kommentare zu dieser Seite:
|
KLASSE, da eröffnen sich mir jetzt ganz neue Möglichkeiten!
Und nochmals Danke danke danke! 
gruss
moneysac
Kommentar zu dieser Seite hinzufügen: