Notification BB Codes - Các BB Code thông báo 1.1.1

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,828
Được Like
12,687
Notification BB Codes - Các BB Code thông báo 1.1.1

Addon này sẽ tạo một Notification BB Code để hiển thị hộp màu đặc biệt, với biểu tượng font-awesome.
Tính năng:
  • Thêm bbcode [ERROR].
  • Thêm bbcode [INFORMATION].
  • Thêm bbcode [SUCCESS].
  • Thêm bbcode [WARNING].
  • Tùy chỉnh font-awesome icons.
Cách dùng:
  • Tạo bài viết mới và đưa vào:
    Mã:
    [ERROR=Test title]Test content[/ERROR]
    [INFORMATION=Test title]Test content[/INFORMATION]
    [SUCCESS=Test title]Test content[/SUCCESS]
    [WARNING=Test title]Test content[/WARNING]
Cài đặt:
  1. Download NotificationBBCodes_v1.1.1.zip ở file đính kèm và giải nén ra.
  2. Từ Admin Control Panel, đến trang "Install Add-on".
  3. Upload file addon-notification_bb_codes.xml.
  4. Click vào nút Install Add-on.
Demo:

1.jpg

2.jpg


3.jpg

4.jpg

Chúc các bạn thành công.


Nguồn: xenforo.com​
 

Đính kèm

  • NotificationBBCodes_v1.1.1.zip
    14 KB · Lượt xem: 30

nh0kkute718

Private
Tham gia
18/06/2015
Bài viết
23
Được Like
6
Ad ơi làm cách nào cho chiều ngang của nó dài ra được vậy

Ad cho em hỏi luôn là nó ở trên thanh công cụ như vầy thì có thể đổi biểu tượng của nó được ko và bằng cách nào, thanks ad rất nhiều ạ

22.png
 

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,828
Được Like
12,687
bạn thay đổi ở đây

