Dodawanie linków paska menu (nawigacja)

Założony przez Nina.

Kilka szczegółów o moim forum i stylu, z którym mam problem:
nazwa stylu: PowerGreen
wersja skryptu MyBB: 1.4.8
adres forum: http://muzoforus.ugu.pl/index.php

Opis problemu:
Jak dodać jakiś link do menu? Tak jak jest "Muzo Forus" , "Szukaj" , "Użytkownicy" ...
Chciałabym dodać "MusicTube" oraz "Kontakt", co będzie przechodziło do wysłania wiadomości na mój e-mail.
TaniDedyk.pl
Szablony Twojego stylu > PowerGreen Templates > Header Templates (Nagłówek) > header:
Znajdź:
Kod:
<ul>
    <li><a href="{$mybb->settings['bburl']}/index.php">{$mybb->settings['bbname']}</a></li>
    <li><a href="{$mybb->settings['bburl']}/search.php">{$lang->toplinks_search}</a></li>
    <li><a href="{$mybb->settings['bburl']}/memberlist.php">{$lang->toplinks_memberlist}</a></li>
    <li><a href="{$mybb->settings['bburl']}/calendar.php">{$lang->toplinks_calendar}</a></li>
    <li><a href="{$mybb->settings['bburl']}/misc.php?action=help">{$lang->toplinks_help}</a></li>
</ul>
i dodaj własne linki. ;)
Podziękowali: Nina
A jak można zastąpić menu obrazkami? Choćby pierwsza lepsza strona:
http://s2o.tv/homepage.aspx lub http://pandanda.eu/.
Chciałabyś aby obok napisu np. Szukaj był jeszcze obrazek tak jak na mybboard.pl czy żeby zamiast napisu Szukaj był tylko obrazek?

Dam kod do obydwu opcji:

1.
Kod:
<ul>
                    <li><a href="{$mybb->settings['bburl']}/search.php"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/toplinks/search.gif" alt="" title="" />{$lang->toplinks_search}</a></li>
                    <li><a href="{$mybb->settings['bburl']}/memberlist.php"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/toplinks/memberlist.gif" alt="" title="" />{$lang->toplinks_memberlist}</a></li>
                    <li><a href="{$mybb->settings['bburl']}/calendar.php"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/toplinks/calendar.gif" alt="" title="" />{$lang->toplinks_calendar}</a></li>
                    <li><a href="{$mybb->settings['bburl']}/misc.php?action=help"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/toplinks/help.gif" alt="" title="" />{$lang->toplinks_help}</a></li>
                </ul>
2.
Kod:
<ul>
                    <li><a href="{$mybb->settings['bburl']}/search.php"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/toplinks/search.gif" alt="" title="" /></a></li>
                    <li><a href="{$mybb->settings['bburl']}/memberlist.php"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/toplinks/memberlist.gif" alt="" title="" /></a></li>
                    <li><a href="{$mybb->settings['bburl']}/calendar.php"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/toplinks/calendar.gif" alt="" title="" /></a></li>
                    <li><a href="{$mybb->settings['bburl']}/misc.php?action=help"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/toplinks/help.gif" alt="" title="" /></a></li>
                </ul>

Widzisz różnicę?
Podziękowali: Nina
(20.09.2009, 13:10)virus4 napisał(a): Chciałabyś aby obok napisu np. Szukaj był jeszcze obrazek tak jak na mybboard.pl czy żeby zamiast napisu Szukaj był tylko obrazek?

Dam kod do obydwu opcji:

1.
Kod:
<ul>
                    <li><a href="{$mybb->settings['bburl']}/search.php"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/toplinks/search.gif" alt="" title="" />{$lang->toplinks_search}</a></li>
                    <li><a href="{$mybb->settings['bburl']}/memberlist.php"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/toplinks/memberlist.gif" alt="" title="" />{$lang->toplinks_memberlist}</a></li>
                    <li><a href="{$mybb->settings['bburl']}/calendar.php"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/toplinks/calendar.gif" alt="" title="" />{$lang->toplinks_calendar}</a></li>
                    <li><a href="{$mybb->settings['bburl']}/misc.php?action=help"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/toplinks/help.gif" alt="" title="" />{$lang->toplinks_help}</a></li>
                </ul>
