Вебдизайн и Техническая поддержка
Skype: disbb.ru
Контакты: обратная связь
Часы работы:
Пн-Пт 10:00-18:00
* по московскому времени

Полезная информация


Добро пожаловать на форум технической поддержки DisBB.ru! Проект сочетает в себе помощь по дизайну, техническую поддержку и обучение всевозможным нюансам создания, разработки, оформления и раскрутки интернет-проектов.

  • Страница 1 из 1
  • 1
[FAQ] Куда вставлять коды на Mybb форумах?
Offline
Команда DisBB.ru
Сообщений: 19
Репутация: 0
Награды: 0
Дата: Пятница, 25.12.2015, 02:00 Сообщение #1
Куда вставлять коды на Mybb форумах?

Технические специалисты зачастую не указывают, как обращаться с кодами, которые они дают пользователям. Причин тому несколько:
Во-первых, они забывают, так как для них это очевидно.
Во-вторых, они устают говорить одно и то же.
В-третьих, есть коды, которые не надлежит хранить в строго определенном месте, поэтому пользователю должно быть виднее, где ему удобнее вставлять их.

Рассмотрим несколько типов кодов и дадим исчерпывающий ответ на поставленный вопрос.

CSS коды (коды стиля)

• Что это такое?
CSS расшифровывается как Cascading Style Sheetsкаскадные таблицы стилей, это общепризнанный язык описания внешнего вида страниц.

• Как оно выглядит?
Отличить CSS-коды от скриптов и HTML элементарно - у них простой и запоминающийся синтаксис.
Стандартный css-код выглядит так:
Цитата
селектор {свойство: значение;}

Пример (задаем главному меню красный фон):
Цитата
#pun-navlinks {backgroud-color: #FF0000;}

Парочек свойство: значение; у селектора может быть сразу несколько, указываются они через точку с запятой (;):
Цитата
селектор {свойство: значение;
свойство: значение;
свойство: значение;
....
}

Или можно и без переноса на новую строку:
Цитата
селектор {свойство: значение; свойство: значение; свойство: значение;}

Примеры (задаем параметры строки о последней редакции поста):
Цитата
.lastedit {
float: right;
font-size: 0.8em;
font-style: italic;
margin-top: -0.8em !important;
color: blue;
}

Цитата
.lastedit {float: right; font-size: 0.8em; font-style: italic; margin-top: -0.8em !important; color: blue;}

Селекторов тоже может быть много. Они указываются через запятую:
Цитата
.punbb .main h1, .punbb .main h2, #pun-debug h2, .punbb-admin #pun-admain h2 {color: #fff;}


• Куда вставлять?
Во-первых, если код взят в теги <style> - это и есть CSS код.
Например:
Цитата
<style>
#pun-navlinks {backgroud-color: #FF0000;}
</style>

Работать код в таких тегах будет только в HTML-верх.

Если вы не пользуетесь функцией «Свой стиль», то вставлять любые CSS-коды вам надлежит в HTML-верх. При этом указывать теги <style> для каждого кода отдельно не обязательно - достаточно просто перейти на следующую строчку и вставлять новые коды между тегов.

Если у вас есть Свой стиль, то вы можете вставлять CSS-коды без тегов <style> в любое окно стиля.
Главное - вставлять их на отдельной новой строке, а не внутри уже существующих кодов.

Если CSS-код нужно вставить куда-либо еще (например, в html-низ рядом со скриптом), технический специалист вам сообщит об этом. Это нестандартная ситуация.

Скрипты

• Что это такое?
Скрипт - это сценарий, от английского слова Script, он содержит набор инструкций для определенных функций вашего форума, заставляя их «вести себя по-другому».

• Как оно выглядит?
Скрипты распознавать еще проще, чем CSS-коды - Они всегда находятся внутри тегов <script>
например:
Цитата
<script>
var s0="[",s1="<span>[</span>",s2="]",s3="<span>]</span>"
$("#pun-viewtopic div.code-box").each(function (){
var s = $(this).html();s=s.replace(/\[/gm,s1);$(this).html(s.replace(/\]/gm,s3));});
</script>

Или теги могут выглядеть вот так (сути и работы скрипта не меняет):
Цитата
<script type="text/javascript">
var div = document.getElementById('pun-main').getElementsByTagName('div');
for(x in div){
if(div[x].className=='code-box'){
div[x].getElementsByTagName('strong')[0].innerHTML = '<a href="#" onclick="select_text(this.parentNode.parentNode.childNodes[1].getElementsByTagName(\'pre\')[0]); return false;">Выделить код</a>';
}
}
</script>

