PDA

View Full Version : [TUT] Hướng dẫn tạo 1 bbcode trình bày bài viết cho Bo-Blog



kute9xpro.com
08-09-2009, 09:39 AM
Bạn sử dụng boblog như 1 trang web về software, ebook, hay bất cứ 1 lĩnh vực khác, bạn thường xuyên phải trình bày bài viết theo 1 chuẩn nhất định, chính vì vậy, việc tạo ra 1 bbcode để sử dụng riêng cho công việc mình là cần thiết.


Bài viết này mình sẽ hướng dẫn cách tạo 1 bbcode trình bày bài viết như bên dưới:

http://i727.photobucket.com/albums/ww279/hungvjnhbk/image001.jpg



Ở khung soạn thảo: Khi bạn click vào “ảnh hiển thị bbcode” thì ở phần nội dung sẽ hiển thị “nội dung hiển thị bbcode”:



http://i727.photobucket.com/albums/ww279/hungvjnhbk/image002.jpg


Để việc trình bày bài viết được đẹp, bạn nên sử dụng Plugin Highslide. Download và xem hướng dẫn sử dụng tại : HighSlide 4.0.8 for Bo-Blog 2.1.1 (http://www.freecodevn.com/for@um/showthread.php?t=60101)


Bây giờ chúng ta bắt đầu vào việc tạo 1 bbcode :


1. Mở file root\editor\ubb\editordef.php lên (có thể dùng Notepad++):


2. Bạn có thể thêm bbcode mình vào đoạn nào mà bạn thuận tiện, ở đây mình chèn trước đoạn:
Quote:

<a href="javascript: void(0); "><IMG border=0 onclick="AddText('[newpage]')" title="{$lna[702]}" src="editor/ubb/images/newpage.gif" ></a>
Đoạn code như sau:
Quote:

<a href="javascript: void(0); "><IMG border=0 onclick="AddText('http://')" title="Chèn ảnh Mặc định" src="editor/ubb/images/59.png" ></a>
Trong đó :
Quote:

[img align=r width=150]http://[/img (http://%5b/img)]
là nội dung xuất ra khung soạn thảo: Đoạn này sẽ chèn 1 ảnh có địa chỉ http:// có độ rộng 150pixel nằm bên phải bài viết (như hình minh họa trên)



editor/ubb/images/59.png :
Địa chỉ của “ảnh hiện thị bbcode”

Tương tự bạn có thể tạo các bbcode như:


1.Bbcode Download:

<a href="javascript: void(0); "><IMG border=0 onclick="AddText('[separator][p align=center]editor/ubb/images/dl.pnghttp:// ')" title="Download" src="editor/ubb/images/46.png" ></a>
Bbcode này sẽ chèn ký tự ngắt trang, hiển thị ảnh download và chèn link tập tin tải về: http:// như hình bên dưới:

http://i727.photobucket.com/albums/ww279/hungvjnhbk/image003.jpg

2.Bbcode chèn 1 ảnh bất kỳ:

<a href="javascript: void(0); "><IMG border=0 onclick="AddText('editor/ubb/images/mf.png')" title="Link mediafire" src="editor/ubb/images/71.png" ></a>
Đoạn này sẽ chèn vào ảnh mediafire như hình dưới:

http://i727.photobucket.com/albums/ww279/hungvjnhbk/image004.jpg


Mặc dù tut này rất đơn giản, nhưng rất hữu ích nếu bạn biết vận dụng vào trang web mình.
Chúc các bạn thành công !
DEMO: http://vnsky.biz (http://vnsky.biz/)

duchienan
08-09-2009, 09:40 AM
mình vào xin admin cho bạn vào box bo-blog rồi đó. chịu khó cùng nhau cho box sôi động vui vẻ nhé.

kute9xpro.com
08-09-2009, 09:55 AM
mình vào xin admin cho bạn vào box bo-blog rồi đó. chịu khó cùng nhau cho box sôi động vui vẻ nhé.
uhk` nhưng vẫn phải chờ ý kiến của admin

chicken412
08-09-2009, 10:04 AM
bác làm mod box bo-blog em ủng hộ cả hai tay

nguyenhoan76041
17-04-2012, 03:38 AM
có gói soạn tháo riêng không nhỉ

nguyenhoan76041
17-04-2012, 03:39 AM
bác làm mod box bo-blog em ủng hộ cả hai tay
ok :-bd:-bd:-bd:-bd:-bd:-bd