layout,styles en TABLES

[Jos]

Verband tussen sjabloon en stylesheet:
In het sjabloon zet je bijvoorbeeld: of

In je stylesheet zet je dan bijvoorbeeld:
#hoofdmenu {width:200px; height:500px;}
h2.paginatitel {color:#F00;font-size:1.5em;font-weight:bold;}

Een id mag maar één keer in een pagina (sjabloon) voorkomen, een class net zo vaak als je wenst.

Navigatie aan de rechterkant heb ik je laten zien met de standaard template in de vorige post. Alleen moet je die van links naar rechts verplaatsen (waar jij dus ook tabellen voor kunt gebruiken, zie de html-code die ik ook al eens eerder gepost heb.

Je kunt er een javascript-navigatie van maken, maar dan maak je het jezelf wel onnodig ingewikkeld. Je moet dan namelijk zelf een nieuwe template definiëren in de menumanager. Ik zou er in eerste instantie de standaard menu-templates voor gebruiken. Die kun je later altijd nog aanpassen (dat is de kracht van CMSms)
Gezien je voorbeeld, voegt javascript in je submenu aan de rechterkant niets toe. Het roll-out-effect in je hoofdmenu kun je ook bereiken met de standaard menu-template "cssmenu.tpl". Zie de toepassing ervan in bijvoorbeeld het standaard pagina-sjabloon "CSSMenu left + 1 column". Voor jou is het dus eigenlijk simpel een kwestie van combineren van wat standaard templates.

[hugosnel]

Jos,

Ik ben nu terug naar een hele simpele opzet om eea door te krijgen;
http://poisson-clement.fr/

Ik heb de contents in de TINYmce gezet maar wil het nu volgens de css regels doen.
In de template vind ik:

     
     
         {print showbutton=true script=true}
         {title}

         {content}


Waar en hoe definierr ik nu de volgende contents;
de foto en de text.
Ennmaal gedaan definieer ik dus in de stylesheet 'layout?) de positie en de eigenschappen?
Als ik dit doorheb ben ik op de goede weg lijkt me.
Merci,
Hugo

[Jos]

Om te voorkomen dat je voor de content stijlen gaat definiëren die conflicteren met stijlen voor andere elementen in je pagina, kun je in je sjabloon het beste {content} vervangen door {content}

Als je een pagina aanmaakt, geef je bijvoorbeeld aan de titel het formaat "Kop 1" mee (via TinyMCE).
Als je dan de broncode van de pagina bekijkt, zie je dat om de titel de tag staat.

Die wil je dus een bepaalde opmaak meegeven. Dat doe je in je stylesheet dmv:
div#content h1 { ..... }

Op dezelfde manier kun je dus opmaak meegeven aan de standaard paragraaf dmv:
div#content p {  }

Voor de foto wordt het mogelijk weer een stapje ingewikkelder. Dat ligt eraan of de foto het enige plaatje is in je content-blokje. In dat geval kun je in de stylesheet volstaan met div#content img {  }
Als er meerdere plaatjes voor kunnen komen, met verschillende opmaak, dan kun je een stijl-class definiëren.
Bijvoorbeeld in je stylesheet:
div#content img.fotometrand { border: 3px solid #FF0000; }

Met de standaard instellingen zal TinyMCE alle stijl-classes uit je stylesheet lezen en zie je die terug in het keuzemenu "stijlen".
Als je het de gebruiker makkelijker wil maken om de juiste stijl te kiezen, dan kun je je stijlen opgeven via Uitbreidingen > TinyMCE > tab CSS-stijlen.