2.
Kod:
<ul>
                    <li><a href="{$mybb->settings['bburl']}/search.php"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/toplinks/search.gif" alt="" title="" /></a></li>
                    <li><a href="{$mybb->settings['bburl']}/memberlist.php"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/toplinks/memberlist.gif" alt="" title="" /></a></li>
                    <li><a href="{$mybb->settings['bburl']}/calendar.php"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/toplinks/calendar.gif" alt="" title="" /></a></li>
                    <li><a href="{$mybb->settings['bburl']}/misc.php?action=help"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/toplinks/help.gif" alt="" title="" /></a></li>
                </ul>

Widzisz różnicę?
U mnie jest trochę inaczej:
Kod:
<div align="center"><div style="width:950px; height:199px;">
<table id="Table_01" width="950" height="200" border="0" cellpadding="0" cellspacing="0">

    <tr>
        <td>
            <img src="images/harmony/images/harm_header_01.gif" width="87" height="73" alt=""></td>
        <td>
            <a onmouseover="var img=document['fpAnimswapImgFP1'];img.imgRolln=img.src;img.src=img.lowsrc?img.lowsrc:img.getAttribute?img.getAttribute('lowsrc'):img.src;" onmouseout="document['fpAnimswapImgFP1'].src=document['fpAnimswapImgFP1'].imgRolln" href="javascript:void(0)">
            <a href="http://muzoforus.ugu.pl/portal.php"><img border="0" src="images/harmony/images/1.gif" width="131" height="73" id="fpAnimswapImgFP1" name="fpAnimswapImgFP1" dynamicanimation="fpAnimswapImgFP1" lowsrc="images/harmony/images/1-.gif"></a></a></td>
        <td>
            <a onmouseover="var img=document['fpAnimswapImgFP2'];img.imgRolln=img.src;img.src=img.lowsrc?img.lowsrc:img.getAttribute?img.getAttribute('lowsrc'):img.src;" onmouseout="document['fpAnimswapImgFP2'].src=document['fpAnimswapImgFP2'].imgRolln" href="javascript:void(0)">
            <a href="http://muzoforus.ugu.pl/index.php"><img border="0" src="images/harmony/images/2.gif" width="129" height="73" id="fpAnimswapImgFP2" name="fpAnimswapImgFP2" dynamicanimation="fpAnimswapImgFP2" lowsrc="images/harmony/images/2-.gif"></a></a></td>

        <td>
            <a onmouseover="var img=document['fpAnimswapImgFP3'];img.imgRolln=img.src;img.src=img.lowsrc?img.lowsrc:img.getAttribute?img.getAttribute('lowsrc'):img.src;" onmouseout="document['fpAnimswapImgFP3'].src=document['fpAnimswapImgFP3'].imgRolln" href="javascript:void(0)">
            <a href="http://muzoforus.ugu.pl/misc.php?action=help"><img border="0" src="images/harmony/images/3.gif" width="129" height="73" id="fpAnimswapImgFP3" name="fpAnimswapImgFP3" dynamicanimation="fpAnimswapImgFP3" lowsrc="images/harmony/images/3-.gif"></a></a></td>
        <td>
            <a onmouseover="var img=document['fpAnimswapImgFP4'];img.imgRolln=img.src;img.src=img.lowsrc?img.lowsrc:img.getAttribute?img.getAttribute('lowsrc'):img.src;" onmouseout="document['fpAnimswapImgFP4'].src=document['fpAnimswapImgFP4'].imgRolln" href="javascript:void(0)">
            <a href="http://muzoforus.ugu.pl/vgallery.php"><img border="0" src="images/harmony/images/4.gif" width="130" height="73" id="fpAnimswapImgFP4" name="fpAnimswapImgFP4" dynamicanimation="fpAnimswapImgFP4" lowsrc="images/harmony/images/4-.gif"></a></a></td>
        <td>
            <a onmouseover="var img=document['fpAnimswapImgFP5'];img.imgRolln=img.src;img.src=img.lowsrc?img.lowsrc:img.getAttribute?img.getAttribute('lowsrc'):img.src;" onmouseout="document['fpAnimswapImgFP5'].src=document['fpAnimswapImgFP5'].imgRolln" href="javascript:void(0)">
            <a href="http://muzoforus.ugu.pl/memberlist.php"><img border="0" src="images/harmony/images/5.gif" width="129" height="73" id="fpAnimswapImgFP5" name="fpAnimswapImgFP5" dynamicanimation="fpAnimswapImgFP5" lowsrc="images/harmony/images/5-.gif"></a></a></td>

        <td>
            <a onmouseover="var img=document['fpAnimswapImgFP6'];img.imgRolln=img.src;img.src=img.lowsrc?img.lowsrc:img.getAttribute?img.getAttribute('lowsrc'):img.src;" onmouseout="document['fpAnimswapImgFP6'].src=document['fpAnimswapImgFP6'].imgRolln" href="javascript:void(0)">
            <a href="http://muzoforus.ugu.pl/search.php"><img border="0" src="images/harmony/images/6.gif" width="129" height="73" id="fpAnimswapImgFP6" name="fpAnimswapImgFP6" dynamicanimation="fpAnimswapImgFP6" lowsrc="images/harmony/images/6-.gif"></a></a></td>
        <td>
            <img src="images/harmony/images/harm_header_08.gif" width="86" height="73" alt=""></td>
    </tr>
    <tr>
        <td colspan="8">
            <img src="images/harmony/images/harm_header_09.gif" width="950" height="1" alt=""></td>

    </tr>
    <tr>
        <td colspan="4">
            <img src="images/harmony/images/harm_header_10.png" width="476" height="107" alt=""></td>
        <td colspan="4">
            <img src="images/harmony/images/harm_header_11.gif" width="474" height="107" alt=""></td>
    </tr>
    <tr>
        <td colspan="8">

            <img src="images/harmony/images/harm_header_12.gif" width="950" height="19" alt=""></td>
    </tr>
