Advanced Message Editor Boxes

Posted 2 апреля, 20178 yr

Advanced Message Editor Boxes

Этот плагин расширяет Suites редактор Реализации поддержки для сообщений коробков. Коробки сообщений являются полезными для любого сообщества, они позволяют вам и членам вашей легко и эстетическом Выделите предупреждения или любой другой общей информации.

Особенности

Добавить 7 различных типов сообщений
Выберите цвет для каждого сообщения коробок
Каждое сообщение Box имеет ширину: -moz-Fit-контент; Элемент Что означает, что размер окна будет зависеть, как долго сообщение

Как установить

Загрузить и установить XML-файл с плагином раздел в панели администратора
Перейти к Кастомизация -> Панели инструментов и добавить кнопку
Загрузить Либо AMB_box.zip Or AMB_box_Dark.zip In The CKEditor Upload Раздел Plugin

Добавил

Silence
Добавлено

02.04.2017
Категория

Интерфейс
Язык

Язык: eng

Цитата

2 апреля, 20178 yr

Подскажите пожалуйста возможно ли вывести в этих сообщениях "Аватар и ник" модератора кто выдал?

Цитата

20 марта, 20187 yr

Установи плагин, всё сделал по инструкции. Захожу в тему, добавляю и ничего нету и не происходит.

Я что-то накосячил?

Цитата

20 марта, 20187 yr

50 минут назад, DeveZor_X сказал:

Установи плагин, всё сделал по инструкции. Захожу в тему, добавляю и ничего нету и не происходит.

Я что-то накосячил?

нужно больше подробностей

Цитата

20 марта, 20187 yr

3 минуты назад, WOLF сказал:

нужно больше подробностей

Установил плагин, добавил кнопку, кнопка отображается.
Теперь сама проблема, захожу в тему, хочу проверить этот плагин, выбираю например "информация" жму "Ок" и ничего не появляется, просто ничего нету.

Вот скрин, я выбрал, нажал ок и ничего нету..... Просто вниз строку перемещает и всё.

Спойлер

Цитата

20 марта, 20187 yr

1 минуту назад, DeveZor_X сказал:

Установил плагин, добавил кнопку, кнопка отображается.
Теперь сама проблема, захожу в тему, хочу проверить этот плагин, выбираю например "информация" жму "Ок" и ничего не появляется, просто ничего нету.

Вот скрин, я выбрал, нажал ок и ничего нету..... Просто вниз строку перемещает и всё.

Скрыть контент

кеш форума очищаем на дефолтовом стиле проверяем

Цитата

20 марта, 20187 yr

2 минуты назад, WOLF сказал:

кеш форума очищаем на дефолтовом стиле проверяем

Извиняюсь спросить, а где очистить кеш форума?

Цитата

20 марта, 20187 yr

3 минуты назад, DeveZor_X сказал:

Извиняюсь спросить, а где очистить кеш форума?

Цитата

DeveZor_X
1

20 марта, 20187 yr

5 минут назад, WOLF сказал:

Кеш очистил, вкл дефолтный стиль ошибка та же. Может с плагином что-то не так? Или во время установки плагина ошибка какая-то бывает...

Цитата

20 марта, 20187 yr

Почистил кеш браузера, удалил весь плагин этот и установил с нуля и всё работает.
Есть примеры или советы как и где ковырять чтобы выглядел как-то так?

Пример:

Спойлер

Цитата

20 марта, 20187 yr

2 часа назад, DeveZor_X сказал:

Почистил кеш браузера, удалил весь плагин этот и установил с нуля и всё работает.
Есть примеры или советы как и где ковырять чтобы выглядел как-то так?

Пример:

Показать контент

Идём по пути mysite.ru/applications/core/interface/ckeditor/ckeditor/plugins/ipsbox/

Откроем plugin.js и в 20 или 21 строчке меняем

