Đưa icon smilies xuống dưới khung soạn thảo, trả lời nhanh trong vbb

Thảo luận trong 'Mã nguồn Xenforo - VBB' bắt đầu bởi admin, 4/9/14.

  1. admin

    admin Phạm Công Sơn Thành viên BQT

    Tham gia ngày:
    22/5/13
    Bài viết:
    3,900
    Đã được thích:
    783
    Điểm thành tích:
    113
    Giới tính:
    Nam
    Để đưa hết danh sách các icon xuống dưới khung soạn thảo bài viết giống ITSEOVN như hình dưới để khung soạn thảo to hơn và dễ nhìn hơn thì bạn làm theo các bước như dưới.

    dua-smilies-xuong-duoi-khung-soan-thao.jpg
    Demo

    • B1: Đăng nhập vào admincp của forum.
    • B2: Truy cập vào : Styles & Templates -> Styles Manager -> Edit Templates kéo xuống dưới chọn Editor Templates -> editor_ckeditor.
    • B3: Thay hết đoạn code cũ sau :
    Mã:
    <div id="{vb:raw editorid}" class="blockrow texteditor">
                <div class="editor">
                            <div class="editor_textbox_container<vb:if condition="$smiliebox"> smilie</vb:if>">
                                                    <div class="editor_textbox <vb:if condition="$smiliebox">editor_textbox_smilie</vb:if>">
                                                                {vb:raw ckeditor}
                                                    </div>
                            </div>
                            <vb:if condition="$smiliebox">
                            <div class="editor_smiliebox">
                                        {vb:raw smiliebox}
                            </div>
                            </vb:if>
                </div>
    </div>
    <input type="hidden" name="wysiwyg" id="{vb:raw editorid}_mode" value="{vb:raw editortype}" />
    
    Thành Code sau :

    Mã:
    <div id="{vb:raw editorid}" class="blockrow texteditor"> [INDENT]<div class="editor"> {vb:raw ckeditor} </div> 
    <vb:if condition="$smiliebox"> 
    [/INDENT]
    [INDENT=2]<div class="editor_smiliebox"> {vb:raw smiliebox} 
    </div> [/INDENT]
    [INDENT] </vb:if> 
    [/INDENT]
     </div> 
    <input type="hidden" name="wysiwyg" id="{vb:raw editorid}_mode" value="{vb:raw editortype}" />
    
    • B4: Truy cập vào : Styles & Templates -> Styles Manager -> Edit Templates kéo xuống dưới chọnCSS Templates -> editor.css
    Tìm tới đoạn code css :

    Mã:
    .editor_smiliebox { 
    float:{vb:stylevar right}; 
    width:{vb:math {vb:raw vboptions.smcolumns} * ({vb:stylevar editor_smiliebox_smiliesize} + 5)}; 
    height:200px; 
    _background-color:{vb:stylevar textedit_background.backgroundColor}; 
    _border:solid 1px {vb:stylevar mid_border.borderColor}; 
    padding:0 3px 3px 3px; }
    
    Thay bằng đoạn code css sau :

    Mã:
    .editor_smiliebox {
     _background-color:{vb:stylevar textedit_background.backgroundColor};
     _border:solid 1px {vb:stylevar mid_border.borderColor}; }

    Tiếp tục tìm đoạn code css

    Mã:
    .editor_smiliebox ul.smiliebox {height:190px;overflow:hidden;}

    Thay thế bằng đoạn code css sau :

    Mã:
    .editor_smiliebox ul.smiliebox {overflow:hidden;}
    Để hiển thị thêm số lượng icon trong danh sách icon mặc định(mặc định chỉ hiển thị tối đa 11 icon) thì bạn làm như sau :

    • Admincp -> Settings -> Opitions -> Message Posting Interface Options kéo xuống dưới tìm chọn Smiliebox Total Smilies thay thế số mặc định bằng số icon bạn muốn.
     
    Cảm ơn đã xem bài:

    Đưa icon smilies xuống dưới khung soạn thảo, trả lời nhanh trong vbb



Like và Share ủng hộ ITSEOVN