Scris de Omu la data de Joi 24 Ian - 21:29
| Inserare autor inainte de mesaje + avatarul si data postarii | |
Urmând cu atenție pașii acestui tutorial puteți adăuga înaintea mesajelor postate intr-un subiect, un chenar ce cuprinde avatarul celui ce a deschis subiectul, data deschiderii și titlul subiectului.
Tutorialul functioneaza pentru toate versiunile deci pentru a-l aplica la versiunea dumneavoastra nu trebuie decit sa urmati pasii indicati mai jos:
=> Pasii pentru versiunea phpBB3 - click aici;
=> Pasii pentru versiunea phpBB2 - click aici;
=> Pasii pentru versiunea PunBB - click aici;
=> Pasii pentru versiunea Invision - click aici.
Versiunea phpBB3 - demonstratie
1. Codurile Javascript
Mergeti in:
Panou de Administrare => Module => Gestiunea codurilor javascript =>  |
La amplasare, bifati: Topicuri
- Cod:
jQuery(document).ready(function(){
$('.page-title').after('<div class="casuta_titlu"></div>');
$('#main-content .page-title:first').removeClass('page-title').addClass('tip_titlu');
$('.postprofile dl dt a:first').clone().prependTo('.casuta_titlu');
$('.casuta_titlu a img').addClass('left');
$('.tip_titlu').appendTo('.casuta_titlu');
$('.casuta_titlu').append('<div class="chenar_postator"></div>');
$('.author:first').clone().appendTo('.chenar_postator');
});
$(document).ready(function(){
var x=$('.chenar_postator .author')[0];
if(x){x.innerHTML=x.innerHTML.replace(/Scris de/,'Deschis de');}
});
$(document).ready(function(){
var x=$('.chenar_postator .author')[0];
if(x){x.innerHTML=x.innerHTML.replace(/la data de/,' - ');}
});
2. Personalizarea cu ajutorul foii de stil CSS
Mergeti in:
| Panou de Administrare => Afisare => Culori => Foaie de stil CSS |
Inserați conținutul chenarului următor:
- Cod:
.casuta_titlu {
border: 1px solid #CADCEB;
background: #E1EBF2;
border-radius: 6px;
padding: 3px;}
.casuta_titlu a img {
padding-right: 7px;
max-width: 45px;
max-height: 45px;}
Versiunea phpBB2 - demonstratie
1. Codurile Javascript
Mergeti in:
| Panou de Administrare => Module => Gestiunea codurilor javascript => |
La amplasare, bifati: Topicuri
- Cod:
jQuery(document).ready(function(){
$('table:has("td.nav")').after('<div class="casuta_titlu"></div>');
$('#page-body .cattitle:first').removeClass('cattitle').addClass('tip_titlu');
$('.postdetails.poster-profile a:first').has('img').clone().prependTo('.casuta_titlu');
$('.casuta_titlu a img').addClass('left');
$('.tip_titlu').appendTo('.casuta_titlu');
$('.casuta_titlu').append('<div class="chenar_postator"></div>');
$('.data-postarii:first').clone().insertAfter($('.tip_titlu'));
$('.name:first').clone().insertAfter('.casuta_titlu .sprite-icon_miniposted');
$('.casuta_titlu .sprite-icon_miniposted').after(' Deschis de ');
$('.casuta_titlu .name').after(' la date de ');
});
2. Personalizarea cu ajutorul foii de stil CSS
Mergeti in:
| Panou de Administrare => Afisare => Culori => Foaie de stil CSS |
Inserați conținutul chenarului următor:
- Cod:
.casuta_titlu {
border: 1px solid #069;
background: #EFEFEF;
padding: 3px;
padding-bottom: 8px;
margin-bottom: 5px;}
.casuta_titlu a img {
padding-right: 7px;
max-width: 45px;
max-height: 45px;}
.data-postarii { display: inline-block !important;}
.casuta_titlu .data-postarii { font-size:10px !important;}
3. Modificarea template-urilor
Mergeti in:
| Panou de Administrare => Afisare => Template-uri => General => viewtopic_body |
Găsiți acest fragment de cod:
- Cod:
<img src="{postrow.displayed.MINI_TIME_IMG}" alt="" border="0" />{postrow.displayed.POST_DATE}
și înlocuiți-l cu:
- Cod:
<div class="data-postarii"><img src="{postrow.displayed.MINI_TIME_IMG}" alt="" border="0" />{postrow.displayed.POST_DATE}</div>
Salvați și publicați template-ul. 
Versiunea PunBB - demonstratie
1. Codurile Javascript
Mergeti in:
| Panou de Administrare => Module => Gestiunea codurilor javascript => |
La amplasare, bifati: Topicuri
- Cod:
jQuery(document).ready(function(){
$('#main-content .pun-crumbs.noprint').after('<div class="casuta_titlu"></div>');
$('.posthead a:first').addClass('tip_titlu');
$('.user-ident .user-basic-info a:first').clone().prependTo('.casuta_titlu');
$('.casuta_titlu a img').addClass('left');
$('.tip_titlu').clone().appendTo('.casuta_titlu');
$('.casuta_titlu').append('<div class="chenar_postator"></div>');
$('.data-postarii:first').clone().appendTo('.chenar_postator');
$('.chenar_postator .data-postarii').prepend('<img class="icon-postare" src="http://illiweb.com/fa/prosilver_grey/icon_participate.gif">');
$('.chenar_postator .icon-postare').after(' <dfn style="font-style:normal; display: inline-block;">Deschis de</dfn> ');
$('.user-ident .username:first').clone().appendTo('.chenar_postator').insertAfter('.chenar_postator dfn').css('display','inline-block').css('margin-left','3px');
});
2. Personalizarea cu ajutorul foii de stil CSS
Mergeti in:
| Panou de Administrare => Afisare => Culori => Foaie de stil CSS |
Inserați conținutul chenarului următor:
- Cod:
.casuta_titlu {
border: 1px solid #069;
background: #EFEFEF;
padding: 3px;
padding-bottom: 18px;
margin-bottom: 5px;}
.casuta_titlu a img {
padding-right: 7px;
max-width: 45px;
max-height: 45px;}
.data postarii h4.username, .data postarii dfn, .data-postarii{
display: inline-block !important;
}
.casuta_titlu .data-postarii{
font-size:10px !important;
}
3. Modificarea template-urilor
Mergeti in:
| Panou de Administrare => Afisare => Template-uri => General => viewtopic_body |
Găsiți acest fragment de cod:
- Cod:
{postrow.displayed.POST_DATE_NEW}
și înlocuiți-l cu:
- Cod:
<div class="data-postarii">{postrow.displayed.POST_DATE_NEW}</div>
Salvați și publicați template-ul.
Versiunea Invision - demonstratie
1. Codurile Javascript
Mergeti in:
| Panou de Administrare => Module => Gestiunea codurilor javascript => |
La amplasare, bifati: Topicuri
- Cod:
jQuery(document).ready(function(){
$('#main-content #navstrip').after('<div class="casuta_titlu"></div>');
$('.borderwrap .post-container .postbody-head h3:first').addClass('tip_titlu');
$('.postprofile dl dt a:first').clone().prependTo('.casuta_titlu');
$('.casuta_titlu a img').addClass('left');
$('.tip_titlu').appendTo('.casuta_titlu');
$('.casuta_titlu').append('<div class="chenar_postator"></div>');
$('.author:first').clone().appendTo('.chenar_postator');
});
$(document).ready(function(){
var x=$('.chenar_postator .author')[0];
if(x){x.innerHTML=x.innerHTML.replace(/Scris de/,'Deschis de');}
});
$(document).ready(function(){
var x=$('.chenar_postator .author')[0];
if(x){x.innerHTML=x.innerHTML.replace(/la data de/,' - ');}
});
2. Personalizarea cu ajutorul foii de stil CSS
Mergeti in:
| Panou de Administrare => Afisare => Culori => Foaie de stil CSS |
Inserați conținutul chenarului următor:
- Cod:
.casuta_titlu {
border: 1px solid #979BA0;
background: #E4E6E9;
padding: 10px;}
.casuta_titlu a img {
margin-top: -6px;
margin-left: -7px;
padding-right: 7px;
max-width: 45px;
max-height: 45px;}
|
Tutorial scris de Omu & SGSS
Copyright Forumgratuit.ro Nici o parte a acestui tutorial nu poate fi reprodusa, transmisa sau stocata in orice forma fara acordul scris al detinatorului dreptului de autor, in conformitate cu articolul L122-1 apartinand ICC. | |
Omu- Membru onorific
-
Mesaje : 6310
Varsta : 20
Data înscrierii : 04/11/2010
Multumiri : 153
-
Subiecte similare Subiecte similare
Permisiunile acestui forum:
Nu puteti raspunde la subiectele acestui forum
Inserare autor, avatar si data postarii inainte de mesaje
