Isto é uma pré-visualização de um tema em Hitskin.com
Instalar o tema • Voltar para a ficha do tema
Grupos com design diferente
3 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre códigos Javascript e jQuery
Página 1 de 1
Grupos com design diferente
Detalhes da questão
Endereço do fórum: http://cjrpg.forumeiros.com
Versão do fórum: PhpBB3
Descrição
Ola!!! Alguém saberia como deixar os grupos do fórum parecidos com a imagem?
Grato!!!
Re: Grupos com design diferente
Olá como vai?
Adicione os seguintes códigos
Painel de Controle Visualização Imagens e Cores Cores, na aba Folha de estilo CSS
Depois painel de Controle Visualização Templates index_body
Salve e publique.
Painel de Controle Módulos Html & JavaScript Gestão dos códigos JavaScript, crie um novo JavaScript com investimento no índice
Ficará assim http://prntscr.com/ee6ock
Está com o fundo branco... me informe as cores que deseja (dos grupos, do fundo dos grupos e do fundo da estatísticas) para que eu possa fazer a personalização.
Até mais
Adicione os seguintes códigos
Painel de Controle Visualização Imagens e Cores Cores, na aba Folha de estilo CSS
- Código:
@font-face {
font-family: 'Unica One';
font-style: normal;
font-weight: 400;
src: local('Unica One'), local('UnicaOne-Regular'), url(http://fonts.gstatic.com/s/unicaone/v4/z3VYemEbD7zsQFQLG6g3Sj8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}
/* Estadisticas del Foro*/
#es-cuerpo {
background: #fafafa;
border: 3px double #65737A;
padding: 10px;
}
#es-rec, #es-leye {
background: #fff;
width: 415px;
height: 150px;
overflow: auto;
display: inline-block;
padding: 10px;
}
#es-tit, #leye-tit {
width: 425px;
padding: 5px;
background: #65737A;
margin-top: -10px;
margin-left: -10px;
line-height: 20px;
font-size: 12px;
letter-spacing: 2px;
color: #F3F2ED;
font-family: 'Unica One';
text-transform: uppercase;
text-align: center;
text-decoration: none;
font-weight: lighter;
}
#es-leye {
width: 852px;
height: auto;
margin-left: 2px;
margin-top: 3px;
}
#leye-tit {
width: 862px;
margin-bottom: 10px;
}
#es-recp {
width: 429px;
padding: 3px;
background: #BDB78C;
margin-left: -10px;
line-height: 15px;
font-size: 7px;
font-family: 'verdana';
color: #fff;
letter-spacing: 1px;
text-transform: uppercase;
text-align: center;
text-decoration: none;
font-weight: lighter;
}
#page-body p.page-bottom {
width: 285px;
padding: 5px 2px;
background: #fff;
margin-left: 2px;
line-height: 15px;
font-size: 8px;
font-family: 'verdana';
letter-spacing: 1px;
text-transform: uppercase;
text-align: center;
text-decoration: none;
font-weight: lighter;
display: inline-block;
}
#ley1, #ley2, #ley3, #ley4, #ley5, #ley6, #ley7, #ley8, #ley9, #ley10, #ley11, #ley12, #ley13, #ley14, #ley15, #ley16, #ley17, #ley18 {
width: 142px;
margin: 1px;
padding: 8px;
line-height: 10px;
font-size: 8px;
font-family: 'Verdana';
color: #000;
letter-spacing: 1px;
text-transform: uppercase;
text-align: center;
display: inline-block;
}
#ley1 { border: 3px double #A38034; }
#ley2 {border: 3px double #51AC74; }
#ley3 {border: 3px double #4E7A9F; }
#ley4 {border: 3px double #DCB34E; }
#ley5 {border: 3px double #AF6C77; }
#ley6 {border: 3px double #333333; }
#ley7 {border: 3px double #333333; }
#ley8 {border: 3px double #333333; }
#ley9 {border: 3px double #333333; }
#ley10 {border: 3px double #333333; }
#ley11 {border: 3px double #333333; }
#ley12 {border: 3px double #333333; }
#ley13 {border: 3px double #333333; }
#ley14 {border: 3px double #333333; }
#ley15 {border: 3px double #333333; }
#ley16 {border: 3px double #333333; }
#ley17 {border: 3px double #333333; }
#ley18 {border: 3px double #333333; }
#ley1 a {color: #A63C40; }
#ley2 a {color: #8F8C66; }
#ley3 a {color: #BDB86B; }
#ley4 a {color: #DCB34E; }
#ley5 a {color: #AF6C77; }
#ley6 a {color: #333333; }
#ley7 a {color: #333333; }
#ley8 a {color: #A63C40; }
#ley9 a {color: #A63C40; }
#ley10 a {color: #A63C40; }
#ley11 a {color: #A63C40; }
#ley12 a {color: #A63C40; }
#ley13 a {color: #A63C40; }
#ley14 a {color: #A63C40; }
#ley15 a {color: #A63C40; }
#ley16 a {color: #A63C40; }
#ley17 a {color: #A63C40; }
#ley18 a {color: #A63C40; }
Depois painel de Controle Visualização Templates index_body
- Código:
{JAVASCRIPT}
<!-- BEGIN switch_user_logged_in --><p class="right rightside">{LAST_VISIT_DATE}</p><!-- END switch_user_logged_in -->
<p>{CURRENT_TIME}</p>
<br class="clear" />
<!-- BEGIN switch_user_login_form_header -->
<div class="panel">
<div class="inner"><span class="corners-top"><span></span></span>
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
<div class="user_login_form center">
<label>{L_USERNAME} : <input class="post" type="text" size="10" name="username" /></label>
<label>{L_PASSWORD} : <input class="post" type="password" size="10" name="password" /></label>
<label>{L_AUTO_LOGIN} : <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label>
{S_HIDDEN_FIELDS}<input class="mainoption button1" type="submit" name="login" value="{L_LOGIN}" />
<!-- BEGIN switch_fb_connect -->
<span class="fb_or">{switch_user_login_form_header.switch_fb_connect.L_OR}</span>
<fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" scope="{switch_user_login_form_footer.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_footer.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button>
<!-- END switch_fb_connect -->
</div>
</form>
<span class="corners-bottom"><span></span></span></div>
</div>
<!-- END switch_user_login_form_header -->
<!-- BEGIN message_admin_index -->
<div class="panel introduction">
<div class="inner"><span class="corners-top"><span></span></span>
<!-- BEGIN message_admin_titre -->
<div class="h3">{message_admin_index.message_admin_titre.MES_TITRE}</div>
<!-- END message_admin_titre -->
<!-- BEGIN message_admin_txt -->
<div class="mes-txt">{message_admin_index.message_admin_txt.MES_TXT}</div>
<!-- END message_admin_txt -->
<span class="corners-bottom"><span></span></span></div>
</div>
<!-- END message_admin_index -->
{CHATBOX_TOP}
{BOARD_INDEX}
<!-- BEGIN disable_viewonline -->
<div id="es-cuerpo">
<table><tr>
<td><div id="es-rec"><div id="es-tit">Conectados</div>
<div id="es-recp">{TOTAL_USERS_ONLINE}</div>
{LOGGED_IN_USER_LIST}
</div></td>
<td><div id="es-rec"><div id="es-tit">Últimos Conectados</div>
<div id="es-recp">{RECORD_USERS}</div><br />
{L_ONLINE_USERS} {L_CONNECTED_MEMBERS}<br />
{L_WHOSBIRTHDAY_TODAY}{L_WHOSBIRTHDAY_WEEK}
</div></td></tr></table>
<div id="es-esta">
<p class="page-bottom">{TOTAL_POSTS}</p>
<p class="page-bottom">{TOTAL_USERS}</p>
<p class="page-bottom">{NEWEST_USER}</p>
</div>
<div id="es-leye"><div id="leye-tit">Grupos</div>
<div id="ley1"><a href="link">Administradores</a></div>
<div id="ley2"><a href="link">Ex-Staff</a></div>
<div id="ley3"><a href="link">Deuses</a></div>
<div id="ley4"><a href="link">Campistas com Restrição</a></div>
<div id="ley5"><a href="link">Exército Titânico</a></div>
<div id="ley6"><a href="link">Espíritos da Natureza</a></div>
<div id="ley7"><a href="link">Aprendizes de Circe</a></div>
<div id="ley8"><a href="link">Pretores</a></div>
<div id="ley9"><a href="link">Áugure</a></div>
<div id="ley10"><a href="link">Centuriões</a></div>
<div id="ley11"><a href="link">I Coorte</a></div>
<div id="ley12"><a href="link">II Coorte</a></div>
<div id="ley13"><a href="link">III Coorte</a></div>
<div id="ley14"><a href="link">IV Coorte</a></div>
<div id="ley15"><a href="link">V Coorte</a></div>
<div id="ley16"><a href="link">Legados</a></div>
<div id="ley17"><a href="link">Amazonas</a></div>
<div id="ley18"><a herf="link">Probatio</a></div>
</div>
</div>
<div class="clear"></div>
<!-- BEGIN switch_chatbox_activate -->
<div class="h3"><a href="{S_JOIN_CHAT}" target="ChatBox">{CHATBOX_NAME}</a></div>
<div class="page-bottom">
{TOTAL_CHATTERS_ONLINE} :
{CHATTERS_LIST}<br />
</div>
<!-- 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 -->
<!-- END switch_chatbox_activate -->
<!-- END disable_viewonline -->
{CHATBOX_BOTTOM}
<!-- BEGIN switch_user_login_form_footer -->
<div class="panel">
<div class="inner"><span class="corners-top"><span></span></span>
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
<div class="user_login_form center">
<label>{L_USERNAME} : <input class="post" type="text" size="10" name="username" /></label>
<label>{L_PASSWORD} : <input class="post" type="password" size="10" name="password" /></label>
<label>{L_AUTO_LOGIN} : <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label>
{S_HIDDEN_FIELDS}<input class="mainoption button1" type="submit" name="login" value="{L_LOGIN}" />
<!-- BEGIN switch_fb_connect -->
<span class="fb_or">{switch_user_login_form_footer.switch_fb_connect.L_OR}</span>
<fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" scope="{switch_user_login_form_footer.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_footer.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button>
<!-- END switch_fb_connect -->
</div>
</form>
<span class="corners-bottom"><span></span></span></div>
</div>
<!-- END switch_user_login_form_footer -->
<br style="clear:both" />
<!-- BEGIN switch_legend -->
<ul id="picture_legend">
<li><img src="{FORUM_NEW_IMG}" alt="{L_NEW_POSTS}" />{L_NEW_POSTS}</li>
<li><img src="{FORUM_IMG}" alt="{L_NO_NEW_POSTS}" />{L_NO_NEW_POSTS}</li>
<li><img src="{FORUM_LOCKED_IMG}" alt="{L_FORUM_LOCKED}" />{L_FORUM_LOCKED}</li>
</ul>
<!-- END switch_legend -->
{AUTO_DST}
<!-- BEGIN switch_fb_index_login -->
<div id="fb-root"></div>
<script>
FB.init({
appId : {switch_fb_index_login.FACEBOOK_APP_ID},
cookie : true,
xfbml : true,
oauth : true,
version : 'v2.3'
});
(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/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<!-- END switch_fb_index_login -->
Salve e publique.
Painel de Controle Módulos Html & JavaScript Gestão dos códigos JavaScript, crie um novo JavaScript com investimento no índice
- Código:
$(function(){
$("div.h3 a[href='/statistics']").text("Estatísticas");
$("div#main-content p.page-bottom").each(function(){
$(this).html($(this).html()
.replace("Os nossos membros postaram um total de", "Contamos")
.replace("mensagens", "Mensagens.")
.replace("Temos", "Somos")
.replace("usuários registrados", "membros")
.replace("O último usuário registrado atende pelo nome de", "Boas-vindas: "));
});
});
Ficará assim http://prntscr.com/ee6ock
Está com o fundo branco... me informe as cores que deseja (dos grupos, do fundo dos grupos e do fundo da estatísticas) para que eu possa fazer a personalização.
Até mais
Re: Grupos com design diferente
Questão abandonada pelo autor, mas considerada resolvida por ter solução para o problema. Tópico marcado como Resolvido e movido para Questões resolvidas. |
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre códigos Javascript e jQuery
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos