Webboard

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.

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.

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>

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ę?

(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.

Nina

Adrian

Nina

virus4

Nina

virus4