Webboard

Pełna wersja: Dodanie kategorii z pustym "ciałem"
Aktualnie przeglądasz uproszczoną wersję forum. Kliknij tutaj, by zobaczyć wersję z pełnym formatowaniem.
wersja skryptu MyBB:1.6.10
adres forum:forum-haxball.pl
na czym polega problem (screen, opis, komunikaty, nazwa stylu/theme/szablonu):

Chciałbym dodać nową kategorię, z pustym ciałem. Potrzebuję kodu html do stworzenia własnej kategorii z pustym wnętrzem:
[Obrazek: dsy.png]
Oczywiście głównym wyznacznikiem jest możliwość dodania własnej treści tytułu oraz możliwość zwijania panelu przez użytkownika.
Tego też szukałem, więc like leci, ale opisze dokładniej swój problem.

Tak wygląda mój szablon index:

Kod:
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>

<html>
<head>
<title>{$mybb->settings['bbname']}</title>

{$headerinclude}
<script type="text/javascript">
<!--
    lang.no_new_posts = "{$lang->no_new_posts}";
    lang.click_mark_read = "{$lang->click_mark_read}";
// -->
</script>
</head>
<body>

<script type="text/javascript">
//<[!CDATA[
  jQuery.noConflict();
  
  jQuery(document).ready(function() {    
          
   jQuery("#facebook2_2").hover(function(){    
    jQuery(this).stop(true,false).animate({right: "0px"}, 500 );  
   },
   function(){
    jQuery("#facebook2_2").stop(true,false).animate({right: "-304px"}, 500 );    
   });
  });  
//]]>
</script>

{$header}
{$ps_header_index}
<br/>
{$forums}
{$ps_footer_index}
{$Shoutbox}
{myshoutbox_abcd}
{$boardstats}

{$footer}

<!--WIDGET FACEBOOK-->
<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/pl_PL/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<div id="facebook2_2" style="right: -304px; z-index: 9999; background: #ffffff; padding: 0px; width: 300px; height:450px; position: fixed; top: 180px; border: 2px solid #3B95D8">
  <a href="#"></a><img style="position: absolute; left:-33px;" src="facebook.png" />  
  <div class="fb-like-box" data-href="https://www.facebook.com/forumhaxballa?fref=ts" data-width="300" data-height="450" data-show-faces="true" data-stream="false" data-header="false"></div>
</div>
<!--KONIEC WIDGET FACEBOOK-->

</body>
</html>

W tym miejscu (nad shoutboxem) chciałbym dodać kod html zwijanego panelu:

Kod:
....
{$forums}
{$ps_footer_index}

>>>TUTAJ CHCIAŁBYM DODAĆ KOD HTML WŁASNEGO PANELU<<<

{$Shoutbox}
{myshoutbox_abcd}
{$boardstats}
....

Graficznie wygląda to tak:

[Obrazek: lsy.png]

A chcę żeby wyglądało tak:

[Obrazek: msy.png]

Potrzebuję tylko kodu html takiego panelu, który będzie się zwijał i rozwijał po naciśnięciu tej zielonej strzałki w prawym górnym rogu panelu.
Dodaj tam taki kod:

Kod:
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder">
<thead>
<tr>
<td class="thead" colspan="5">
<div class="expcolimage"><img src="{$theme['imgdir']}/{$expcolimage}" id="cat_{$forum['fid']}_img" class="expander" alt="{$expaltext}" title="{$expaltext}" /></div>
<div><strong>Nazwa belki</strong><br /><div class="smalltext">{$forum['description']}</div></div>
</td>
</tr>
</thead>
<tbody style="{$expdisplay}" id="cat_{$forum['fid']}_e">
<tr>
<td class="tcat" colspan="2">
Tutaj treść
</td>
</tr>
</tbody>
</table>
<br />
Problem uważam za rozwiązany, ale jeszcze mam szybkie pytanie. Dodałem 2 takie panele tym samym kodem, i po naciśnięciu strzałki jeden zwija się poprawnie, zaś w drugim po naciśnięciu jej zwija się ten poprzedni. Powiesz jeszcze która linijkę edytować, aby każdy panel był zwijany swoją strzałką i w jaki sposób to edytować?
Zmień:

Kod:
<img src="{$theme['imgdir']}/{$expcolimage}" id="cat_{$forum['fid']}_img" class="expander" alt="{$expaltext}" title="{$expaltext}" />

Na:

Kod:
<img src="{$theme['imgdir']}/{$expcolimage}" id="cat_100_img" class="expander" alt="{$expaltext}" title="{$expaltext}" />

W drugiej tabelce to samo, tylko kolejny numerek(np 101). Oczywiście możesz je nazwać jak chcesz. Ważne by miały id.
Kod będzie nadal błędny gdy tabelka będzie na tej samej stronie co kategoria o id 100. Wiem, taka liczba jest prawie niemożliwa, ale po co w ogóle dawać panelowi id kategorii? Lepiej zmienić cały <img> na:
Kod:
<img src="{$theme['imgdir']}/collapse.gif" id="moj_panel_img" class="expander" alt="[-]" title="[-]" />
oraz otwierający tag tbody na:
Kod:
<tbody style="{$collapsed['moj_panel_e']}" id="moj_panel_e">
Podałem tylko przykład.