Бормотухи.НЕТ

Наши файлы Пользователи Календарь Новые сообщения [Без флейма] F.A.Q. Игры для андроид
Вернуться   Бормотухи.НЕТ > Web-мастеру > vBulletin 3.х > Инструкции по vBulletin
Перезагрузить страницу Alert Box (Оформление предупреждений)
Расширенный поиск
Правила форума Регистрация Все альбомы Сообщения за день

Инструкции по vBulletin Всевозможные мануалы, FAQ и инструкции по vBulletin

Ответ
 
Опции темы Поиск в этой теме
Старый 29.04.2009, 12:07 Вверх   #1
Коварный тип
 
Аватар для Serberg
Serberg вне форума
Доп. информация
Хорошо Alert Box (Оформление предупреждений)
Alert Box (Оформление предупреждений)


  • Скачиваем вложение и заливаем в папку /images/misc/
  • Идем в Админку -> Дополнительные BB коды -> Добавить BB коды:

Бокс информации:
Нажми для просмотра
Заголовок: Information
Название BB кода: Information
Замена:

Код:
<style>
.information-box
{
	color: #000;
	border: 1px solid #000;
	-moz-border-radius: 5px;
	background-color: #FCF8C7;
	padding: 6px;
	text-align:left;
}

.warning-box img,
.information-box img
{
	float:left;
	margin-top: 10px;
	margin-right: 5px;
	vertical-align:middle;
	border: 0px;
}

.warning-box h2,
.warning-box p,
.information-box h2,
.information-box p
{
	padding: 0px;
	margin:  0px;
	margin-left: 60px;
}

.warning-box h2,
.information-box h2
{
	padding-bottom: 4px;
	font-size: 14px;
	border-bottom: 1px solid #000;
}

.warning-box h1,
.information-box h1
{
	padding: 0px;
	margin:  0px;
	margin-left: 60px;
	font-size: 12px;
        font-weight:normal;
}

.warning-box h6,
.information-box h6
{

	margin:  20px;
	padding: 0px;
	margin-left: 60px;
	font-size: 12px;
        font-weight:normal;
}

.warning-box
{
	background-color: #FFCCCC;
}