1.jpg
 

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,828
Được Like
12,687
bạn vào template notification_bb_codes.css
tìm:
Mã:
.Message {
  display: table;
  position: relative;
  margin: 40px auto 0;
  width: 500px;

thay đổi giá trị của width: 500px;
 

nh0kkute718

Private
Tham gia
18/06/2015
Bài viết
23
Được Like
6
bạn vào template notification_bb_codes.css
tìm:
Mã:
.Message {
  display: table;
  position: relative;
  margin: 40px auto 0;
  width: 500px;

thay đổi giá trị của width: 500px;

Ad cho mình hỏi là file template notification_bb_codes.css nằm ở đâu vậy ạ, trong host hay trong admin cp, em còn yếu mong ad chỉ dẫn !
 

nh0kkute718

Private
Tham gia
18/06/2015
Bài viết
23
Được Like
6
Thanks ad đã thành công, ad chỉ em thay cái icon của bbcode với ạ :)

22-png.3934.html
 

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,828
Được Like
12,687
mình cũng không rõ nhưng mà có thể là bạn vào styles\style bạn đang dùng\xenforo\editor\icons.png tìm và thay thế ảnh tương tự ảnh đường link mình đưa
 

nh0kkute718

Private
Tham gia
18/06/2015
Bài viết
23
Được Like
6
mình cũng không rõ nhưng mà có thể là bạn vào styles\style bạn đang dùng\xenforo\editor\icons.png tìm và thay thế ảnh tương tự ảnh đường link mình đưa

Có những icon em cần ở đây mà nó lại ko hiện lên thanh công cụ mới buồn chứ :(

2.png
 

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,828
Được Like
12,687
của mình cài addon này vào là nó tự động hiện mà bạn @@
 

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,828
Được Like
12,687
1.png


chỉ cần cài addon là nó hiện à, còn của bạn bạn cho cái ảnh demo xem thử, mọi người sẽ giúp bạn
 

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,828
Được Like
12,687
chắc là do cache chưa reset thôi :D
 

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,828
Được Like
12,687
thì xóa cache trình duyệt đó bạn ^^
 

Sesshomaru

Private
Tham gia
11/06/2015
Bài viết
26
Được Like
18
đã xóa nhưng vẫn ko đc :(
Bạn thay thế toàn bộ editor_ui.css của style không hiện icon bằng đoạn code này nhé.
Bạn nhớ thay 2 dòng cái đường dẫn styles/vietreview.net/xenforo/editor/icons.png?redactor cho phù hợp nhé
.hasJs .BbCodeWysiwygEditor
{
visibility: hidden;
}

.redactor_box {
font-size: 0;
border: 1px solid rgb(239, 242, 247);
line-height: 0;
position: relative;
overflow: hidden;

}

.redactor_box .redactor_smilies
{
overflow: hidden; *zoom: 1;
}

.redactor_box .redactor_smilies .tabs
{
min-height: 0;
}

.redactor_box .redactor_smilies .smilieContainer
{
max-height: 150px;
overflow: auto;
}

.redactor_box .redactor_smilies .primaryContent,
.redactor_box .redactor_smilies .secondaryContent
{
border-bottom: none;
}

.redactor_box .redactor_smilies .secondaryContent
{
border-top: 1px solid rgb(239, 242, 247);
}

.redactor_box .redactor_smilies .tabs a
{
height: 18px;
line-height: 18px;
font-size: 11px;
}


.redactor_box .redactor_smilies .smilieCategory li
{
display: inline-block;
margin: 0;
padding: 2px;
cursor: pointer;
line-height: 1.6;
}

.redactor_box .draftNotice,
.redactor_box .placeholder
{
display: none;
position: relative;
line-height: 0;
font-size: 0;
z-index: 1;
}

.redactor_box .draftNotice span
{
position: absolute;
right: 20px;
top: -30px;
float: right;
line-height: 14px;
font-size: 11px;
color: rgb(146, 165, 180);
padding: 5px;
-webkit-border-radius: 3px; -moz-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px;
background: rgb(255, 255, 255);
-webkit-box-shadow: 1px 1px 4px rgb(146, 165, 180); -moz-box-shadow: 1px 1px 4px rgb(146, 165, 180); -khtml-box-shadow: 1px 1px 4px rgb(146, 165, 180); box-shadow: 1px 1px 4px rgb(146, 165, 180);
opacity: .5;
}

.redactor_box .placeholder span
{
line-height: 14px;

font-size: 11pt;
font-family: helvetica, georgia, arial, sans-serif;
line-height: 1.4;


position: absolute;
left: 8px;
top: 8px;
color: rgb(160,160,160);
}


/* TOOLBAR */
.redactor_toolbar {
font-size: 0;
background-color: rgb(239, 242, 247);
padding: 0 0 0 2px;
margin: 0;
border-bottom: 1px solid rgb(239, 242, 247);
position: relative;
left: 0;
top: 0;
line-height: 0;
list-style: none;
overflow: hidden;

}

.blendedEditor .redactor_box .redactor_toolbar
{
max-height: 68px;
}

.blendedEditor .redactor_box.activated .redactor_toolbar
{
max-height: none;
}

.redactor_toolbar li {
float: left;
margin: 2px 1px;
margin-right: 0;
list-style: none;
outline: none;
}

.redactor_toolbar li.redactor_btn_right {
float: right;
}

.redactor_toolbar li a {
font-size: 0;
text-decoration: none;
border: 1px solid transparent;
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;
display: block;
line-height: 0;
cursor: pointer;
zoom: 1;
outline: none;
text-indent: -9999px;
width: 24px;
height: 24px;

}

html .redactor_toolbar li a,
html .redactor_toolbar li a:hover,
html .redactor_toolbar li a:active,
html .redactor_toolbar li a.redactor_act
{
background-image: url('styles/vietreview.net/xenforo/editor/icons.png?redactor');
background-repeat: no-repeat;
background-position: 0;
}

.redactor_toolbar li a:hover {
background-color: rgb(255, 255, 255);
border-color: rgb(212, 212, 212);
-webkit-border-radius: 3px; -moz-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px;
outline: none;

}

.redactor_toolbar li a:active, .redactor_toolbar li a.redactor_act {
background-color: rgb(239, 242, 247);
border: 1px solid rgb(212, 212, 212);
-webkit-border-radius: 3px; -moz-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px;
outline: none;

}

.redactor_toolbar li li {
padding: 0;
margin: 1px;
}

.redactor_toolbar li.redactor_btn_group {
margin-left: 2px;
margin-right: 2px;
}

.redactor_toolbar li.redactor_btn_group ul {
padding: 1px;
margin: 0;
overflow: hidden;
*zoom: 1;

}


/* Fade toolbar when editor is not activated */
.blendedEditor .redactor_box .redactor_btn_group ul,
.blendedEditor .redactor_box iframe,
.blendedEditor .redactor_box .redactor_smilies li
{
opacity: 0.5;
-webkit-transition: opacity 0.3s ease-in-out;
-moz-transition: opacity 0.3s ease-in-out;
transition: opacity 0.3s ease-in-out;
}

.blendedEditor .redactor_box.activated .redactor_btn_group ul,
.blendedEditor .redactor_box.activated iframe,
.blendedEditor .redactor_box.activated .redactor_smilies li
{
opacity: 1;
}


.redactor_toolbar li.redactor_separator {
float: left;
height: 32px;
border-left: 1px solid #d3d3d3;
border-right: 1px solid #f5f5f5;
padding: 0;
margin: 0 2px 0 3px;
}


/*BUTTONS*/



html .redactor_toolbar li a.redactor_btn_html { background-position: 3px -2429px; }

html .redactor_toolbar li a.redactor_btn_switchmode { background-position: 3px -605px; }

html .redactor_toolbar li a.redactor_btn_removeformat { background-position: 3px -2205px; }

html .redactor_toolbar li a.redactor_btn_draft { background-position: 3px -2237px; }

html .redactor_toolbar li a.redactor_btn_draftsave { background-position: 3px -2237px; }

html .redactor_toolbar li a.redactor_btn_new { background-position: 3px -1853px; }

html .redactor_toolbar li a.redactor_btn_draftdelete { background-position: 3px -1853px; }

html .redactor_toolbar li a.redactor_btn_bold { background-position: 3px -29px; }

html .redactor_toolbar li a.redactor_btn_italic { background-position: 3px -61px; }

html .redactor_toolbar li a.redactor_btn_underline { background-position: 3px -189px; }

html .redactor_toolbar li a.redactor_btn_deleted { background-position: 3px -93px; }

html .redactor_toolbar li a.redactor_btn_fontcolor { background-position: 3px -541px; }

html .redactor_toolbar li a.redactor_btn_fontsize { background-position: 3px -2941px; }

html .redactor_toolbar li a.redactor_btn_fontfamily { background-position: 3px -2909px; }

html .redactor_toolbar li a.redactor_btn_smilies { background-position: 3px -2397px; }

html .redactor_toolbar li a.redactor_btn_alignment { background-position: 3px -1469px; }

html .redactor_toolbar li a.redactor_btn_alignleft { background-position: 3px -1469px; }

html .redactor_toolbar li a.redactor_btn_aligncenter { background-position: 3px -1437px; }

html .redactor_toolbar li a.redactor_btn_alignright { background-position: 3px -1501px; }

html .redactor_toolbar li a.redactor_btn_justify { background-position: 3px -1405px; }

html .redactor_toolbar li a.redactor_btn_unorderedlist { background-position: 3px -1693px; }

html .redactor_toolbar li a.redactor_btn_orderedlist { background-position: 3px -1757px; }

html .redactor_toolbar li a.redactor_btn_outdent { background-position: 3px -1373px; }

html .redactor_toolbar li a.redactor_btn_indent { background-position: 3px -1309px; }

html .redactor_toolbar li a.redactor_btn_image { background-position: 3px -1245px; }

html .redactor_toolbar li a.redactor_btn_table { background-position: 3px -2493px; }

html .redactor_toolbar li a.redactor_btn_link { background-position: 3px -1597px; }

html .redactor_toolbar li a.redactor_btn_createlink { background-position: 3px -1597px; }

html .redactor_toolbar li a.redactor_btn_unlink { background-position: 3px -1629px; }

html .redactor_toolbar li a.redactor_btn_horizontalrule { background-position: 3px -1181px; }

html .redactor_toolbar li a.redactor_btn_code { background-position: 3px -2429px; }

html .redactor_toolbar li a.redactor_btn_insertcode { background-position: 3px -2429px; }

html .redactor_toolbar li a.redactor_btn_quote { background-position: 3px -285px; }

html .redactor_toolbar li a.redactor_btn_insertquote { background-position: 3px -285px; }

html .redactor_toolbar li a.redactor_btn_media { background-position: 3px -2877px; }

html .redactor_toolbar li a.redactor_btn_undo { background-position: 3px -2813px; }

html .redactor_toolbar li a.redactor_btn_redo { background-position: 3px -2749px; }

html .redactor_toolbar li a.redactor_btn_spoiler { background-position: 3px -1565px; }

html .redactor_toolbar li a.redactor_btn_insertspoiler { background-position: 3px -1565px; }

html .redactor_toolbar li a.redactor_btn_insert { background-position: 3px -2301px; }



html .redactor_toolbar li a.redactor_btn_custom_error
{
background-image: url('styles/Kalco/notification/editor_icons/error-icon.png');

}



html .redactor_toolbar li a.redactor_btn_custom_information
{
background-image: url('styles/Kalco/notification/editor_icons/information-icon.png');

}



html .redactor_toolbar li a.redactor_btn_custom_success
{
background-image: url('styles/Kalco/notification/editor_icons/success-icon.png');

}



html .redactor_toolbar li a.redactor_btn_custom_warning
{
background-image: url('styles/Kalco/notification/editor_icons/warning-icon.png');

}


html[dir=rtl] .redactor_toolbar li a.redactor_btn_unorderedlist { background-position: 3px -1661px; }

html[dir=rtl] .redactor_toolbar li a.redactor_btn_orderedlist { background-position: 3px -1725px; }

html[dir=rtl] .redactor_toolbar li a.redactor_btn_outdent { background-position: 3px -1341px; }

html[dir=rtl] .redactor_toolbar li a.redactor_btn_indent { background-position: 3px -1277px; }

html[dir=rtl] .redactor_toolbar li a.redactor_btn_undo { background-position: 3px -2781px; }

html[dir=rtl] .redactor_toolbar li a.redactor_btn_redo { background-position: 3px -2717px; }



/* DROPDOWN */
.redactor_dropdown {
top: 28px;
left: 0;
z-index: 100004;
position: absolute;
width: 200px;
max-height: 150px;
overflow: auto;
background-color: rgb(255, 255, 255);
border: 1px solid #ccc;
font-size: 13px;
-webkit-box-shadow: 0 2px 5px #ccc; -moz-box-shadow: 0 2px 5px #ccc; -khtml-box-shadow: 0 2px 5px #ccc; box-shadow: 0 2px 5px #ccc;
line-height: 1.5;
padding: 5px;
}

.redactor_dropdown a
{
display: block;
color: rgb(56, 68, 95);
padding: 3px 5px;
text-decoration: none;
}

.redactor_dropdown a.icon
{
padding: 0px 0px 0px 32px;
height: 24px;
line-height: 24px;
background: transparent url('styles/vietreview.net/xenforo/editor/icons.png?redactor') no-repeat 0 0;
}

.redactor_dropdown a.alignLeft
{
background-position: 3% -1469px;
}
.redactor_dropdown a.alignCenter
{
background-position: 3% -1437px;
}
.redactor_dropdown a.alignRight
{
background-position: 3% -1501px;
}

.redactor_dropdown a.saveDraft
{
background-position: 3% -2237px;
}
.redactor_dropdown a.deleteDraft
{
background-position: 3% -1853px;
}

.redactor_dropdown a.code
{
background-position: 3% -2429px;
}
.redactor_dropdown a.quote
{
background-position: 3% -285px;
}
.redactor_dropdown a.spoiler
{
background-position: 3% -1565px;
}
.redactor_dropdown a.strikethrough
{
background-position: 3% -93px;
}

.redactor_dropdown a:hover {
text-decoration: none;
background-color: rgb(239, 242, 247);
}

.redactor_separator_drop {
border-top: 1px solid #ddd;
padding: 0;
line-height: 0;
font-size: 0;
}

/* ColorPicker */

.redactor_color_link {
padding: 0;
width: 15px;
height: 15px;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .2) inset; -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .2) inset; -khtml-box-shadow: 0 1px 2px rgba(0, 0, 0, .2) inset; box-shadow: 0 1px 2px rgba(0, 0, 0, .2) inset;
-webkit-border-radius: 4px; -moz-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px;
float: left;
margin: 2px;
font-size: 0;
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;
}

.redactor_color_none {
font-size: 11px;
clear: both;
}



/* MODAL */
#redactor_modal_overlay {
position: fixed;
margin: auto;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 209998;

opacity: 0.6;
filter: alpha(opacity='60');

background-color: rgb(255, 255, 255);
}