</table>
</div>
<!-- /logo -->

<div id="container">
        <div id="content">
        <a name="top" id="top"></a>
        <div id="header">
<div id="topbar">
<div class="colorchooser"> <span>Zmień kolor na: </span>
<a href="javascript:ChennaigsmStyle('none')" style="background-color:blue; border-color:#ffffff;"></a>
<a href="javascript:ChennaigsmStyle('black-theme')" style="background-color:#000000; border-color:#ffffff;"></a>
<a href="javascript:ChennaigsmStyle('orange-theme')" style="background-color:orange; border-color:#ffffff;"></a>
<a href="javascript:ChennaigsmStyle('green-theme')" style="background-color:green; border-color:#ffffff;"></a>
</div>
</div>
            <div id="panel">
                {$welcomeblock}
            </div>
        </div>
        <hr class="hidden" />
        <br class="clear" />

            {$pm_notice}
            {$bannedwarning}
            {$bbclosedwarning}
            {$unreadreports}
            <br />
Jak mam to zrobić? Na próbę, chcę zamienić napis "Muzo Forus" na ten obrazek:
[Obrazek: muzoforus2.png]
ścieżka ma wyglądać tak:
images/harmony/menu/muzoforus.png
Po najechaniu myszką:
[Obrazek: muzoforus.png]
ścieżka:
images/harmony/menu/muzoforus2.png
Jeżeli dobrze się orientuje, to js wyglądałby tak:
Kod:
<a onmouseover="var img=document['fpAnimswapImgFP1'];img.imgRolln=img.src;img.src=img.lowsrc?img.lowsrc:img.getAttribute?img.getAttribute('lowsrc'):img.src;" onmouseout="document['fpAnimswapImgFP1'].src=document['fpAnimswapImgFP1'].imgRolln" href="javascript:void(0)">
            <a href="http://muzoforus.ugu.pl/index.php"><img border="0" src="images/harmony/menu/muzoforus.png" width="131" height="73" id="fpAnimswapImgFP1" name="fpAnimswapImgFP1" dynamicanimation="fpAnimswapImgFP1" lowsrc="images/harmony/menu/muzoforus2.png"></a></a></td>

Jutro dam jeszcze inne buttony na menu, to czy ktoś mógłby mi to poukładać? Mój numer GG, to 4823654.
Jeżeli chcesz aby po najechaniu myszką obrazek zmienił się na inny w CSS musisz użyć efektu rollover.

Nie wiem po co Ci tam JS jak można to dużo łatwiej zrobić za pomocą CSS.

Podobne wątki

Inne Jak dodać nową ikonkę do paska nawigacji w stylu

14.05.2017, 20:16
Ostatni post: Conors

Błąd  Nie wyświetlanie się zdjęć / linków

31.03.2017, 22:45
Ostatni post: Winchester

Styl Edycja paska header

29.01.2017, 22:13
Ostatni post: Ardex

Inne Edycia linków do profili itp

29.12.2016, 23:10
Ostatni post: Fyeem

Szukam dodanie linków do obrazków w forach i subforach

07.12.2016, 17:56
Ostatni post: Binary24


Użytkownicy przeglądający ten wątek:

1 gości