[Hướng dẫn] Thêm BBcode (công cụ) vào bài viết

[ZerO kIng 2]

Chắc hẳn ai cũng biết cái bài này: http://diendan.chinhphuc.info/t14931-topic

Sau khi hơn 1 năm biệt tích, mình đã trở lại .
Và tiếp tục đóng góp cho anh em nhiều bài viết hay. Nhân ngày trở lại,
mình gửi tặng đến toàn thể các bạn Đoạn code giúp có thêm thanh công cụ
trên bảng công cụ bài viết. Chúng ta bắt tay vào làm nhé!

Đêmo:

Spoiler:

Cách làm:

Các bạn vào Templates => Post & Tin nhắn => Posting_body

Tìm đoạn code sau:

Code:

</span>
<img src="{PATH_IMG_FA}wysiwyg/separator.png" style="vertical-align:middle" />

Chèn đoạn code này xuống dưới đoạn code vừa tìm được:

Code:

<a href="#" onClick="window.open('Nội dung')"><button
class="button2" type="button" title="Nội dung 2"><img
src=http://i913.photobucket.com/albums/ac332/battuvuong/baivong/VZ011093924_29781_1.png></button></a>
<a href="#" onClick="window.open('Nội
dụng','_blank','width=360,height=150')"><button class="button2"
type="button" title="Nội dung 2 "><img
src=http://www.rentals-phuket.com/img/icon_pet.gif></button></a>

