Detalhes da questão

Endereço do fórum: https://tsyls.foroactivo.com/forum
Versão do fórum: PunBB

Descrição

Gostaria que o meu forum tivesse categorias semelhantes, nao necessariamente quero algo igual, mas que estivesse de maneira parecida, se faz util para a plataforma que preciso.

Minha index_body:

Código:

{JAVASCRIPT}
<!-- BEGIN switch_user_logged_in -->
<div id="pun-visit" class="clearfix">
  <ul>
        <li><a href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a></li>
        <li><a href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a></li>
      <li><a href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a></li>
      <li><a href="{U_MARK_READ}">{L_MARK_FORUMS_READ}</a></li>
  </ul>
  <p>{LOGGED_AS}. {LAST_VISIT_DATE}</p>
</div>
<!-- END switch_user_logged_in -->
<!-- BEGIN switch_user_logged_out -->
<div id="pun-visit">
  <p>{L_NOT_CONNECTED} {L_LOGIN_REGISTER}</p>
</div>
<!-- END switch_user_logged_out -->
 
<!-- BEGIN message_admin_index -->
<div class="main">
  <!-- BEGIN message_admin_titre -->
  <div class="main-head">
      <h1 class="page-title">{message_admin_index.message_admin_titre.MES_TITRE}</h1>
  </div>
  <!-- END message_admin_titre -->
 
  <!-- BEGIN message_admin_txt -->
  <div id="pun-announcement">
      <p>{message_admin_index.message_admin_txt.MES_TXT}</p>
  </div>
  <!-- END message_admin_txt -->
</div>
<!-- END message_admin_index -->
 
<!-- BEGIN switch_user_login_form_header -->
<div class="main">
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
  <div class="user_login_form main-box center">
      <label><span class="genmed">{L_USERNAME} :</span> <input class="post" type="text" size="10" name="username" /></label> &nbsp;
      <label><span class="genmed">{L_PASSWORD} :</span> <input class="post" type="password" size="10" name="password" /></label> &nbsp;
      <label><span class="gensmall">{L_AUTO_LOGIN}</span> <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label> &nbsp;
      {S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" />
 
        <!-- BEGIN switch_social_login -->
        <div class="mt10">
            <div class="social_btn">
                <!-- BEGIN fb_connect -->
                <div class="fb-login-button"></div>
                <!-- END fb_connect -->
                &nbsp;
            </div>
        </div>
        <!-- END switch_social_login -->
  </div>
</form>
</div>
<!-- END switch_user_login_form_header -->
 
{CHATBOX_TOP}
{BOARD_INDEX}
 
<!-- BEGIN disable_viewonline -->
<div id="pun-info" class="main">
  <div class="main-content">
      <div id="stats">
        <p class="right">{TOTAL_POSTS}</p>
        <p>{TOTAL_USERS}</p>
        <p>{NEWEST_USER}</p>
      </div>
      <div id="onlinelist">
        <img src="{L_ONLINE_IMG}" alt="{L_WHO_IS_ONLINE}" />
        <p class="right">
            <!-- BEGIN switch_viewonline_link -->
            <a href="{U_VIEWONLINE}" rel="nofollow">{L_WHO_IS_ONLINE}</a>
            <!-- END switch_viewonline_link -->
            <!-- BEGIN switch_viewonline_nolink -->
            {L_WHO_IS_ONLINE}
            <!-- END switch_viewonline_nolink -->
        </p>
        <p>{TOTAL_USERS_ONLINE}<br />
        {RECORD_USERS}
 
        <br />
        {LOGGED_IN_USER_LIST}
 
        {L_ONLINE_USERS}
        {L_CONNECTED_MEMBERS}<br />
        {L_WHOSBIRTHDAY_TODAY}{L_WHOSBIRTHDAY_WEEK}</p>
        <div class="clear"></div>
 
        <p>{LEGEND}&nbsp;:&nbsp;{GROUP_LEGEND}</p>
 
      </div>
      <!-- BEGIN switch_chatbox_activate -->
      <div id="onlinechat">
        <p class="page-bottom">
        {TOTAL_CHATTERS_ONLINE}&nbsp;:&nbsp;
        {CHATTERS_LIST}<br />
        <!-- BEGIN switch_chatbox_popup -->
            <div id="chatbox_popup"></div>
            <script type="text/javascript">
              insertChatBoxPopup('{disable_viewonline.switch_chatbox_activate.switch_chatbox_popup.U_FRAME_CHATBOX}', '{L_CLICK_TO_JOIN_CHAT}');
            </script>
        <!-- END switch_chatbox_popup -->
        </p>
      </div>
      <!-- END switch_chatbox_activate -->
  </div>
</div>
<!-- END disable_viewonline -->
 
<!-- BEGIN switch_user_login_form_footer -->
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
  <div class="user_login_form main-box center">
      <label><span class="genmed">{L_USERNAME} :</span> <input class="post" type="text" size="10" name="username"/></label> &nbsp;
      <label><span class="genmed">{L_PASSWORD} :</span> <input class="post" type="password" size="10" name="password"/></label> &nbsp;
      <label><span class="gensmall">{L_AUTO_LOGIN}</span> <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label> &nbsp;
      {S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" />
 
        <!-- BEGIN switch_social_login -->
        <div class="mt10">
            <div class="social_btn">
                <!-- BEGIN fb_connect -->
                <div class="fb-login-button"></div>
                <!-- END fb_connect -->
                &nbsp;
            </div>
        </div>
        <!-- END switch_social_login -->
  </div>
</form>
<!-- END switch_user_login_form_footer -->
 
{CHATBOX_BOTTOM}
 
<!-- BEGIN switch_legend -->
<ul id="pun-legend">
  <li>
      <img src="{FORUM_NEW_IMG}" alt="{L_NEW_POSTS}" />&nbsp;{L_NEW_POSTS}
      <img src="{FORUM_IMG}" alt="{L_NO_NEW_POSTS}" />&nbsp;{L_NO_NEW_POSTS}
      <img src="{FORUM_LOCKED_IMG}" alt="{L_FORUM_LOCKED}" />&nbsp;{L_FORUM_LOCKED}
  </li>
</ul>
<!-- END switch_legend -->
 
{AUTO_DST}

meu css:

Código:

.pun {
    line-height: 130%;
    margin:0;
    min-width: 1011px;
    padding: 0;
  margin-left: 16%;
    width: 50%;
  border: 1px #AAACAD solid;
  background-color: #000000;
}


#pun-logo img {
  width:100%;
  height:100%;
}

a{text-decoration:none!important;}
a:link{text-decoration:none!important;}
a:visited{text-decoration:none!important;}

#pun-head #pun-navlinks {
    background-color: #2ea3f2;
    line-height: 48px;
    padding: 0;
}
#pun-navlinks > ul {
    height: 48px;
    border-bottom: 3px #2ea3f2 solid;
    padding-left: 105px;
}
 