CKEDITOR.addCss( ".ipsMessage_error:before,.ipsMessage_general:before,.ipsMessage_info:before,.ipsMessage_information:before,.ipsMessage_success:before,.ipsMessage_warning:before{conent:''}.ipsMessage{padding:15px 15px 15px 45px;border-radius:2px;position:relative;margin-bottom:10px;color:#fff}html[dir=rtl] .ipsMessage{padding:15px 45px 15px 15px}.ipsMessage:before{font-family:FontAwesome;position:absolute;top:15px;font-size:20px}html[dir=ltr] .ipsMessage:before{left:15px}html[dir=rtl] .ipsMessage:before{right:15px}.ipsMessage a{color:#fff;border-bottom:1px dotted #fff}.ipsMessage_title{margin:0 0 5px;padding:0;font-size:16px;line-height:1}.ipsMessage a.ipsButton{margin-top:-5px}.ipsMessage_code{padding:7px;display:inline-block;background:rgba(0,0,0,.2);border-radius:3px;margin-top:-7px;color:rgba(255,255,255,.8)}html[dir=rtl] .ipsMessage_code{margin-right:-7px;float:left;margin-left:-7px}.ipsMessage_error{background:#b52b38}.ipsMessage_success{background:#dbe2c9;color:#556b45}.ipsMessage_success.ipsMessage a:not(.ipsButton){color:#556b45;border-bottom:1px dotted #556b45}.ipsMessage_warning{background:#ede6e0;color:#564a3f}.ipsMessage_warning.ipsMessage a:not(.ipsButton){color:#564a3f;border-bottom:1px dotted #564a3f}.ipsMessage_info,.ipsMessage_information{background:#5e707d}.ipsMessage_general{background:#ebebeb;color:#333}.ipsMessage_general.ipsMessage a:not(.ipsButton){color:#333;border-bottom:1px dotted #333}" );

На

CKEDITOR.addCss("");

Далее. Админ-панель->Кастомизации->Темы->Редактировать HTML и CSS->Вкладка CSS->core->global->framework->messages.css и меняем все содержимое на

.ipsMessage {
padding: 15px 15px 15px 45px;
border-radius: 6px;
position: relative;
margin: 25px 5px 0 5px;
color: #fff;
text-shadow: 1px 1px 0px rgba(0,0,0,0.1);
}
html[dir="rtl"] .ipsMessage {
padding: 15px 45px 15px 15px;
}
.ipsMessage:before {
font-family: 'FontAwesome';
position: absolute;
font-size: 20px;
}
html[dir="rtl"] .ipsMessage:before {
right: 15px;
}
.ipsMessage a {
color: #fff;
border-bottom: 1px dotted #fff;
}
.ipsMessage_title {
margin: 0;
padding: 0;
font-size: 16px;
line-height: 1;
margin-bottom: 5px;
}
.ipsMessage a.ipsButton {
margin-top: -5px;
}
html[dir] .ipsMessage .ipsButton_link {
border-color: #fff;
color: #fff;
opacity: 0.7;
}
.ipsMessage_code {
padding: 7px;
display: inline-block;
background: rgba(0,0,0,0.2);
border-radius: 3px;
margin-top: -7px;
color: rgba(255,255,255,0.8);
}
html[dir="rtl"] .ipsMessage_code {
float: left;
margin-right: -7px;
}
html[dir="rtl"] .ipsMessage_code {
float: left;
margin-left: -7px;
}
.ipsMessage_error {
background: #CB4332;
}
.ipsMessage_error:before {
content: '\f06a';
top: -15px;
left: -15px;
background: #CB4332;
border-radius: 50px;
font-size: 14px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
}
.ipsMessage_success {
background: #55AA66;
}
.ipsMessage_success:before {
content: '\f00c';
top: -15px;
left: -15px;
background: #55AA66;
border-radius: 50px;
font-size: 14px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
}
.ipsMessage_warning {
background: #d87c4f;
}
.ipsMessage_warning:before {
content: '\f071';
top: -15px;
left: -15px;
background: #d87c4f;
border-radius: 50px;
font-size: 14px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
}
.ipsMessage_info, .ipsMessage_information {
background: #1B4970;
}
.ipsMessage_info:before, .ipsMessage_information:before {
content: '\f05a';
top: -15px;
left: -15px;
background: #1B4970;
border-radius: 50px;
font-size: 14px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
}
.ipsMessage_general {
background: #7f858d;
}
.ipsMessage_general:before {
content: '\f05a';
top: -15px;
left: -15px;
background: #7f858d;
border-radius: 50px;
font-size: 14px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
}

Получим такой вид

Цитата

21 марта, 20187 yr

9 часов назад, akmaltilloev сказал:

Идём по пути mysite.ru/applications/core/interface/ckeditor/ckeditor/plugins/ipsbox/

Откроем plugin.js и в 20 или 21 строчке меняем

Скрыть контент