(Thay chỗ có đề Nội dung bằng 1 link nào đó) (VD muốn post ảnh, bạn ghi vào đó là http://upanh.com
(Thay chỗ có đề Nội dung 2 bằng 1 link nào đó) (VD chỉ cần click vào là
trở lại trang chủ diễn đàn thì bạn điền link diễn đàn của bạn vào)

Còn muốn thay đổi hình ảnh thì các bạn tìm;

Code:

http://www.rentals-phuket.com/img/icon_pet.gif

Code:

http://i913.photobucket.com/albums/ac332/battuvuong/baivong/VZ011093924_29781_1.png

và thay bằng link ảnh bạn muốn.

Vậy là xong rồi đó. Chúc các bạn thành công

[ZerO kIng 2]

Cách FIX LỖI khi không áp dụng được BBCode

(lưu ý: Chỉ nên dùng cách này khi không tìm thấy code hoặc không áp dụng được cách trên)

Các bạn vào Templates => Post & Tin nhắn => Posting_body

(Vì code dài quà nên ko post được minh đành phải up lên mediafire)

Thay toàn bộ Posting_body bằng code sau:
http://www.mediafire.com/?d6aapvaiewd82yr

(Các bạn bôi đen copy và paste vào địa chỉ thì link mới dùng được)

[bahomao12345]

Làm được rồi, thanks bác King nhé, vẫn nhớ cái ngày hoàn thành được cái shop pet của bác. Vote

[hunghsmn]

Bạn này đúng là cả năm không vào . Một tay nghiên cứu như vậy phải chi bạn vào Cp thường xuyên có phải vui không.
Kiểu chèn code vào Posting_body này mình chia sẻ lâu lắm rồi, cũng hay, nhưng có điều bất tiện vì số ký tự cho phép trong Posting_body có hạn nên làm được vài ba nút là đấy, có bạn vì đã chèn nhiều thứ khác rồi nên không chèn thêm được nữa

Từ sau khi FM cập nhật thêm mục Javascript codes management vậy là các siêu pro khác (hình như baivong thì phải) sáng tác ra một cách mà chúng ta có thể chèn thêm vào cả trăm, nghìn nút cũng được, rất đơn giản.

[ZerO kIng 2]

Bạn này đúng là cả năm không vào . Một tay nghiên cứu như vậy phải chi bạn vào Cp thường xuyên có phải vui không.
Kiểu chèn code vào Posting_body này mình chia sẻ lâu lắm rồi, cũng hay, nhưng có điều bất tiện vì số ký tự cho phép trong Posting_body có hạn nên làm được vài ba nút là đấy, có bạn vì đã chèn nhiều thứ khác rồi nên không chèn thêm được nữa

Từ sau khi FM cập nhật thêm mục Javascript codes management vậy là các siêu pro khác (hình như baivong thì phải) sáng tác ra một cách mà chúng ta có thể chèn thêm vào cả trăm, nghìn nút cũng được, rất đơn giản.

Hè bác cứ quá khen, trình độ của cháu giảm nhiều wá mà

[windmagic]

ai hướng dẫn cách xài Javascript codes management làm button thanh công cụ viết bài đi
version phpbb3 không xài cách Templates được thì phải ?

[Rin]

ai hướng dẫn cách xài Javascript codes management làm button thanh công cụ viết bài đi
version phpbb3 không xài cách Templates được thì phải ?

chính xác phpbb3 không đụng đến Templates dc nên chịu khó bạn tự des và tự add nhé ^^"

add ở Pics management nhé bạn

[windmagic]

ai hướng dẫn cách xài Javascript codes management làm button thanh công cụ viết bài đi
version phpbb3 không xài cách Templates được thì phải ?

chính xác phpbb3 không đụng đến Templates dc nên chịu khó bạn tự des và tự add nhé ^^"

add ở Pics management nhé bạn

làm button cho thanh công cụ viết bài thì chọn cái nào trong này ?
thanks bạn

[miamor]

_ _" Sao mà tạo 1 button trog đấy được....
Dùg phpbb3 thì chỉ có dùg javascript để tạo button mới thôi.

[windmagic]

_ _" Sao mà tạo 1 button trog đấy được....
Dùg phpbb3 thì chỉ có dùg javascript để tạo button mới thôi.

hic, thế mình chạy ngược chạy xuôi tìm người chỉ cách làm với cái javascrip nè
miamor giúp với, năn nỉ mà

[campha@64]

sao rum mình trong posting_body ko có cái này: ???

Code:

</span>
<img src="{PATH_IMG_FA}wysiwyg/separator.png" style="vertical-align:middle" />

[hunghsmn]

Để mình nói lại nhé, mình rất khoái cái này, mình đánh giá cao nó, coi đây là một trong số những phát kiến lớn, không kém gì cái last_topic đầu tiên của LYO:

Nó rất đơn giàn, ví dụ đây là nút mình dùng để chèn ảnh vào góc trên-trái bài viết:

Code:

$(function(){ $("<button class=\"button2\" onclick=\"bbfontstyle('[table align=left cellpadding= 6 cellspacing= 6][tr][td][img]','[/img][/td][/tr][/table]');return false\">img</button> ").insertBefore("span#text_edit input.button2[value='Others']");});

Bây giờ các bạn copy doạn code trên thành bao nhiêu nút cũng được, sau đó thay đoạn này

Code:

[table align=left cellpadding= 6 cellspacing= 6][tr][td][img]','[/img][/td][/tr][/table]

bằng BBcode do các bạn nghĩ ra, thay chữ img ở chỗ này >img< bằng chữ gì đó hay một ảnh button (để bấm)

Tiếp theo mở Javascript codes management lên, dán tất cả code của đó vào... việc sử dung Javascript codes management thôi khỏi nói nhé.

Đáng lẽ tới đây lưu lại là xong, vào viết bài sẽ thấy các nút đó hiện lên rồi, nhưng không biết tại sao của mình lại phải thêm cái này vào phần <head>...</head> của temp header thì nó nới hiện:

Code:

<script type="text/javascript" src="/link script mới tạo"></script>

Cái này hình như là của baivong, sau đó MarkChan chế thêm hay sao ấy, lâu quá quên mất rồi.

[Draudrey]

tức ghê đúng là cái này xịn rồi mà tớ chả biết add cái gì vào nữa

[thienan]

Bạn vào posting_body tìm đoạn này:

Code:

<button class="button2" id="text_editor_cmd_switchmode" type="button" title="{SWITCH_EDITOR_MODE}"><img src="{PATH_IMG_FA}i/switch_wysiwyg.gif" alt="{SWITCH_EDITOR_MODE}" /></button> 


Sau đó copy Code này và thả vào dưới đoạn tìm thấy ở trên.

Code:

<button class="button2" onclick="bbfontstyle('[table align=left cellpadding= 10 cellspacing= 5][tr][td][img]','[/img][/td][/tr][/table]');return false" type="button"><img src="http://i43.servimg.com/u/f43/17/03/21/99/1-chen10.gif" alt="Chèn ảnh" /></button>

<button class="button2" onclick="bbfontstyle('[table width= 100% align=left cellpadding= 10 cellspacing= 5][tr][td width= 50%]','[/td]');return false" type="button"><img src="http://i43.servimg.com/u/f43/17/03/21/99/1-chut10.gif" alt="Cột trái"/></button>

<button class="button2" onclick="bbfontstyle('[td width= 50%]','[/td][/tr][/table]');return false" type="button">
<img src="http://i43.servimg.com/u/f43/17/03/21/99/1-chup10.gif" alt="Cột phải"/></button>

<button class="button2" onmouseover="helpline('Tạo nền nổi cho văn bản')" onclick="bbfontstyle('[table class = bangnoi ][tr][td][img]http://www.repage.de/memberdata/tudao/arrow.png[/img][/td][td]','[/td][/tr][/table]');return false" type="button"><img src="http://www.repage.de/memberdata/tudao/khungnoi.gif"></button>

<button class="button2" onmouseover="helpline('Tạo nền Cáo Phó')" onclick="bbfontstyle('[table class = caopho ][tr][td]','[/td][/tr][/table]');return false" type="button"><img src="http://www.repage.de/memberdata/tu-dao/1-thanhgia.jpg"></button>       
   

<button class="button2" onmouseover="helpline('Tạo Văn bản thành 2 cột')" onclick="bbfontstyle('[table width= 100% align=left cellpadding= 10 cellspacing= 5][tr][td width= 50%]','[/td][td width= 50%]','[/td][/tr][/table]');return false" type="button"><img src="http://www.repage.de/memberdata/tu-dao/chia2cot.png"></button>

thả vào cuối CSS:

Code:

/*Bang cao pho 3 D*/
.caopho {
background: #ffffff url(http://www.repage.de/memberdata/tu-dao/MauCaoPhoLTXC-700x1165.png) ; width: 700px; height:1165px; padding: 0 20px;color: #fff;border: 0;padding: 85px 11px 20px 36px;text-shadow: 0 1px 2px black; repeat; /*Nen cao pho*/
}


Xem Demo:

Chúc nhiều vui vẻ...
DEMO:

[Draudrey]

code thì dc nhưng bbcode hỏng kìa

[Sponsored content]