#redactor_modal {
padding: 0;
position: fixed;
top: 50%;
z-index: 209999;
}

#redactor_modal_close {
overflow: hidden;
text-indent: -9999px;
cursor: pointer;
background-image: url('styles/it4rvn/xenforo/overlay/close.png');
position: absolute;
right: 4px;
top: 4px;
cursor: pointer;
z-index: 99;
width: 35px;
height: 35px;

}

#redactor_tabs {
margin-bottom: 18px;
text-align: center;
}

#redactor_tabs a {
display: inline-block;
border: 1px solid #d8d8d8;
padding: 4px 14px;
font-size: 12px;
background-color: #ccc;
text-decoration: none;
color: #555;
line-height: 1;
-webkit-border-radius: 5px; -moz-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px;
margin-right: 5px;
}

#redactor_tabs a:hover, #redactor_tabs a.redactor_tabs_act {
background-color: #eee;
padding: 5px 15px;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .4) inset; -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .4) inset; -khtml-box-shadow: 0 1px 2px rgba(0, 0, 0, .4) inset; box-shadow: 0 1px 2px rgba(0, 0, 0, .4) inset;
border: none;
text-shadow: 0 0 0 transparent, 0 1px 0 #eee;
color: #777;
text-decoration: none;
}

.redactor_editor_drop {
display: none;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
border: 2px dashed #aaa;
color: #000;
background: url(rgba.php?r=190&g=190&b=190&a=127); background: rgba(190, 190, 190, .5); _filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#7FBEBEBE,endColorstr=#7FBEBEBE);
}

