3.4 Menù in alto come nel forum ufficiale di IPB

[Amy Pond]

Ciao ragazzi, rieccomi con una delle mie solite domande: come si fa a fare un bellissssssimo menù in alto nel forum, come in quello ufficiale di IPB? intendo quello nella barra nera con i vari link customizzati.

 

 

Thanks ;D

[BomAle]

Scegli la skin da modificare (esempio seguente è valido con la skin originale ip.board e gran parte delle skin personalizzate)

Cerca in globalTemplate

			<!-- ::: TOP BAR: Sign in / register or user drop down and notification alerts ::: -->			<div id='header_bar' class='clearfix'>

 

2. A. aggiungi prima

<div class="clearfix" id="ipsClientLinks">	<div class="main_width">		<a class="ipsButton_secondary left" href="http://community.invisionpower.com/files/">IPS Marketplace</a>		<strong class="left">Resources:</strong>		<ul class="ipsList_inline left">			<li><a title="Client Area" href="http://www.invisionpower.com/clients/">Client Area</a></li>			<li><a title="Guides" href="http://www.invisionpower.com/support/guides/">Guides</a></li>			<li><a title="Knowledgebase" href="http://www.invisionpower.com/support/kb">Knowledgebase</a></li>		</ul>		 		<strong class="left">Development:</strong>		<ul class="ipsList_inline left">			<li><a title="Custom projects" href="http://community.invisionpower.com/resources/projects">Custom projects</a></li>			<li><a title="Browse IPS develoeprs" href="http://community.invisionpower.com/resources/developers">Browse IPS developers</a></li>			<li><a title="Developer guides" href="http://www.invisionpower.com/support/guides/_/advanced-and-developers/">Developer guides</a></li>		</ul>	</div></div>

2. B. oppure crea un template aggiungivo nel gruppo skin_global esempio

e inserisci prima

{$this->registry->output->getTemplate('global')->menu_alto()}

a questo punto inserisci il contenuto html qui sopra all'interno del template creato menu_alto e salva il tutto

per gli stili puoi aggiungere

<style type="text/css">#ipsClientLinks {    background: none repeat scroll 0 0 #000000;    color: #FFFFFF;    line-height: 24px;    padding: 10px 0;}#ipsClientLinks .ipsButton_secondary {    color: #000000;    margin-right: 20px;}#ipsClientLinks a {    color: #A8B3BA;}.ipsButton_secondary {    background: -moz-linear-gradient(center top , #F6F6F6 0%, #E5E5E5 100%) repeat scroll 0 0 transparent;    border: 1px solid #DBDBDB;    border-radius: 3px 3px 3px 3px;    box-shadow: 0 1px 0 #FFFFFF inset, 0 1px 0 rgba(0, 0, 0, 0.3);    color: #616161;    display: inline-block;    font-size: 12px;    height: 22px;    line-height: 22px;    padding: 0 10px;    transition: all 0.2s ease-in-out 0s;    white-space: nowrap;}</style>

se lo vuoi il menu fisso in alto alla schermata video aggiungi al css

#ipsClientLinks {    left: 0;    margin-top: -44px;    position: fixed;    right: 0;    z-index: 200;}#ipsClientLinks + * {    margin-top: 44px; /* circa per evitare che si soprappongano le barre */} 

se hai problemi riformulo meglio domani sera notte

[Amy Pond]

Grazie mille!

Avendo il container, nella skin personalizzata, mi "taglia" lo sfondo nero a larghezza container. Come posso allargarlo a tutta pagina?

[BomAle]

devi aggiungere il codice prima di

			<!-- ::: BRANDING STRIP: Logo, nav and search box ::: -->			<div id="branding">

e risolvi

[Amy Pond]

Grazie mille :-D

[najaru]

Ti funziona? sei riuscito a farlo bene?