#pun-navlinks > ul > li {
    display: block;
    float: left;
    font-size: 0;
    height: 48px;
}
 
#pun-navlinks > ul > li > a {
    font-size: 12px;
  font-weight: bolder
    margin: 0;
    display: block;
    padding: 0 15px;
    color: #FFFFFF;
    height: 48px;
    transition-duration: 250ms;
    transition-property: color, background-color;
}
 
#pun-navlinks > ul > li > a:hover,
#pun-navlinks > ul > li > a:active,
#pun-navlinks > ul > li > a:focus {
    text-decoration: none;
    color: #fff;
    background-color: #2ea3f2;
}
 
#pun-navlinks > ul > li > a > img {
    display: none;
}


#pun-title {
    display: none;
}
p#pun-desc {
    display: none;
}
#pun-logo {
  display:block;
  padding: 0;
  margin: -13px;
  margin-top: -18px;
}
.main .main-head {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
}

thead {
  display: none;
}


Exemplos que gostaria:

https://imgur.com/VfhtUDN

Olá!

Preciso do link de onde viu isso e também que habilite a descrição dos seus 'fóruns' / categorias.

O fórum já nao existe... Gostaria que fosse algo semelhante! Da maneira que seja possível.

Olá,

Será necessário o seu template index_box

Até mais"

Vou fazer sem alterar o seu template. Acrescenta esse css:

Código:


.pun table .tcr span:last-child {
 position: absolute !important;
    left: 18.1% !important;
    z-index: 999 !important;
    margin-top: -2% !important;
    border-top: 5px solid #80808070 !important;
    border-bottom: 5px solid #80808070 !important;
    padding-top: 15px !important;
    padding-bottom: 15px !important;
    width: 22em !important;
 
}
.lastpost-avatar, .mod-text, .group-mod {
display: none;
 
}
.status img {
 width: 5em;
    height: 5em;
    left: -4em;
    top: 3em;
    position: relative;
}
.pun tbody.statused td.tcl {
padding-right: 0px !important;
    padding-left: 108px !important;
    height: 10em !important;
}

td.tc2, td.tc3 {
 font-weight: bold;
    border: none !important;
 font-size: 15px !important;
}
td.tcr {
    border: none !important;
 
}
td.tc2:after {
    position: relative !important;
    content: " Tópicos" !important;
    top: 2em !important;
    text-align: center !important;
 font-weight: normal !important;
 left: -2em !important;
 font-size: 12px !important;
}

td.tc3:after {
    position: relative !important;
    content: " Posts" !important;
    top: 2em !important;
    text-align: center !important;
 font-weight: normal !important;
 left: -2em !important;
 font-size: 12px!important;
}

a.forumtitle {
    text-transform: uppercase;
    margin-left: 11%;
    position: relative;
    top: 5%;
 
}

E adiciona uma descrição no fórum para que eu possa terminar a categoria.