.redactor_editor_drop.dragDisabled
{
background: url(rgba.php?r=190&g=140&b=140&a=127); background: rgba(190, 140, 140, .5); _filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#7FBE8C8C,endColorstr=#7FBE8C8C);
border-color: rgb(150, 75, 75);
}

.redactor_editor_drop span {
display: block;
text-align: center;
position: absolute;
top: 50%;
width: 100%;
font-size: 18px;
line-height: 26px;
margin-top: -13px;
}

.redactor_editor_drop.hover {
display: block;
}


/* Drag and Drop Area */
.redactor_droparea {
position: relative;
width: 100%;
margin: auto;
margin-bottom: 5px;
}
.redactor_droparea .redactor_dropareabox {
z-index: 1;
position: relative;
text-align: center;
width: 99%;
background-color: #fff;
padding: 60px 0;
border: 2px dashed #bbb;
}
.redactor_droparea .redactor_dropareabox, .redactor_dropalternative {
color: #555;
font-size: 12px;
}
.redactor_dropalternative {
margin: 4px 0 2px 0;
}
.redactor_dropareabox.hover {
background: #efe3b8;
border-color: #aaa;
}
.redactor_dropareabox.error {
background: #f7e5e5;
border-color: #dcc3c3;
}
.redactor_dropareabox.drop {
background: #f4f4ee;
border-color: #e0e5d6;
}
 
