Skocz do zawartości
  • Zarejestruj się
Zaloguj się, aby obserwować  
icebox

[Artykuł][Tutorial] Dodawanie górnego menu

Polecane posty

1) Pobierz plik ips.mastnav.js i wyrzucić go do public / JS !

2) Następnie przejdź do ACP -> Wygląd -> Twój styl -> Szablony główne ->, skopiuj poniższy kod i wklej go zaraz po <div id = "ipbwrapper ">

nie zapominamy o zmianie nazw i odnośników w kodzie

<!-- START MASTHEAD NAV --> 

<script type='text/javascript' src='..public/js/ips.mastnav.js'></script>

<div id="masthead">
<ul id="primary_navigation">
<li id="nav_home"><a href="http://www.invisionpower.com">IPS Home Page</a></li>
<li id="nav_products">
<a href="http://www.invisionpower.com/products/">Products</a>
<ul class="main_menu" id="nav_products_menu" style="display: none;">
<li><a title="IP.Board: Community Discussion Board" href="http://www.invisionpower.com/products/board/">IP.Board</a></li>
<li><a title="IP.Blog: Community Blogging Service" href="http://www.invisionpower.com/products/blog/">IP.Blog</a></li>
<li><a title="IP.Content: Content Creation System" href="http://www.invisionpower.com/products/content/">IP.Content</a></li>
<li><a title="IP.Gallery: Community Image Gallery" href="http://www.invisionpower.com/products/gallery/">IP.Gallery</a></li>

<li><a title="IP.Chat: Realtime Community Chatroom" href="http://www.invisionpower.com/products/chat/">IP.Chat</a></li>
<li><a title="IP.Downloads: Download Manager" href="http://www.invisionpower.com/products/downloads/">IP.Downloads</a></li>
<li><a title="IP.Converge: Single Sign-on For Communities" href="/products/converge/">IP.Converge</a></li>
<li><a title="Spam Monitoring: Protecting Communities From Spam" href="http://www.invisionpower.com/products/spammonitor/">Spam Monitor Service</a></li>
<!--<li><a href='http://www.invisionpower.com/products/community/' title=''>Community Projects</a></li>-->
</ul>
<script type="text/javascript">
ips.menus['products'] = new ips.menu( $('nav_products'), $('nav_products_menu') );
</script>

</li>
<li id="nav_hosted">
<a href="/hosting">Hosted Communities</a>
<ul class="main_menu" id="nav_hosted_menu" style="display: none;">
<li><a title="Go to standard packages" href="http://www.invisionpower.com/hosting/">Standard Packages</a></li>
<li><a title="Go to Advanced packages" href="http://www.invisionpower.com/hosting/advanced.php">Advanced Packages</a></li>
<li><a title="Go to website hosting" href="http://www.invisionpower.com/hosting/website.php">Website Hosting</a></li>

</ul>
<script type="text/javascript">
ips.menus['hosted'] = new ips.menu( $('nav_hosted'), $('nav_hosted_menu') );
</script>
</li>
<li id="nav_services">
<a title="Go to our Services overview" href="http://www.invisionpower.com/services/">Services</a>
<!--<ul id='nav_services_menu' class='main_menu'>
<li><a href='#' title=''>Pre-launch</a></li>
<li><a href='#' title=''>Software Modifications</a></li>
<li><a href='#' title=''>Single Sign On Integration</a></li>
<li><a href='#' title=''>Custom Licensing</a></li>
<li><a href='#' title=''>Enterprise Hosting</a></li>
</ul>
<script type='text/javascript'>
ips.menus['services'] = new ips.menu( $('nav_services'), $('nav_services_menu') );
</script>-->
</li>
<li id="nav_support">