• Куда вставлять?
Во-первых, в отличие от CSS кодов, нельзя все скрипты пихать между одних тегов <script>! Скрипту всегда нужно говорить, где начинается его работа и где она кончается, не путайте программу!

Во-вторых, следует разделить скрипты на несколько типов, исходя из которых определять их положение:
1. Скрипты, которые что-то добавляют (меню, панели, слайдеры и прочие фишки).
2. Скрипты, которые что-то видоизменяют (это почти все скрипты, которые связаны с работой форума: от запретов гостям до уведомлений о ЛС).
3. Скрипты, которые влияют на форму ответа (это новые BB-теги, дополнения, которые будут отображаться под формой ответа и т.п.).

Первый тип скриптов можно пихать туда же, где вы размещаете HTML-код и само содержимое (CSS-код, кстати, тоже можно запихнуть туда).
Например, если вы вставляете слайдер в объявление, то можно над ним сразу же вставить и скрипт, и стиль слайдера. То же самое и с панелями над форумом (html-верх) или фишками, вставленными на отдельную страницу (администрирование > страницы).

Скрипты, которые что-то видоизменяют (а таких скриптов большинство), всегда находятся в HTML-низ. Обычно по умолчанию под всеми скриптами подразумевается нахождение именно в HTML-низ, а вот если это не так, то технический специалист обязательно скажет, куда вставлять, так как ситуация нестандартная.

Скрипты, которые влияют на форму ответа можно размещать и в HTML-низ, и в окне настроек формы ответа. Разница между этими действиями следующая: гости не видят форму ответа, поэтому им лишние сценарии на странице ни к чему. Скрипты, помещенные в форму ответа, будут работать только у зарегистрированных пользователей.
Если вы поместите скрипт для формы ответа в HTML-низ, он все равно будет работать - ничего страшного не случится.

Как не путаться в кодах?

Вечная проблема новичков - поставят себе код, забудут про него, а потом спрашивают «а почему у меня такие странности на форуме?».
Чтобы этого не было, учимся подписывать скрипты.
Это очень полезно, и этим пользуются все, даже самые опытные админы, которые сами пишут скрипты (просто потому что удобнее прочитать пометку, чем вникать, что же делает этот код). Еще одно достоинство - быстрый поиск интересующего скрипта или кода. Например, подписал код цветовыделения ников, а потом при необходимости убрать/добавить ник просто жмешь CTRL+F и вбиваешь в строке поиска название из пометки, чтобы оказаться в интересующей части настроек.

Как подписать скрипт
В окнах настроек администрирования (и вообще везде, где действуют скрипты и html, хоть на страницах) можно пользоваться следующим кодом пометок:
Цитата
<!-- тут ваш комментарий -->


Пример:
Цитата
<!-- иконка в браузер -->
<link rel="SHORTCUT ICON" href="http://forumdts.org/uploads/0007/e3/f7/60798-1.png" type="image/x-icon">
<link rel="shortcut icon" href="http://forumdts.org/uploads/0007/e3/f7/60798-1.png" type="image/vnd.microsoft.icon">
<link rel="icon" href="http://forumdts.org/uploads/0007/e3/f7/60798-1.png" type="image/vnd.microsoft.icon">


Как подписать CSS код
CSS коды можно подписывать в Администрирование > Свой стиль или внутри тегов <style>.
Делается это кодом:
Цитата
/* тут ваш комментарий */


Пример:
Цитата
<!--цветовыделение-->
<style>
/* админы */
a[href$="/profile.php?id=2"] {color: red !important;}
a[href*="javascript:to('Герда')"] {color: red !important;}
a[href$="/profile.php?id=478"] {color: red !important;}
a[href*="javascript:to('sadhaka')"] {color: red !important;}
/* модеры */
a[href$="/profile.php?id=5199"] {color: blue !important;}
a[href*="javascript:to('Fover')"] {color: blue !important;}
a[href$="/profile.php?id=3697"] {color: blue !important;}
a[href*="javascript:to('Пернатый')"] {color: blue !important;}
</style>
     
  • Страница 1 из 1
  • 1
Поиск:

Сайт создан в системе uCoz