Sửa lần cuối:

nh0kkute718

Private
Tham gia
18/06/2015
Bài viết
23
Được Like
6
Bạn thay thế toàn bộ editor_ui.css của style không hiện icon bằng đoạn code này nhé.
Bạn nhớ thay 2 dòng cái đường dẫn styles/vietreview.net/xenforo/editor/icons.png?redactor cho phù hợp nhé
.hasJs .BbCodeWysiwygEditor
{
visibility: hidden;
}

.redactor_box {
font-size: 0;
border: 1px solid rgb(239, 242, 247);
line-height: 0;
position: relative;
overflow: hidden;

}

.redactor_box .redactor_smilies
{
overflow: hidden; *zoom: 1;
}

.redactor_box .redactor_smilies .tabs
{
min-height: 0;
}

.redactor_box .redactor_smilies .smilieContainer
{
max-height: 150px;
overflow: auto;
}

.redactor_box .redactor_smilies .primaryContent,
.redactor_box .redactor_smilies .secondaryContent
{
border-bottom: none;
}

.redactor_box .redactor_smilies .secondaryContent
{
border-top: 1px solid rgb(239, 242, 247);
}

.redactor_box .redactor_smilies .tabs a
{
height: 18px;
line-height: 18px;
font-size: 11px;
}


.redactor_box .redactor_smilies .smilieCategory li
{
display: inline-block;
margin: 0;
padding: 2px;
cursor: pointer;
line-height: 1.6;
}

.redactor_box .draftNotice,
.redactor_box .placeholder
{
display: none;
position: relative;
line-height: 0;
font-size: 0;
z-index: 1;
}

.redactor_box .draftNotice span
{
position: absolute;
right: 20px;
top: -30px;
float: right;
line-height: 14px;
font-size: 11px;
color: rgb(146, 165, 180);
padding: 5px;
-webkit-border-radius: 3px; -moz-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px;
background: rgb(255, 255, 255);
-webkit-box-shadow: 1px 1px 4px rgb(146, 165, 180); -moz-box-shadow: 1px 1px 4px rgb(146, 165, 180); -khtml-box-shadow: 1px 1px 4px rgb(146, 165, 180); box-shadow: 1px 1px 4px rgb(146, 165, 180);
opacity: .5;
}

.redactor_box .placeholder span
{
line-height: 14px;

font-size: 11pt;
font-family: helvetica, georgia, arial, sans-serif;
line-height: 1.4;


position: absolute;
left: 8px;
top: 8px;
color: rgb(160,160,160);
}


/* TOOLBAR */
.redactor_toolbar {
font-size: 0;
background-color: rgb(239, 242, 247);
padding: 0 0 0 2px;
margin: 0;
border-bottom: 1px solid rgb(239, 242, 247);
position: relative;
left: 0;
top: 0;
line-height: 0;
list-style: none;
overflow: hidden;

}

.blendedEditor .redactor_box .redactor_toolbar
{
max-height: 68px;
}

.blendedEditor .redactor_box.activated .redactor_toolbar
{
max-height: none;
}

.redactor_toolbar li {
float: left;
margin: 2px 1px;
margin-right: 0;
list-style: none;
outline: none;
}

.redactor_toolbar li.redactor_btn_right {
float: right;
}

.redactor_toolbar li a {
font-size: 0;
text-decoration: none;
border: 1px solid transparent;
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;
display: block;
line-height: 0;
cursor: pointer;
zoom: 1;
outline: none;
text-indent: -9999px;
width: 24px;
height: 24px;

}