<a href="#">Support</a>
<ul class="main_menu" id="nav_support_menu" style="display: none;">
<li><a title="Go to the client area" href="http://www.invisionpower.com/customer/">Client Area</a></li>
<li><a title="Go to the resource site" href="http://community.invisionpower.com/resources/index.html">Documentation</a></li>
<li><a title="Go to the resource site" href="http://community.invisionpower.com/resources/index.html">Client Resources</a></li>
<li><a title="Our community support forums" href="http://community.invisionpower.com">IPS Community</a></li>

<li><a title="Go to the FAQs" href="http://www.invisionpower.com/company/faq.php">FAQs</a></li>
<li><a title="" href="http://www.invisionpower.com/hosting/status.php">Network Status</a></li>
</ul>
<script type="text/javascript">
ips.menus['support'] = new ips.menu( $('nav_support'), $('nav_support_menu') );
</script>
</li>
<li id="nav_clientarea">
<a title="Go to the client area" href="http://www.invisionpower.com/customer/">Client Area</a>

</li>
<li id="nav_contact"><a title="Get in touch" href="http://www.invisionpower.com/company/contact.php">Contact Us »</a></li>

</ul>

</div>

<!-- END MAST NAV --> [/php]

3) Następnie przejdź na kartę CSS -> [b]header_bar.css[/b] i wklej następujący kod:

[php]#masthead {
background:repeat scroll 0 0 #2F2F2F;
color:#FFFFFF;
height:35px;
}
#ips_main_branding {
display:block;
float:right;
margin-left:10px;
margin-top:8px;
}
#primary_navigation {
float:right;
margin-right:15px;
margin-top:3px;
position:relative;
z-index:10000;
}
#primary_navigation li {
float:left;
font-family:helvetica,arial,tahoma,sans-serif;
font-size:14px;
margin-right:22px;
text-shadow:1px 1px 2px #0A1A2B;
}
#primary_navigation li:last-child {
margin-right:0;
}
#primary_navigation li {
float:left;
font-size:14px;
margin-right:15px;
}
#primary_navigation > li > a {
color:#FFFFFF;
display:block;
padding:7px 8px;
text-decoration:none;
}
#primary_navigation li a:hover, #primary_navigation li.active > a {
-moz-border-radius:4px 4px 4px 4px;
background:none repeat scroll 0 0 #0D1B2A;
color:#26D0CC;
}
#primary_navigation .main_menu {
-moz-border-radius:4px 4px 4px 4px;
background:none repeat scroll 0 0 #0D1B2A;
display:block;
margin-top:-5px;
min-width:150px;
padding:10px 5px 5px;
z-index:50000;
}
#primary_navigation .main_menu li {
display:block;
float:none;
font-size:12px;
padding:4px 6px;
}
#primary_navigation .main_menu li a {
color:#FFFFFF;
display:block;
padding:4px;
text-decoration:none;
text-shadow:none;
}
#primary_navigation .main_menu li a:hover {
color:#26D0CC;
}

ips.mastnav.rar

Udostępnij ten post


Link to postu
Udostępnij na innych stronach

Bądź aktywny! Zaloguj się lub utwórz konto

Tylko zarejestrowani użytkownicy mogą komentować zawartość tej strony

Utwórz konto

Zarejestruj nowe konto, to proste!

Zarejestruj nowe konto

Zaloguj się

Posiadasz własne konto? Użyj go!

Zaloguj się
Zaloguj się, aby obserwować  

  • Kto przegląda   0 użytkowników

    Brak zalogowanych użytkowników przeglądających tę stronę.

×

Ważne informacje

W celu świadczenie usług przez nasz Serwis na najwyższym poziomie, w ramach Serwisu wykorzystujemy pliki Cookies (tzw. ciasteczka). Korzystając ze stron Serwisu IPSBEYOND.PL bez zmiany ustawień przeglądarki będą one zapisane w pamięci urządzenia. Jeżeli nie dokonacie Państwo zmiany ustawień przeglądarki internetowej to wyrażacie zgodę na zapisywanie plików Cookies.