[FMvi-Group] Tùy chỉnh giao diện bài viết và chữ ký - phpBB2 / punBB

by **baivong** 5/8/2011, 12:42 pm

Chức năng: Code giúp tạo cho bạn một menu quản lý bài viết và chữ ký, ứng dụng cho phiên bản phpBB2, punBB.
Người xem có thể tùy chỉnh giao diện bài viết bằng 3 menu lựa chọn. Các thao tác được lưu lại nên các lựa chọn của người dùng sẽ không bị mất khi chuyển trang.

Message:
- Auto: Tự động thu gọn các bài viết dài hơn 500px
- Custom: Thu gọn phần bài viết được đánh dấu bằng BBcode dấu ngắt dòng
  Code:
  [hr]
- None: Hiển thị toàn bộ bài viết
Signature:
- auto: Tự động thu gọn chữ ký dài hơn 300px
- hide: Ẩn toàn bộ chữ ký
- show: Hiển thị toàn bộ chữ ký
Background:
- black: Màu nền đen cho bài viết
- white: Màu nền trắng cho bài viết
- green: Màu nền lục cho bài viết

Thử nghiệm tại:

Code:: http://www.fmvi.tk/t147-th-nghim-thu-gn-bai-vit-ver-2#587

Hướng dẫn: ACP - Display - Templates - viewtopic_body:
Thêm vào đầu viewtopic_body đoạn code sau:

Code::  <form id="baivongfmvi" style="position: fixed; top: 10px; left: 10px; background: green; color: white; padding: 2px 5px;border-radius: 3px;font-size: 11px;font-family: Tahoma,Verdana,Arial,Helvetica,sans-serif;"><span style="padding-right:14px;">Message :</span><span style="padding-right:5px"><input type="radio" name="fruit" id="Auto" checked="checked" value="Auto"><label for="Auto">Auto</label></span><span style="padding-right:5px"><input type="radio" name="fruit" id="custom" value="custom"><label for="custom">Custom</label></span><span style="padding-right:5px"><input type="radio" name="fruit" id="none" value="none"><label for="none">None</label></span></form>  <form id="fmvibaivong" style="position: fixed; top: 30px; left: 10px; background: green; color: white; padding: 2px 5px;border-radius: 3px;font-size: 11px;font-family: Tahoma,Verdana,Arial,Helvetica,sans-serif;"><span style="padding-right:10px;">Signature :</span><span style="padding-right:5px"><input type="radio" name="fruit" id="auto" checked="checked" value="auto"><label for="auto">auto</label></span><span style="padding-right:21px"><input type="radio" name="fruit" id="hide" value="hide"><label for="hide">hide</label></span><span style="padding-right:6px"><input type="radio" name="fruit" id="show" value="show"><label for="show">show</label></span></form>  <form id="fmvigroup" style="position: fixed; top: 50px; left: 10px; background: green; color: white; padding: 2px 5px;border-radius: 3px;font-size: 11px;font-family: Tahoma,Verdana,Arial,Helvetica,sans-serif;"><span style="padding-right:0px;">Background :</span><span style="padding-right:3px"><input type="radio" name="fruit" id="black" checked="checked" value="black"><label for="black">black</label></span><span style="padding-right:15px"><input type="radio" name="fruit" id="white" value="white"><label for="white">white</label></span><span style="padding-right:3px"><input type="radio" name="fruit" id="green" value="green"><label for="green">green</label></span></form>  <div id="notecheckf" style="position: fixed; top: 75px; left: 10px; background: black; color: white;"></div> <script type="text/javascript">$(function(){if(my_getcookie('maunenbaiviet')=='0'){$("#fmvigroup input#black").attr("checked","checked")}else if(my_getcookie('maunenbaiviet')=='1'){$("#fmvigroup input#white").attr("checked","checked")}else if(my_getcookie('maunenbaiviet')=='2'){$("#fmvigroup input#green").attr("checked","checked")}if($("#fmvigroup input:checked").val()=="black"){$(".chedodocbai").parent().parent().parent().parent().parent().parent().css({'background':'#3A3A3A','color':'#C7C3C3'})}else if($("#fmvigroup input:checked").val()=="white"){$(".chedodocbai").parent().parent().parent().parent().parent().parent().css({'background':'#ebebeb','color':'#000000'})}else if($("#fmvigroup input:checked").val()=="green"){$(".chedodocbai").parent().parent().parent().parent().parent().parent().css({'background':'#144f16','color':'#FFFFFF'})}});$("#fmvigroup input").click(function(){if($("#fmvigroup input:checked").val()=="black"){my_setcookie('maunenbaiviet',0,1,0);$("#notecheckf").text("Kích hoạt chế độ nền màu xám");$("#notecheckf").show().fadeOut(1000);$(".chedodocbai").parent().parent().parent().parent().parent().parent().css({'background':'#3A3A3A','color':'#C7C3C3'})}else if($("#fmvigroup input:checked").val()=="white"){my_setcookie('maunenbaiviet',1,1,0);$("#notecheckf").text("Kích hoạt chế độ nền màu trắng");$("#notecheckf").show().fadeOut(1000);$(".chedodocbai").parent().parent().parent().parent().parent().parent().css({'background':'#ebebeb','color':'#000000'})}else if($("#fmvigroup input:checked").val()=="green"){my_setcookie('maunenbaiviet',2,1,0);$("#notecheckf").text("Kích hoạt chế độ nền xanh lục");$("#notecheckf").show().fadeOut(1000);$(".chedodocbai").parent().parent().parent().parent().parent().parent().css({'background':'#144f16','color':'#FFFFFF'})}});$(function(){if(my_getcookie('rutgonbaiviet')=='0'){$("#baivongfmvi input#Auto").attr("checked","checked")}else if(my_getcookie('rutgonbaiviet')=='1'){$("#baivongfmvi input#custom").attr("checked","checked")}else if(my_getcookie('rutgonbaiviet')=='2'){$("#baivongfmvi input#none").attr("checked","checked")}if(my_getcookie('rutgonchuky')=='0'){$("#fmvibaivong input#auto").attr("checked","checked")}else if(my_getcookie('rutgonchuky')=='1'){$("#fmvibaivong input#hide").attr("checked","checked")}else if(my_getcookie('rutgonchuky')=='2'){$("#fmvibaivong input#show").attr("checked","checked")}if($("#baivongfmvi input:checked").val()=="Auto"){$(".chedodocbai").each(function(){var $baivietdai=$(this);if($(this).height()>500){$(this).css({'overflow':'hidden','max-height':'300px'});$('<br/><button style="float:right; padding:1px" class="baivietquadai"><img title="Xem bài viết chi tiết" src ="http://i48.servimg.com/u/f48/16/58/89/73/more10.gif" alf="chi tiết"/></button>').insertAfter(this);$('.baivietquadai').click(function(){$baivietdai.css({'overflow':'hidden','max-height':'100%'});$(this).remove()})}})}else if($("#baivongfmvi input:checked").val()=="custom"){my_setcookie('rutgonbaiviet',1,1,0);$(".chedodocbai").each(function(){if($(this).html().search("<hr>")==-1){$(this).css({'overflow':'hidden','max-height':'100%'})}else{$(this).before('<div class="rutgonver2">'+$(this).html().slice(0,$(this).html().indexOf("<hr>"))+'</div><button style="float:right; padding:1px" class="baivietquadai"><img title="Xem bài viết chi tiết" src ="http://i48.servimg.com/u/f48/16/58/89/73/more10.gif" alf="chi tiết"/></button>');$(this).hide();$('.baivietquadai').click(function(){$(this).prev().hide();$(this).next().show();$(this).remove()})}})}else if($("#baivongfmvi input:checked").val()=="none"){$(".chedodocbai").css({'overflow':'hidden','max-height':'100%'})}});$("#baivongfmvi input").click(function(){$('.baivietquadai').remove();$(".rutgonver2").hide();$(".chedodocbai").show();$(".chedodocbai").css({'overflow':'hidden','max-height':'100%'});if($("#baivongfmvi input:checked").val()=="Auto"){$("#notecheckf").text("Kích hoạt chế độ tự động ẩn bài dài");$("#notecheckf").show().fadeOut(1000);my_setcookie('rutgonbaiviet',0,1,0);$(".chedodocbai").each(function(){var $baivietdai=$(this);if($(this).height()>500){$(this).css({'overflow':'hidden','max-height':'300px'});$('<br/><button style="float:right; padding:1px" class="baivietquadai"><img title="Xem bài viết chi tiết" src ="http://i48.servimg.com/u/f48/16/58/89/73/more10.gif" alf="chi tiết"/></button>').insertAfter(this);$('.baivietquadai').click(function(){$baivietdai.css({'overflow':'hidden','max-height':'100%'});$(this).remove()})}})}else if($("#baivongfmvi input:checked").val()=="custom"){$("#notecheckf").text("Kích hoạt chế độ ẩn đoạn ngắt dòng");$("#notecheckf").show().fadeOut(1000);my_setcookie('rutgonbaiviet',1,1,0);$(".chedodocbai").each(function(){if($(this).html().search("<hr>")==-1){$(this).css({'overflow':'hidden','max-height':'100%'})}else{$(this).before('<div class="rutgonver2">'+$(this).html().slice(0,$(this).html().indexOf("<hr>"))+'</div><button style="float:right; padding:1px" class="baivietquadai"><img title="Xem bài viết chi tiết" src ="http://i48.servimg.com/u/f48/16/58/89/73/more10.gif" alf="chi tiết"/></button>');$(this).hide();$('.baivietquadai').click(function(){$(this).prev().hide();$(this).next().show();$(this).remove()})}})}else if($("#baivongfmvi input:checked").val()=="none"){$("#notecheckf").text("Kích hoạt chế độ xem bình thường");$("#notecheckf").show().fadeOut(1000);my_setcookie('rutgonbaiviet',2,1,0);$(".chedodocbai").css({'overflow':'hidden','max-height':'100%'})}});$(function(){$('div.hieuungchuky img').css('max-width','600px');if($("#fmvibaivong input:checked").val()=="auto"){$('div.hieuungchuky').each(function(){if($(this).height()>350){$(this).css({'overflow':'hidden','max-height':'250px','max-width':'100%'});$(this).hover(function(){$(this).css({'overflow':'hidden','max-height':'100%','max-width':'100%'})},function(){$(this).css({'overflow':'hidden','max-height':'250px','max-width':'100%'})})}})}else if($("#fmvibaivong input:checked").val()=="hide"){$('div.hieuungchuky').hide()}else if($("#fmvibaivong input:checked").val()=="show"){$('div.hieuungchuky').show().css({'overflow':'hidden','max-height':'100%','max-width':'100%'})}});$("#fmvibaivong input").click(function(){$('div.hieuungchuky img').css('max-width','600px');$('div.hieuungchuky').show().css({'overflow':'hidden','max-height':'100%','max-width':'100%'});if($("#fmvibaivong input:checked").val()=="auto"){$("#notecheckf").text("Kích hoạt chế độ tự động ẩn một phần chữ ký");$("#notecheckf").show().fadeOut(1000);my_setcookie('rutgonchuky',0,1,0);$('div.hieuungchuky').each(function(){if($(this).height()>350){$(this).css({'overflow':'hidden','max-height':'250px','max-width':'100%'});$(this).hover(function(){$(this).css({'overflow':'hidden','max-height':'100%','max-width':'100%'})},function(){$(this).css({'overflow':'hidden','max-height':'250px','max-width':'100%'})})}})}else if($("#fmvibaivong input:checked").val()=="hide"){$("#notecheckf").text("Kích hoạt chế độ tự động ẩn toàn bộ chữ ký");$("#notecheckf").show().fadeOut(1000);my_setcookie('rutgonchuky',1,1,0);$('div.hieuungchuky').hide()}else if($("#fmvibaivong input:checked").val()=="show"){$("#notecheckf").text("Kích hoạt chế độ tự động hiện toàn bộ chữ ký");$("#notecheckf").show().fadeOut(1000);my_setcookie('rutgonchuky',2,1,0);$('div.hieuungchuky').show().css({'overflow':'hidden','max-height':'100%','max-width':'100%'})}});</script>

Chỉnh sửa các phần sau theo hướng dẫn cho từng phiên bản.

phpBB2: Tìm trong viewtopic_body:
Code:
{postrow.displayed.MESSAGE}
Thay bằng
Code:
<div class="chedodocbai">{postrow.displayed.MESSAGE}</div>
Tìm :
Code:
{postrow.displayed.SIGNATURE}
Thay bằng
Code:
<div class="hieuungchuky">{postrow.displayed.SIGNATURE}</div>
punBB: Tìm trong viewtopic_body:
Code:
{postrow.displayed.MESSAGE}
Thay bằng
Code:
<div class="chedodocbai">{postrow.displayed.MESSAGE}</div>
Tìm :
Code:
{postrow.displayed.SIGNATURE_NEW}
Thay bằng
Code:
<div class="hieuungchuky">{postrow.displayed.SIGNATURE_NEW}</div>

Ghi chú: Các bạn có thể chỉnh sửa giao diện mỗi menu nhưng không được tách các thành phần ra khỏi form của nó.
Phần script bạn có thể chỉnh sửa màu nền và kích thước ẩn/hiện bài viết, chữ ký.

Viết bởi baivong - FMvi.tk