CKEDITOR.addCss( ".ipsMessage_error:before,.ipsMessage_general:before,.ipsMessage_info:before,.ipsMessage_information:before,.ipsMessage_success:before,.ipsMessage_warning:before{conent:''}.ipsMessage{padding:15px 15px 15px 45px;border-radius:2px;position:relative;margin-bottom:10px;color:#fff}html[dir=rtl] .ipsMessage{padding:15px 45px 15px 15px}.ipsMessage:before{font-family:FontAwesome;position:absolute;top:15px;font-size:20px}html[dir=ltr] .ipsMessage:before{left:15px}html[dir=rtl] .ipsMessage:before{right:15px}.ipsMessage a{color:#fff;border-bottom:1px dotted #fff}.ipsMessage_title{margin:0 0 5px;padding:0;font-size:16px;line-height:1}.ipsMessage a.ipsButton{margin-top:-5px}.ipsMessage_code{padding:7px;display:inline-block;background:rgba(0,0,0,.2);border-radius:3px;margin-top:-7px;color:rgba(255,255,255,.8)}html[dir=rtl] .ipsMessage_code{margin-right:-7px;float:left;margin-left:-7px}.ipsMessage_error{background:#b52b38}.ipsMessage_success{background:#dbe2c9;color:#556b45}.ipsMessage_success.ipsMessage a:not(.ipsButton){color:#556b45;border-bottom:1px dotted #556b45}.ipsMessage_warning{background:#ede6e0;color:#564a3f}.ipsMessage_warning.ipsMessage a:not(.ipsButton){color:#564a3f;border-bottom:1px dotted #564a3f}.ipsMessage_info,.ipsMessage_information{background:#5e707d}.ipsMessage_general{background:#ebebeb;color:#333}.ipsMessage_general.ipsMessage a:not(.ipsButton){color:#333;border-bottom:1px dotted #333}" );

На

CKEDITOR.addCss("");

Далее. Админ-панель->Кастомизации->Темы->Редактировать HTML и CSS->Вкладка CSS->core->global->framework->messages.css и меняем все содержимое на

Показать контент



.ipsMessage {
padding: 15px 15px 15px 45px;
border-radius: 6px;
position: relative;
margin: 25px 5px 0 5px;
color: #fff;
text-shadow: 1px 1px 0px rgba(0,0,0,0.1);
}
html[dir="rtl"] .ipsMessage {
padding: 15px 45px 15px 15px;
}
.ipsMessage:before {
font-family: 'FontAwesome';
position: absolute;
font-size: 20px;
}
html[dir="rtl"] .ipsMessage:before {
right: 15px;
}
.ipsMessage a {
color: #fff;
border-bottom: 1px dotted #fff;
}
.ipsMessage_title {
margin: 0;
padding: 0;
font-size: 16px;
line-height: 1;
margin-bottom: 5px;
}
.ipsMessage a.ipsButton {
margin-top: -5px;
}
html[dir] .ipsMessage .ipsButton_link {
border-color: #fff;
color: #fff;
opacity: 0.7;
}
.ipsMessage_code {
padding: 7px;
display: inline-block;
background: rgba(0,0,0,0.2);
border-radius: 3px;
margin-top: -7px;
color: rgba(255,255,255,0.8);
}
html[dir="rtl"] .ipsMessage_code {
float: left;
margin-right: -7px;
}
html[dir="rtl"] .ipsMessage_code {
float: left;
margin-left: -7px;
}
.ipsMessage_error {
background: #CB4332;
}
.ipsMessage_error:before {
content: '\f06a';
top: -15px;
left: -15px;
background: #CB4332;
border-radius: 50px;
font-size: 14px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
}
.ipsMessage_success {
background: #55AA66;
}
.ipsMessage_success:before {
content: '\f00c';
top: -15px;
left: -15px;
background: #55AA66;
border-radius: 50px;
font-size: 14px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
}
.ipsMessage_warning {
background: #d87c4f;
}
.ipsMessage_warning:before {
content: '\f071';
top: -15px;
left: -15px;
background: #d87c4f;
border-radius: 50px;
font-size: 14px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
}
.ipsMessage_info, .ipsMessage_information {
background: #1B4970;
}
.ipsMessage_info:before, .ipsMessage_information:before {
content: '\f05a';
top: -15px;
left: -15px;
background: #1B4970;
border-radius: 50px;
font-size: 14px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
}
.ipsMessage_general {
background: #7f858d;
}
.ipsMessage_general:before {
content: '\f05a';
top: -15px;
left: -15px;
background: #7f858d;
border-radius: 50px;
font-size: 14px;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
}