html .redactor_toolbar li a,
html .redactor_toolbar li a:hover,
html .redactor_toolbar li a:active,
html .redactor_toolbar li a.redactor_act
{
background-image: url('styles/vietreview.net/xenforo/editor/icons.png?redactor');
background-repeat: no-repeat;
background-position: 0;
}

.redactor_toolbar li a:hover {
background-color: rgb(255, 255, 255);
border-color: rgb(212, 212, 212);
-webkit-border-radius: 3px; -moz-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px;
outline: none;

}

.redactor_toolbar li a:active, .redactor_toolbar li a.redactor_act {
background-color: rgb(239, 242, 247);
border: 1px solid rgb(212, 212, 212);
-webkit-border-radius: 3px; -moz-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px;
outline: none;

}

.redactor_toolbar li li {
padding: 0;
margin: 1px;
}

.redactor_toolbar li.redactor_btn_group {
margin-left: 2px;
margin-right: 2px;
}

.redactor_toolbar li.redactor_btn_group ul {
padding: 1px;
margin: 0;
overflow: hidden;
*zoom: 1;

}


/* Fade toolbar when editor is not activated */
.blendedEditor .redactor_box .redactor_btn_group ul,
.blendedEditor .redactor_box iframe,
.blendedEditor .redactor_box .redactor_smilies li
{
opacity: 0.5;
-webkit-transition: opacity 0.3s ease-in-out;
-moz-transition: opacity 0.3s ease-in-out;
transition: opacity 0.3s ease-in-out;
}

.blendedEditor .redactor_box.activated .redactor_btn_group ul,
.blendedEditor .redactor_box.activated iframe,
.blendedEditor .redactor_box.activated .redactor_smilies li
{
opacity: 1;
}


.redactor_toolbar li.redactor_separator {
float: left;
height: 32px;
border-left: 1px solid #d3d3d3;
border-right: 1px solid #f5f5f5;
padding: 0;
margin: 0 2px 0 3px;
}


/*BUTTONS*/



html .redactor_toolbar li a.redactor_btn_html { background-position: 3px -2429px; }

html .redactor_toolbar li a.redactor_btn_switchmode { background-position: 3px -605px; }

html .redactor_toolbar li a.redactor_btn_removeformat { background-position: 3px -2205px; }

html .redactor_toolbar li a.redactor_btn_draft { background-position: 3px -2237px; }

html .redactor_toolbar li a.redactor_btn_draftsave { background-position: 3px -2237px; }

html .redactor_toolbar li a.redactor_btn_new { background-position: 3px -1853px; }

html .redactor_toolbar li a.redactor_btn_draftdelete { background-position: 3px -1853px; }

html .redactor_toolbar li a.redactor_btn_bold { background-position: 3px -29px; }

html .redactor_toolbar li a.redactor_btn_italic { background-position: 3px -61px; }

html .redactor_toolbar li a.redactor_btn_underline { background-position: 3px -189px; }

html .redactor_toolbar li a.redactor_btn_deleted { background-position: 3px -93px; }

html .redactor_toolbar li a.redactor_btn_fontcolor { background-position: 3px -541px; }

html .redactor_toolbar li a.redactor_btn_fontsize { background-position: 3px -2941px; }

html .redactor_toolbar li a.redactor_btn_fontfamily { background-position: 3px -2909px; }

html .redactor_toolbar li a.redactor_btn_smilies { background-position: 3px -2397px; }

html .redactor_toolbar li a.redactor_btn_alignment { background-position: 3px -1469px; }

html .redactor_toolbar li a.redactor_btn_alignleft { background-position: 3px -1469px; }

html .redactor_toolbar li a.redactor_btn_aligncenter { background-position: 3px -1437px; }

html .redactor_toolbar li a.redactor_btn_alignright { background-position: 3px -1501px; }

html .redactor_toolbar li a.redactor_btn_justify { background-position: 3px -1405px; }

html .redactor_toolbar li a.redactor_btn_unorderedlist { background-position: 3px -1693px; }

html .redactor_toolbar li a.redactor_btn_orderedlist { background-position: 3px -1757px; }

html .redactor_toolbar li a.redactor_btn_outdent { background-position: 3px -1373px; }

html .redactor_toolbar li a.redactor_btn_indent { background-position: 3px -1309px; }

html .redactor_toolbar li a.redactor_btn_image { background-position: 3px -1245px; }

html .redactor_toolbar li a.redactor_btn_table { background-position: 3px -2493px; }

html .redactor_toolbar li a.redactor_btn_link { background-position: 3px -1597px; }

html .redactor_toolbar li a.redactor_btn_createlink { background-position: 3px -1597px; }

