Pagina 1 van 1
menu toevoegen
Geplaatst: 19 sep 2007, 13:30
door emrulez
ik wil graag naar aanleiding van deze topic
http://www.phpbb.com/community/viewtopi ... u#p3169944
een menutje toevoegen onder de header net als her en dan het liefst deze
de eerste of de tweede
http://www.cssplay.co.uk/menus/pro_horizontal.html
Re: menu toevoegen
Geplaatst: 20 sep 2007, 16:39
door Semi_Deus
voeg in je stylesheet de benodigde CSS toe, die bij het menu hoort, voeg de plaatjes in de goede mappen (of in andere mappen, maar let er dan wel op dat je de CSS moet aanpassen). En plak de code in overall_header.html op de plaats die jij wil. Heel simpel (dit is dus nog boven de navbar class).
Re: menu toevoegen
Geplaatst: 20 sep 2007, 17:00
door emrulez
ik heb geen css bestand bij de menu gekregen
Re: menu toevoegen
Geplaatst: 20 sep 2007, 17:07
door Semi_Deus
Ik zie het, de css zit verwerkt in het html bestand.
Dan moet je die CSS van het html bestand kopieren, in een css bestand zetten die je bijvoorbeeld.
menu.css noemt.
dan link je in de overall_header.html naar dat bestand op deze manier:
Code: Selecteer alles
<link href="menu.css" rel="stylesheet" type="text/css" />
en dan plaats je de html op de goede plek.
(kijk wel heel goed of de css niet hetzelfde is als die van phpBB classes!)
Re: menu toevoegen
Geplaatst: 20 sep 2007, 17:22
door emrulez
ik snap er niet veel van maar dit is de code van de menu
Code: Selecteer alles
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml2/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title> Stu Nicholls | CSSplay | Professional series #2</title>
<style type="text/css">
/*Credits: CSSpplay */
/*URL: http://www.cssplay.co.uk/menus/pro_two */
.menu2 {padding:0 0 0 32px; margin:0; list-style:none; height:35px; background:#fff url(button1.gif); position:relative; border:1px solid #000; border-width:0 1px; border-bottom:1px solid #444;}
.menu2 li {float:left;}
.menu2 li a {display:block; float:left; height:35px; line-height:35px; color:#aaa; text-decoration:none; font-size:11px; font-family:arial, verdana, sans-serif; font-weight:bold; text-align:center; padding:0 0 0 8px; cursor:pointer;}
.menu2 li a b {float:left; display:block; padding:0 16px 0 8px;}
.menu2 li.current a {color:#fff; background:url(button3.gif);}
.menu2 li.current a b {background:url(button3.gif) no-repeat right top;}
.menu2 li a:hover {color:#fff; background:#000 url(button4.gif);}
.menu2 li a:hover b {background:url(button4.gif) no-repeat right top;}
.menu2 li.current a:hover {color:#fff; background:#000 url(button3.gif); cursor:default;}
.menu2 li.current a:hover b {background:url(button3.gif) no-repeat right top;}
</style>
</head>
<body>
<ul class="menu2">
<li><a href="#nogo"><b>Home</b></a></li>
<li><a href="#nogo"><b>FAQ</b></a></li>
<li class="current"><a href="#nogo"><b>Products</b></a></li>
<li><a href="#nogo"><b>Links</b></a></li>
<li><a href="#nogo"><b>Contact us</b></a></li>
<li><a href="#nogo"><b>Search</b></a></li>
</ul>
</body>
</html>
welk gedeelte is de css?
Re: menu toevoegen
Geplaatst: 20 sep 2007, 18:36
door Semi_Deus
oke, sorry, ik zal duidelijker zijn:
Dit is de CSS:
Code: Selecteer alles
.menu2 {padding:0 0 0 32px; margin:0; list-style:none; height:35px; background:#fff url(button1.gif); position:relative; border:1px solid #000; border-width:0 1px; border-bottom:1px solid #444;}
.menu2 li {float:left;}
.menu2 li a {display:block; float:left; height:35px; line-height:35px; color:#aaa; text-decoration:none; font-size:11px; font-family:arial, verdana, sans-serif; font-weight:bold; text-align:center; padding:0 0 0 8px; cursor:pointer;}
.menu2 li a b {float:left; display:block; padding:0 16px 0 8px;}
.menu2 li.current a {color:#fff; background:url({T_THEME_PATH}/images/button3.gif);}
.menu2 li.current a b {background:url({T_THEME_PATH}/images/button3.gif) no-repeat right top;}
.menu2 li a:hover {color:#fff; background:#000 url({T_THEME_PATH}/images/button4.gif);}
.menu2 li a:hover b {background:url({T_THEME_PATH}/images/button4.gif) no-repeat right top;}
.menu2 li.current a:hover {color:#fff; background:#000 url({T_THEME_PATH}/images/button3.gif); cursor:default;}
.menu2 li.current a:hover b {background:url({T_THEME_PATH}/images/button3.gif) no-repeat right top;}
Voeg deze toe aan de stylesheet. [acp > stijlen tab > jouw stijl > thema]
Dit is de HTML:
Code: Selecteer alles
<ul class="menu2">
<li><a href="#nogo"><b>Home</b></a></li>
<li><a href="#nogo"><b>FAQ</b></a></li>
<li class="current"><a href="#nogo"><b>Products</b></a></li>
<li><a href="#nogo"><b>Links</b></a></li>
<li><a href="#nogo"><b>Contact us</b></a></li>
<li><a href="#nogo"><b>Search</b></a></li>
</ul>
voeg die toe in je overall_header.html
Nu moet je de plaatjes nog uploaden, het is het handigste om deze in de map>
stijlen>jouwstijl>theme>images te uploaden.
Ik heb voor je gemak al bij elke css class voor elk plaatje: {T_THEME_PATH}/images/ ingevoegd, zodat je dit niet meer hoeft te doen. Dit zorgt ervoor dat hij de plaatjes uit deze: stijlen>jouwstijl>theme>images, map haalt.
Vertel maar als het nogsteeds niet lukt.
Re: menu toevoegen
Geplaatst: 20 sep 2007, 21:18
door emrulez
Semi_Deus schreef:oke, sorry, ik zal duidelijker zijn:
Dit is de CSS:
Code: Selecteer alles
.menu2 {padding:0 0 0 32px; margin:0; list-style:none; height:35px; background:#fff url(button1.gif); position:relative; border:1px solid #000; border-width:0 1px; border-bottom:1px solid #444;}
.menu2 li {float:left;}
.menu2 li a {display:block; float:left; height:35px; line-height:35px; color:#aaa; text-decoration:none; font-size:11px; font-family:arial, verdana, sans-serif; font-weight:bold; text-align:center; padding:0 0 0 8px; cursor:pointer;}
.menu2 li a b {float:left; display:block; padding:0 16px 0 8px;}
.menu2 li.current a {color:#fff; background:url({T_THEME_PATH}/images/button3.gif);}
.menu2 li.current a b {background:url({T_THEME_PATH}/images/button3.gif) no-repeat right top;}
.menu2 li a:hover {color:#fff; background:#000 url({T_THEME_PATH}/images/button4.gif);}
.menu2 li a:hover b {background:url({T_THEME_PATH}/images/button4.gif) no-repeat right top;}
.menu2 li.current a:hover {color:#fff; background:#000 url({T_THEME_PATH}/images/button3.gif); cursor:default;}
.menu2 li.current a:hover b {background:url({T_THEME_PATH}/images/button3.gif) no-repeat right top;}
Voeg deze toe aan de stylesheet. [acp > stijlen tab > jouw stijl > thema]
Dit is de HTML:
Code: Selecteer alles
<ul class="menu2">
<li><a href="#nogo"><b>Home</b></a></li>
<li><a href="#nogo"><b>FAQ</b></a></li>
<li class="current"><a href="#nogo"><b>Products</b></a></li>
<li><a href="#nogo"><b>Links</b></a></li>
<li><a href="#nogo"><b>Contact us</b></a></li>
<li><a href="#nogo"><b>Search</b></a></li>
</ul>
voeg die toe in je overall_header.html
Nu moet je de plaatjes nog uploaden, het is het handigste om deze in de map>
stijlen>jouwstijl>theme>images te uploaden.
Ik heb voor je gemak al bij elke css class voor elk plaatje: {T_THEME_PATH}/images/ ingevoegd, zodat je dit niet meer hoeft te doen. Dit zorgt ervoor dat hij de plaatjes uit deze: stijlen>jouwstijl>theme>images, map haalt.
Vertel maar als het nogsteeds niet lukt.
Maakthet uit waar ik het precies toevoeg?
het ziet er nu alleen een beetje raar uit en kn het onder de header?
http://gamerz-nation.dotbashosting.nl/forum/index.php
Kan ik de menu ook zetten op de plaats van het blauwe?
Re: menu toevoegen
Geplaatst: 20 sep 2007, 21:51
door Semi_Deus
Code: Selecteer alles
.menu2 {padding:0 0 0 32px; margin:0; list-style:none; height:35px; background:#fff url({T_THEME_PATH}/images/button1.gif); position:relative; border:1px solid #000; border-width:0 1px; border-bottom:1px solid #444;}
.menu2 li {float:left;}
.menu2 li a {display:block; float:left; height:35px; line-height:35px; color:#aaa; text-decoration:none; font-size:11px; font-family:arial, verdana, sans-serif; font-weight:bold; text-align:center; padding:0 0 0 8px; cursor:pointer;}
.menu2 li a b {float:left; display:block; padding:0 16px 0 8px;}
.menu2 li.current a {color:#fff; background:url({T_THEME_PATH}/images/button3.gif);}
.menu2 li.current a b {background:url({T_THEME_PATH}/images/button3.gif) no-repeat right top;}
.menu2 li a:hover {color:#fff; background:#000 url({T_THEME_PATH}/images/button4.gif);}
.menu2 li a:hover b {background:url({T_THEME_PATH}/images/button4.gif) no-repeat right top;}
.menu2 li.current a:hover {color:#fff; background:#000 url({T_THEME_PATH}/images/button3.gif); cursor:default;}
.menu2 li.current a:hover b {background:url({T_THEME_PATH}/images/button3.gif) no-repeat right top;}
ik was er nog 1 vergeten te doen met {T_THEME_PATH}/images/
En dat blauwe kan je zwart maken als je dat wil.
Maar eigenlijk kan ik je helemaal geen support geven, omdat je de copyright rechten van phpbb.com schend.
De border die je gebruikt is van phpbb.com, en valt onder hun copyright. Dus deze zal je helaas eerst moeten verwijderen.
Re: menu toevoegen
Geplaatst: 21 sep 2007, 10:43
door emrulez
ik heb het via de tutorial up
http://www.phpbbfan.com gedaan er zijn wel wat verschillen in de border met phpbb.com of zie ik het verkeerd?
mocht niet zo zijn haal ik het wel weg
maar ik zorg ik er voor dat de menu op de plaats van het blauwe onde de header komt?
Wijziging: trouwens ik wil die borders eigenlijk niet zo maar dat ze helemaal doorlopen net als hier hoe doe ik dat eigenlijk?