Получим такой вид

А нормально то, что если нету такой папки "ipsbox" Есть только "AMB_box".

В Файловом Менеджере ввёл в поиск файла "plugin.js" решил так поискать, но такой папки там нету.....

Спойлер

Вот такие только папки есть.

screen1.PNG.7a42b53f64fef99b90f2716f6a71687e.PNG

И в папке AMB_box>plugin.js нету таких строчек.....

Цитата

21 марта, 20187 yr

1 час назад, DeveZor_X сказал:

А нормально то, что если нету такой папки "ipsbox" Есть только "AMB_box".

В Файловом Менеджере ввёл в поиск файла "plugin.js" решил так поискать, но такой папки там нету.....

Скрыть контент

Вот такие только папки есть.

И в папке AMB_box>plugin.js нету таких строчек.....

А у вас точно установлено этот плагин?

Цитата

21 марта, 20187 yr

9 часов назад, akmaltilloev сказал:

А у вас точно установлено этот плагин?

Да, точно этот плагин установлен.

Цитата

22 марта, 20187 yr

10 часов назад, DeveZor_X сказал:

Да, точно этот плагин установлен.

Очень извиняюсь за тупость, этот плагин перепутал с этим

Сейчас посмотрю как реализовать в этом плагине.

Цитата

22 марта, 20187 yr

Админ-панель->Кастомизации->Темы->Редактировать HTML и CSS->Вкладка CSS->core->front->custom->advancedmessageeditorboxes.css и меняем все содержимое на

{{if settings.Message_Box_Width ==1}}
.AMB_Message {
    width: -moz-fit-content;
    width: -webkit-fit-content;
    width: fit-content;
}
{{endif}}
.AMB_Message {
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    color: #ffffff;
    font-family: 'Open Sans', sans-serif;
    margin: 25px 5px 0 5px;
    padding: 15px 15px 15px 45px;
    position: relative;
}
    .AMB_Message:before {
        font-family: 'FontAwesome';
        position: absolute;
        font-size: 20px;
    }
.AMB_Message_success {
    background-color: {setting='AMB_Success_Colour'};
}
    .AMB_Message_success:before {
        content: "\F00C";
          top: -15px;
        left: -15px;
        background: {setting='AMB_Success_Colour'};
        border-radius: 50px;
        font-size: 14px;
        width: 30px;
        height: 30px;
        text-align: center;
        line-height: 30px;
    }
.AMB_Message_tip {
    background-color: {setting='AMB_Tip_Colour'};
}
    .AMB_Message_tip:before {
        content: "\F0EB";
         top: -15px;
        left: -15px;
        background: {setting='AMB_Tip_Colour'};
        border-radius: 50px;
        font-size: 14px;
        width: 30px;
        height: 30px;
        text-align: center;
        line-height: 30px;
    }
.AMB_Message_error {
    background-color: {setting='AMB_Error_Colour'};
}
    .AMB_Message_error:before {
        content: "\F00D";
        top: -15px;
        left: -15px;
        background: {setting='AMB_Error_Colour'};
        border-radius: 50px;
        font-size: 14px;
        width: 30px;
        height: 30px;
        text-align: center;
        line-height: 30px;
    }
.AMB_Message_warning {
    background-color: {setting='AMB_Warning_Colour'};
}
    .AMB_Message_warning:before {
        content: "\F12a";
          top: -15px;
        left: -15px;
        background: {setting='AMB_Warning_Colour'};
        border-radius: 50px;
        font-size: 14px;
        width: 30px;
        height: 30px;
        text-align: center;
        line-height: 30px;
    }
.AMB_Message_information {
    background-color: {setting='AMB_Info_Colour'};
}
    .AMB_Message_information:before {
        content: "\F129";
          top: -15px;
        left: -15px;
        background: {setting='AMB_Info_Colour'};
        border-radius: 50px;
        font-size: 14px;
        width: 30px;
        height: 30px;
        text-align: center;
        line-height: 30px;
    }
.AMB_Message_question {
    background-color: {setting='AMB_Question_Colour'};
}
    .AMB_Message_question:before {
        content: "\F128";
          top: -15px;
        left: -15px;
        background: {setting='AMB_Question_Colour'};
        border-radius: 50px;
        font-size: 14px;
        width: 30px;
        height: 30px;
        text-align: center;
        line-height: 30px;
    }