html .redactor_toolbar li a.redactor_btn_unlink { background-position: 3px -1629px; }

html .redactor_toolbar li a.redactor_btn_horizontalrule { background-position: 3px -1181px; }

html .redactor_toolbar li a.redactor_btn_code { background-position: 3px -2429px; }

html .redactor_toolbar li a.redactor_btn_insertcode { background-position: 3px -2429px; }

html .redactor_toolbar li a.redactor_btn_quote { background-position: 3px -285px; }

html .redactor_toolbar li a.redactor_btn_insertquote { background-position: 3px -285px; }

html .redactor_toolbar li a.redactor_btn_media { background-position: 3px -2877px; }

html .redactor_toolbar li a.redactor_btn_undo { background-position: 3px -2813px; }

html .redactor_toolbar li a.redactor_btn_redo { background-position: 3px -2749px; }

html .redactor_toolbar li a.redactor_btn_spoiler { background-position: 3px -1565px; }

html .redactor_toolbar li a.redactor_btn_insertspoiler { background-position: 3px -1565px; }

html .redactor_toolbar li a.redactor_btn_insert { background-position: 3px -2301px; }



html .redactor_toolbar li a.redactor_btn_custom_error
{
background-image: url('styles/Kalco/notification/editor_icons/error-icon.png');

}



html .redactor_toolbar li a.redactor_btn_custom_information
{
background-image: url('styles/Kalco/notification/editor_icons/information-icon.png');

}



html .redactor_toolbar li a.redactor_btn_custom_success
{
background-image: url('styles/Kalco/notification/editor_icons/success-icon.png');

}



html .redactor_toolbar li a.redactor_btn_custom_warning
{
background-image: url('styles/Kalco/notification/editor_icons/warning-icon.png');

}


html[dir=rtl] .redactor_toolbar li a.redactor_btn_unorderedlist { background-position: 3px -1661px; }

html[dir=rtl] .redactor_toolbar li a.redactor_btn_orderedlist { background-position: 3px -1725px; }

html[dir=rtl] .redactor_toolbar li a.redactor_btn_outdent { background-position: 3px -1341px; }

html[dir=rtl] .redactor_toolbar li a.redactor_btn_indent { background-position: 3px -1277px; }

html[dir=rtl] .redactor_toolbar li a.redactor_btn_undo { background-position: 3px -2781px; }

html[dir=rtl] .redactor_toolbar li a.redactor_btn_redo { background-position: 3px -2717px; }



/* DROPDOWN */
.redactor_dropdown {
top: 28px;
left: 0;
z-index: 100004;
position: absolute;
width: 200px;
max-height: 150px;
overflow: auto;
background-color: rgb(255, 255, 255);
border: 1px solid #ccc;
font-size: 13px;
-webkit-box-shadow: 0 2px 5px #ccc; -moz-box-shadow: 0 2px 5px #ccc; -khtml-box-shadow: 0 2px 5px #ccc; box-shadow: 0 2px 5px #ccc;
line-height: 1.5;
padding: 5px;
}

.redactor_dropdown a
{
display: block;
color: rgb(56, 68, 95);
padding: 3px 5px;
text-decoration: none;
}

.redactor_dropdown a.icon
{
padding: 0px 0px 0px 32px;
height: 24px;
line-height: 24px;
background: transparent url('styles/vietreview.net/xenforo/editor/icons.png?redactor') no-repeat 0 0;
}

.redactor_dropdown a.alignLeft
{
background-position: 3% -1469px;
}
.redactor_dropdown a.alignCenter
{
background-position: 3% -1437px;
}
.redactor_dropdown a.alignRight
{
background-position: 3% -1501px;
}

.redactor_dropdown a.saveDraft
{
background-position: 3% -2237px;
}
.redactor_dropdown a.deleteDraft
{
background-position: 3% -1853px;
}

.redactor_dropdown a.code
{
background-position: 3% -2429px;
}
.redactor_dropdown a.quote
{
background-position: 3% -285px;
}
.redactor_dropdown a.spoiler
{
background-position: 3% -1565px;
}
.redactor_dropdown a.strikethrough
{
background-position: 3% -93px;
}

.redactor_dropdown a:hover {
text-decoration: none;
background-color: rgb(239, 242, 247);
}

.redactor_separator_drop {
border-top: 1px solid #ddd;
padding: 0;
line-height: 0;
font-size: 0;
}

/* ColorPicker */

.redactor_color_link {
padding: 0;
width: 15px;
height: 15px;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .2) inset; -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .2) inset; -khtml-box-shadow: 0 1px 2px rgba(0, 0, 0, .2) inset; box-shadow: 0 1px 2px rgba(0, 0, 0, .2) inset;
-webkit-border-radius: 4px; -moz-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px;
float: left;
margin: 2px;
font-size: 0;
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;
}