.warning-box ul
{
	margin-left: 30px;
}
.codemain {
	BORDER-RIGHT: #000 1px dotted; PADDING-RIGHT: 2px; BORDER-TOP: #000 1px dotted; PADDING-LEFT: 2px; BACKGROUND: #fafcfe; PADDING-BOTTOM: 2px; MARGIN: 0px auto; BORDER-LEFT: #000 1px dotted; COLOR: #465584; PADDING-TOP: 2px; BORDER-BOTTOM: #000 1px dotted; FONT-FAMILY: Courier, Courier New, Verdana, Arial
</style>


<div class='information-box'>
 <img src='./images/misc/information.gif' alt='information' />
 <h2><strong>Информация</strong></h2>
<h1><font color="#000000">{param}</font></h1>
<br><br>
</div>
Пример: [info]Так будет выглядеть информация с использованием этого BB кода[/info]
Описание: Используется для выделения полезной и важной информации.
Изображение кнопки: ./images/misc/bbc_info.gif


Бокс Уведомление
Нажми для просмотра
Заголовок: Notice
Название BB кода: Notice
Замена:

Код:
<style>
.information-box
{
	color: #000;
	border: 1px solid #000;
	-moz-border-radius: 5px;
	background-color: #FCF8C7;
	padding: 6px;
	text-align:left;
}

.warning-box img,
.information-box img
{
	float:left;
	margin-top: 10px;
	margin-right: 5px;
	vertical-align:middle;
	border: 0px;
}

.warning-box h2,
.warning-box p,
.information-box h2,
.information-box p
{
	padding: 0px;
	margin:  0px;
	margin-left: 60px;
}

.warning-box h2,
.information-box h2
{
	padding-bottom: 4px;
	font-size: 14px;
	border-bottom: 1px solid #000;
}

.warning-box h1,
.information-box h1
{
	padding: 0px;
	margin:  0px;
	margin-left: 60px;
	font-size: 12px;
        font-weight:normal;
}

.warning-box h6,
.information-box h6
{

	margin:  20px;
	padding: 0px;
	margin-left: 60px;
	font-size: 12px;
        font-weight:normal;
}

.warning-box
{
	background-color: #FFCCCC;
}

.warning-box ul
{
	margin-left: 30px;
}
.codemain {
	BORDER-RIGHT: #000 1px dotted; PADDING-RIGHT: 2px; BORDER-TOP: #000 1px dotted; PADDING-LEFT: 2px; BACKGROUND: #fafcfe; PADDING-BOTTOM: 2px; MARGIN: 0px auto; BORDER-LEFT: #000 1px dotted; COLOR: #465584; PADDING-TOP: 2px; BORDER-BOTTOM: #000 1px dotted; FONT-FAMILY: Courier, Courier New, Verdana, Arial
</style>


<div class='information-box'>
 <img src='./images/misc/notice.gif' alt='information' />
 <h2><strong>Уведомление</strong></h2>
<h1><font color="#000000">{param}</font></h1>
<br><br>
</div>
Пример: [notice]Так будет выглядеть уведомление[/notice]
Описание: Используется для важных уведомлений.
Изображение кнопки: ./images/misc/bbc_notice.gif


Бокс Предупреждение
Нажми для просмотра
Заголовок: Warning
Название BB кода: Warning
Замена:
Код:
<style>
.warning-box,
.information-box
{
	color: #000;
	border: 1px solid #000;
	-moz-border-radius: 5px;
	background-color: #FCF8C7;
	padding: 6px;
	text-align:left;
}

.warning-box img,
.information-box img
{
	float:left;
	margin-top: 10px;
	margin-right: 5px;
	vertical-align:middle;
	border: 0px;
}

.warning-box h2,
.warning-box p,
.information-box h2,
.information-box p
{
	padding: 0px;
	margin:  0px;
	margin-left: 60px;
}

.warning-box h2,
.information-box h2
{
	padding-bottom: 4px;
	font-size: 14px;
	border-bottom: 1px solid #000;
}

.warning-box h1,
.information-box h1
{
	padding: 0px;
	margin:  0px;
	margin-left: 60px;
	font-size: 12px;
        font-weight:normal;
}

.warning-box h6,
.information-box h6
{

	margin:  20px;
	padding: 0px;
	margin-left: 60px;
	font-size: 12px;
        font-weight:normal;
}

.warning-box
{
	background-color: #FFCCCC;
}

.warning-box ul
{
	margin-left: 30px;
}
</style>


<div class='warning-box'>
<img src='./images/misc/warning.gif' alt='warning' />
<h2><strong>Предупреждение</strong></h2>
<h1><font color="#000000">{param}</font></h1>
<br><br>
</div>
Пример: [notice]Так будет выглядеть предупреждающее сообщение[/notice]
Описание: Используется для предупреждений.
Изображение кнопки: ./images/misc/bbc_warning.gif


Бокс Внимание
Нажми для просмотра
Заголовок: Attention
Название BB кода: Attention
Замена:
Код:
<style>
.information-box
{
	color: #000;
	border: 1px solid #000;
	-moz-border-radius: 5px;
	background-color: #FCF8C7;
	padding: 6px;
	text-align:left;
}

.warning-box img,
.information-box img
{
	float:left;
	margin-top: 10px;
	margin-right: 5px;
	vertical-align:middle;
	border: 0px;
}

.warning-box h2,
.warning-box p,
.information-box h2,
.information-box p
{
	padding: 0px;
	margin:  0px;
	margin-left: 60px;
}

.warning-box h2,
.information-box h2
{
	padding-bottom: 4px;
	font-size: 14px;
	border-bottom: 1px solid #000;
}

.warning-box h1,
.information-box h1
{
	padding: 0px;
	margin:  0px;
	margin-left: 60px;
	font-size: 12px;
        font-weight:normal;
}

.warning-box h6,
.information-box h6
{

	margin:  20px;
	padding: 0px;
	margin-left: 60px;
	font-size: 12px;
        font-weight:normal;
}

.warning-box
{
	background-color: #FFCCCC;
}

.warning-box ul
{
	margin-left: 30px;
}
.codemain {
	BORDER-RIGHT: #000 1px dotted; PADDING-RIGHT: 2px; BORDER-TOP: #000 1px dotted; PADDING-LEFT: 2px; BACKGROUND: #fafcfe; PADDING-BOTTOM: 2px; MARGIN: 0px auto; BORDER-LEFT: #000 1px dotted; COLOR: #465584; PADDING-TOP: 2px; BORDER-BOTTOM: #000 1px dotted; FONT-FAMILY: Courier, Courier New, Verdana, Arial
</style>


<div class='information-box'>
 <img src='./images/misc/attention.gif' alt='information' />
 <h2><strong>Внимание</strong></h2>
<h1><font color="#000000">{param}</font></h1>
<br><br>
</div>
Пример: [notice]Внимание! Внимание![/notice]
Описание: Используется для различных объявлений и т.п..
Изображение кнопки: ./images/misc/bbc_attention.gif


Бокс Help
Нажми для просмотра
Заголовок: Help
Название BB кода: Help
Замена:
Код:
<style>
.help-box,
.information-box
{
	color: #000;
	border: 1px solid #000;
	-moz-border-radius: 5px;
	background-color: #d5eeb6;
	padding: 6px;
	text-align:left;
}

.help-box img,
.information-box img
{
	float:left;
	margin-top: 10px;
	margin-right: 5px;
	vertical-align:middle;
	border: 0px;
}

.help-box h2,
.help-box p,
.information-box h2,
.information-box p
{
	padding: 0px;
	margin:  0px;
	margin-left: 60px;
}

.help-box h2,
.information-box h2
{
	padding-bottom: 4px;
	font-size: 14px;
	border-bottom: 1px solid #000;
}

.help-box h1,
.information-box h1
{
	padding: 0px;
	margin:  0px;
	margin-left: 60px;
	font-size: 12px;
        font-weight:normal;
}

.help-box h6,
.information-box h6
{

	margin:  20px;
	padding: 0px;
	margin-left: 60px;
	font-size: 12px;
        font-weight:normal;
}

.help-box
{
	background-color: #d5eeb6;
}

.help-box ul
{
	margin-left: 30px;
}
</style>


<div class='help-box'>
<img src='./images/misc/help.gif' alt='warning' />
<h2><strong>Help</strong></h2>
<h1><font color="#000000">{param}</font></h1>
<br><br>
</div>
Пример: [notice]Помогите пожалуйста![/notice]
Описание: Используется для сообщений о помощи
Изображение кнопки: ./images/misc/bbc_help.gif




Пример работы одного из боксов:

information

Внимание


Вот пример работы бокса Внимание!






ps
Для добавления иконки использования кодов нужно открыть соответствующий шаблон куда к примеру хотите ставить и среди прочих иконок воткнуть код:

Код:
<td><div class="imagebutton" id="{$editorid}_cmd_wrap0_attention"><img src="$stylevar[imgdir_editor]/bbc_attention.gif" width="21" height="20" alt="Сделать текст важным" /></div></td>
Этот код относиться к ББкоду Бокс Внимание. Я думаю там разберетесь по примеру как оно вставляется.
Вложения
Тип файла: rar Alert box.rar (29.4 Кб, 128 просмотров)
Последний раз редактировалось Serberg; 09.02.2010 в 10:17..
  Ответить с цитированием
11 пользователя(ей) сказали cпасибо:
Старый 10.05.2009, 22:38 Вверх   #2
Коварный тип
 
Аватар для Serberg
Serberg вне форума
Доп. информация
Хорошо Еще четыре BB-кода от GiveMeABreak
Еще четыре BB-кода от GiveMeABreak



Установка:
  1. Залить все файлы из папки Upload в вашу папку с форумом.
  2. Идем в админку > Стили и шаблоны > Управление стилями > Ваш стиль > Основная таблица CSS и в самом низу есть Дополнительные определения CSS, и во второй блок прописываем:

Код:
.note-classic,.note-important,.note-warning,.note-tip{margin:2em;margin-left:auto;margin-right:auto;width:70%!important;min-height:40px;clear:both;text-align:justify;vertical-align:middle;border-collapse:collapse;padding:15px 20px 15px 80px;background-position:20px 50%;background-repeat:no-repeat;-moz-border-radius:20px;-khtml-border-radius:20px;-webkit-border-radius:20px;border-radius:20px;}
.note-classic{background-color:#eef;background-image:url(images/bbcodes/note.png);}
.note-important{background-color:#ffc;background-image:url(images/bbcodes/important.png);}
.note-warning{background-color:#fdd;background-image:url(images/bbcodes/warning.png);}
.note-tip{background-color:#dfd;background-image:url(images/bbcodes/tip.png);}
и сохраняем.

Админка > Дополнительные BB коды > Добавить BB Коды, и повторяем это действие для каждого ББ кода.

1 BB код:



Нажми для просмотра
Заголовок: IMPORTANT
Название BB кода: IMPORTANT
Замена: <div class="note-important"><b>{param}</b></div>
Пример: [IMPORTANT]Пример[/IMPORTANT]
Использовать опцию: Нет
Изображение кнопки: images/bbcodes/important_button.png
И сохраняем.


2 BB код:



Нажми для просмотра
Заголовок: NOTE
Название BB кода: NOTE
Замена: <div class="note-classic"><b>{param}</b></div>
Пример: [NOTE]Пример[/NOTE]
Использовать опцию: Нет
Изображение кнопки: images/bbcodes/note_button.png
И сохраняем.


3 BB код:



Нажми для просмотра
Заголовок: TIP
Название BB кода: TIP
Замена: <div class="note-tip"><b>{param}</b></div>
Пример: [TIP]Пример[/TIP]
Использовать опцию: Нет
Изображение кнопки: images/bbcodes/tip_button.png
И сохраняем.



4 BB код:



Нажми для просмотра
Заголовок: WARNING
Название BB кода: WARNING
Замена: <div class="note-warning"><b>{param}</b></div>
Пример: [WARNING]Пример[/WARNING]
Использовать опцию: Нет
Изображение кнопки: images/bbcodes/warning_button.png
И сохраняем.


Вид кнопок для добавления кода:



Скачать файлы к моду:
BBCodes by GiveMeABreak (34.3 Кб)
Последний раз редактировалось Serberg; 10.03.2012 в 17:29..
  Ответить с цитированием
6 пользователя(ей) сказали cпасибо:
Старый 28.10.2009, 16:09 Вверх   #3
Старший модератор
 
Аватар для Ghost
Ghost вне форума
Доп. информация
По умолчанию
Доброго время суток. Подскажите плиз ,вот в панели админа добавляю вв код,но он не пашет. Почему и что надо сделать что бы он фурычил? ВВ коды вкл. Заранее спасибо.
  Ответить с цитированием
Старый 29.10.2009, 00:09 Вверх   #4
Коварный тип
 
Аватар для Serberg
Serberg вне форума
Доп. информация
По умолчанию
ghost, если все по инструкции сделал. То должно работать 100%.


information

Внимание

Вот тебе пример.
  Ответить с цитированием
Старый 29.10.2009, 17:49 Вверх   #5
Старший модератор
 
Аватар для Ghost
Ghost вне форума
Доп. информация
По умолчанию
Разобрался,все вышло.
  Ответить с цитированием
Старый 03.12.2009, 11:55 Вверх   #6
Новичок
 
Аватар для phoenix
phoenix вне форума
Доп. информация
По умолчанию
Скажите, а можно сделать так, чтобы этими дополнительными кодами могли пользоваться только модераторы и администраторы? Если да, то как?
  Ответить с цитированием
Старый 03.12.2009, 13:36 Вверх   #7
Коварный тип
 
Аватар для Serberg
Serberg вне форума
Доп. информация
По умолчанию
Цитата Сообщение от phoenix Посмотреть сообщение
Скажите, а можно сделать так, чтобы этими дополнительными кодами могли пользоваться только модераторы и администраторы? Если да, то как?
Нет. проще воспользоваться специальным хаком. Вроде называется комментарий администратора. У меня такова нет но у TAIFUN'a вроде был.
  Ответить с цитированием
Cказали cпасибо:
Старый 27.08.2010, 19:34 Вверх   #8
forever alone
 
Аватар для no name
no name вне форума
Доп. информация
По умолчанию
спасибо,все работает
  Ответить с цитированием
Старый 29.08.2010, 21:44 Вверх   #9
Новичок
 
Аватар для spinner
spinner вне форума
Доп. информация
По умолчанию
отличный мануал. спасибо
  Ответить с цитированием
Ответ

Метки
bb code, оформление сообщений, переоформление

« Предыдущая тема | Следующая тема »

Ваши права в разделе
Вы не можете создавать новые темы
Вы не можете отвечать в темах
Вы не можете прикреплять вложения
Вы не можете редактировать свои сообщения
BB коды Вкл.
Смайлы Вкл.
[IMG] код Вкл.
HTML код Выкл.
Быстрый переход

Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Красивое оформление текста NuRt1ck CSS и HTML 7 09.06.2011 14:53
Полетело оформление wolf blan vBulletin 4.x 11 19.03.2011 11:37
оформление на заказ! nick378 Доска объявлений 0 11.03.2011 18:57
Вконтакте.. Оформление. Maaz Сети 1 05.01.2011 21:54
Оформление сайта zagoleg Сайтостроение 7 20.10.2010 17:16


Текущее время: 08:22. Часовой пояс GMT +3.

Обратная связь - Архив - Вверх

Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2024, vBulletin Solutions, Inc. Перевод: zCarot
 

Время генерации страницы 0.17052 секунды с 15 запросами