.AMB_Message_general {
    background-color: {setting='AMB_General_Colour'};
}
    .AMB_Message_general:before {
        content: "\F0A1";
          top: -15px;
        left: -15px;
        background: {setting='AMB_General_Colour'};
        border-radius: 50px;
        font-size: 14px;
        width: 30px;
        height: 30px;
        text-align: center;
        line-height: 30px;
    }

Цитата

DeveZor_X and AlexM
2

23 марта, 20187 yr

В 22.03.2018 в 07:56, akmaltilloev сказал:

Админ-панель->Кастомизации->Темы->Редактировать HTML и CSS->Вкладка CSS->core->front->custom->advancedmessageeditorboxes.css и меняем все содержимое на

Показать контент



{{if settings.Message_Box_Width ==1}}
.AMB_Message {
    width: -moz-fit-content;
    width: -webkit-fit-content;
    width: fit-content;
}
{{endif}}
.AMB_Message {
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    color: #ffffff;
    font-family: 'Open Sans', sans-serif;
    margin: 25px 5px 0 5px;
    padding: 15px 15px 15px 45px;
    position: relative;
}
    .AMB_Message:before {
        font-family: 'FontAwesome';
        position: absolute;
        font-size: 20px;
    }
.AMB_Message_success {
    background-color: {setting='AMB_Success_Colour'};
}
    .AMB_Message_success:before {
        content: "\F00C";
          top: -15px;
        left: -15px;
        background: {setting='AMB_Success_Colour'};
        border-radius: 50px;
        font-size: 14px;
        width: 30px;
        height: 30px;
        text-align: center;
        line-height: 30px;
    }
.AMB_Message_tip {
    background-color: {setting='AMB_Tip_Colour'};
}
    .AMB_Message_tip:before {
        content: "\F0EB";
         top: -15px;
        left: -15px;
        background: {setting='AMB_Tip_Colour'};
        border-radius: 50px;
        font-size: 14px;
        width: 30px;
        height: 30px;
        text-align: center;
        line-height: 30px;
    }
.AMB_Message_error {
    background-color: {setting='AMB_Error_Colour'};
}
    .AMB_Message_error:before {
        content: "\F00D";
        top: -15px;
        left: -15px;
        background: {setting='AMB_Error_Colour'};
        border-radius: 50px;
        font-size: 14px;
        width: 30px;
        height: 30px;
        text-align: center;
        line-height: 30px;
    }
.AMB_Message_warning {
    background-color: {setting='AMB_Warning_Colour'};
}
    .AMB_Message_warning:before {
        content: "\F12a";
          top: -15px;
        left: -15px;
        background: {setting='AMB_Warning_Colour'};
        border-radius: 50px;
        font-size: 14px;
        width: 30px;
        height: 30px;
        text-align: center;
        line-height: 30px;
    }
.AMB_Message_information {
    background-color: {setting='AMB_Info_Colour'};
}
    .AMB_Message_information:before {
        content: "\F129";
          top: -15px;
        left: -15px;
        background: {setting='AMB_Info_Colour'};
        border-radius: 50px;
        font-size: 14px;
        width: 30px;
        height: 30px;
        text-align: center;
        line-height: 30px;
    }
.AMB_Message_question {
    background-color: {setting='AMB_Question_Colour'};
}
    .AMB_Message_question:before {
        content: "\F128";
          top: -15px;
        left: -15px;
        background: {setting='AMB_Question_Colour'};
        border-radius: 50px;
        font-size: 14px;
        width: 30px;
        height: 30px;
        text-align: center;
        line-height: 30px;
    }
.AMB_Message_general {
    background-color: {setting='AMB_General_Colour'};
}
    .AMB_Message_general:before {
        content: "\F0A1";
          top: -15px;
        left: -15px;
        background: {setting='AMB_General_Colour'};
        border-radius: 50px;
        font-size: 14px;
        width: 30px;
        height: 30px;
        text-align: center;
        line-height: 30px;
    }

Спасибо большое за помощь!

Цитата

11 октября, 20195 yr

Здравствуйте, если есть тут кто то живой, как -moz -fit content не подстраивается под текст. Что делать?

Цитата

Sign In

Advanced Message Editor Boxes

Featured Replies

Advanced Message Editor Boxes

Join the conversation

Последние посетители 0

Account

Navigation

Search

Configure browser push notifications

Chrome (Android)

Chrome (Desktop)

Safari (iOS 16.4+)

Safari (macOS)

Edge (Android)

Edge (Desktop)

Firefox (Android)

Firefox (Desktop)