.redactor_color_none {
font-size: 11px;
clear: both;
}



/* MODAL */
#redactor_modal_overlay {
position: fixed;
margin: auto;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 209998;

opacity: 0.6;
filter: alpha(opacity='60');

background-color: rgb(255, 255, 255);
}

#redactor_modal {
padding: 0;
position: fixed;
top: 50%;
z-index: 209999;
}

#redactor_modal_close {
overflow: hidden;
text-indent: -9999px;
cursor: pointer;
background-image: url('styles/it4rvn/xenforo/overlay/close.png');
position: absolute;
right: 4px;
top: 4px;
cursor: pointer;
z-index: 99;
width: 35px;
height: 35px;

}

#redactor_tabs {
margin-bottom: 18px;
text-align: center;
}

#redactor_tabs a {
display: inline-block;
border: 1px solid #d8d8d8;
padding: 4px 14px;
font-size: 12px;
background-color: #ccc;
text-decoration: none;
color: #555;
line-height: 1;
-webkit-border-radius: 5px; -moz-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px;
margin-right: 5px;
}

#redactor_tabs a:hover, #redactor_tabs a.redactor_tabs_act {
background-color: #eee;
padding: 5px 15px;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .4) inset; -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .4) inset; -khtml-box-shadow: 0 1px 2px rgba(0, 0, 0, .4) inset; box-shadow: 0 1px 2px rgba(0, 0, 0, .4) inset;
border: none;
text-shadow: 0 0 0 transparent, 0 1px 0 #eee;
color: #777;
text-decoration: none;
}

.redactor_editor_drop {
display: none;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
border: 2px dashed #aaa;
color: #000;
background: url(rgba.php?r=190&g=190&b=190&a=127); background: rgba(190, 190, 190, .5); _filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#7FBEBEBE,endColorstr=#7FBEBEBE);
}

.redactor_editor_drop.dragDisabled
{
background: url(rgba.php?r=190&g=140&b=140&a=127); background: rgba(190, 140, 140, .5); _filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#7FBE8C8C,endColorstr=#7FBE8C8C);
border-color: rgb(150, 75, 75);
}

.redactor_editor_drop span {
display: block;
text-align: center;
position: absolute;
top: 50%;
width: 100%;
font-size: 18px;
line-height: 26px;
margin-top: -13px;
}

.redactor_editor_drop.hover {
display: block;
}


/* Drag and Drop Area */
.redactor_droparea {
position: relative;
width: 100%;
margin: auto;
margin-bottom: 5px;
}
.redactor_droparea .redactor_dropareabox {
z-index: 1;
position: relative;
text-align: center;
width: 99%;
background-color: #fff;
padding: 60px 0;
border: 2px dashed #bbb;
}
.redactor_droparea .redactor_dropareabox, .redactor_dropalternative {
color: #555;
font-size: 12px;
}
.redactor_dropalternative {
margin: 4px 0 2px 0;
}
.redactor_dropareabox.hover {
background: #efe3b8;
border-color: #aaa;
}
.redactor_dropareabox.error {
background: #f7e5e5;
border-color: #dcc3c3;
}
.redactor_dropareabox.drop {
background: #f4f4ee;
border-color: #e0e5d6;
}


Mình add vào sao chỉ thấy có 4 icon đó còn lại mất tiêu @@
 
Sửa lần cuối:

Mr.Yellow

Gefreiter
Tham gia
24/06/2015
Bài viết
99
Được Like
106
Mình add vào sao chỉ thấy có 4 icon đó còn lại mất tiêu @@
Bạn add đoạn này vào cuối css nhé :) Phần trên giữ nguyên.

html .redactor_toolbar li a.redactor_btn_custom_error
{
background-image: url('styles/Kalco/notification/editor_icons/error-icon.png');

}



html .redactor_toolbar li a.redactor_btn_custom_information
{
background-image: url('styles/Kalco/notification/editor_icons/information-icon.png');

}



html .redactor_toolbar li a.redactor_btn_custom_success
{
background-image: url('styles/Kalco/notification/editor_icons/success-icon.png');

}



html .redactor_toolbar li a.redactor_btn_custom_warning
{
background-image: url('styles/Kalco/notification/editor_icons/warning-icon.png');

}
 

Hướng dẫn sử dụng

XenForo 1 XenForo 2
Translate by PVS

Dịch vụ XenForo của VNXF

Mr. Tuấn

Mobile/Zalo: 0988 488 096

Telegram: bluekpro

Email: [email protected]

Nhà Tài Trợ

Mút Xốp Không Gian
pallet Thịnh Phát
Top Bottom