Если вы решились обзавестись собственным форумом, но вам мало или почти ничего не известно о том, что это такое и как с ним управляться, то вам может помочь ниже написанное. Выберите себе систему изучения форума и начинайте методично преодолевать ступень знаний за ступенью.

Представьте себе. Сервис MyBB - это город. В нем есть районы (это партнерские сервисы MyBB), а в районах - гигантские многоквартирные дома, которые в нашей аналогии являются доменами, где каждая квартира - отдельный форум, живущий по адресу: город MyBB (форум располагается на серверах данного сервиса), район Центральный (если это один из домов-доменов MyBB), дом такой-то (конкретный домен), номер квартиры - такой-то (название форума):

http://forum.mybb.ru

Каждая квартира, называемая форумом, это в общем понимании сайт. И как в любой квартире есть отдельные помещения, так на форуме (сайте) есть отдельные страницы. Вы можете по своему усмотрению оформить внешний вид квартиры, сделав в ней ремонт (поставив дизайн), наполнив мебель (предусмотренные типы страниц и элементов на этих страницах) вещами (информацией в разделы, описания форумов в них, темы, посты) и украсив шторами, коврами и прочими мелочами (внешний вид отдельных элементов на страницах).

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

В отличие от человека, форум понимает не русский или английский языки, он знает только HTML. Поэтому ваша задача, как администратора своей собственной квартиры, научиться разговаривать на понятном ему языке, который, как и любой другой, имеет свой собственный синтаксис. Каждый символ в текстах, написанных на этом языке, называемых кодами, имеет свое значение, как и то, в каком именно месте он стоит. Разобравшись с синтаксисом, переходите к "орфографии" и пополнению "словарного запаса".

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

Посмотрите на свою главную страницу форума.
Все, что вы на ней видите, помещено в самую большую матрешку по имени html. Следующая - такая же большая, она тоже занимает все пространство страницы и содержит в себе всех последующих матрешек. Называется она body. Глубже на один слой идет еще одна большая матрешка - #pun_wrap. Она тоже содержит в себе все последующие. Дальше - чуть более мелкая, именуемая #pun. В ней размещены все матрешки, отвечающие за тело форума. И так еще очень долго и ветвисто можно следовать по этому дереву из матрешек, изучая, какая из них внешняя, какая внутренняя, следовательно, какая родительская, а какая дочерняя.

Возможно, вы спросите, зачем столько вложенных друг в друга одинаковых матрешек? Отвечу. Чтобы можно было максимально гибко настроить внешний вид вашего форума. Ведь вам же не понравится, если побеленными будут и потолок, и стены, и пол, и окна с дверью, правда? Вам захочется, чтобы на стенах были обои, на полу - линолеум, а на окнах - шторы. Чтобы обеспечить достаточный ассортимент "отделочных материалов", необходимо заготовить места, позволяющие разграничить установку разнообразных "отделочных элементов".

Итак, структура понятна. Перейдем к управлению.
В Админке есть всего два места, через которые вы можете "общаться" с форумом. Это

Администрирование → Свой стиль (А-СС)

http://savepic.net/3901130m.jpg
Рисунок 1

Администрирование → Настройки (А-Н)

http://savepic.net/3907274m.jpg
Рисунок 2

В А-СС располагаются коды CSS, называемые каскадными таблицами (правила поведения наших матрешек), согласно которым форум знает, какого размера шрифт должнет быть у обычного текста, как должны выглядеть ссылки, какого цвета заголовки на страницах тем, какой ширины форум, и какие картинки, какого размера и в каком месте используются для оформления внешнего вида всех без исключения страниц форума. Абсолютно все, что относится к структуре (Администрирование → Свой стиль → Структура стиля (А-СС-СС)) и цветам (Администрирование → Свой стиль → Цвета стиля (А-СС-ЦС)) форума прописано в этих двух окнах. Прописано правилами верстки каскадных таблиц (CSS).

В А-Н есть несколько окон, куда можно поместить коды.

1. Это так называемый "HTML-верх".
Туда преимущественно помещают коды стиля
(такие же, как и на странице А-СС).

http://savepic.net/3913421m.jpg
Рисунок 3

2. А также окно "HTML-низ".
Здесь располагают скрипты (коды, отвечающие
за функциональность форума).

См. рисунок 3.

3. "Правила".
Окно, в которое можно поместить текст,
выводимый пользователю в течение регистрации.

http://savepic.net/3904205m.jpg
Рисунок 4

4. "Объявление".
Место, обычно располагаемое после логотипа и
групп ссылок, называемых навигационной панелью
("Форум" "Участники" "Поиск" "Профиль"...) и
пользовательской панелью ("Новые сообщения"
"Активные темы" "Темы без ответов"...), но до
строки приветствия: "Привет, гость. Войдите
или Зарегистрируйтесь" Сюда можно вставлять
таблицы с новостями, анонсами, координатами
администрации, картинки, рекламу, баннеры и
прочие вещи.

http://savepic.net/3892941m.jpg
Рисунок 5
http://savepic.net/3880653m.jpg
Рисунок 5.1

5. "Форма ответа".
Сюда помещаются коды, которые помогают
дополнительно обустроить форму
быстрого ответа, отображаемую в каждой теме.

http://savepic.net/3891822m.jpg
Рисунок 6

Во всех этих окнах работает HTML, и коды, которые туда помещаются, должны быть оформлены согласно синтаксису этого языка. Например, коды стиля (каскадные таблицы или иначе CSS) обязаны располагаться между двумя парными тегами стиля:

<style type="text/css">коды стиля</style>

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

<script type="text/javascript">код скрипта</script>

Здесь, как видно, общие правила те же: теги обязательно парные, в закрывающем первым символом в скобках стоит слеш, давая понять, что код скрипта завершен, но вместо style (стиля) применяется иное название тега: script - скрипт.

По этим характерным признакам можно отличить один тип кодов от других и впредь не путать ни сами коды, ни их назначение.

Помимо Админки, где действует HTML, есть еще и сообщения в темах, набираемые в форме быстрого ответа. Здесь уже работают так называемые bb-теги, которые являются аналогами html-тегов, но не позволяющие случайной ошибке в синтаксисе покоробить или даже запороть весь форум.

bb-теги, если продолжать серию аналогий, это репродукции картин великих художников. html-теги - оригинальные картины - далеко не все имеют копии-репродукции (bb-теги), а вид последних несколько отличается от оригинала. Администратор сервиса (не форума) волен создавать "репродукции" тех html-тегов, которые на его взгляд наиболее востребованы для пользователей его ресурса. Набор bb-тегов зачастую одинаков: как и в реальной жизни есть всемирно признанные шедевры искусства, на которые множество раз писались репродукции, и которые в итоге вошли в сборники работ известнейших художников мира, пользуясь популярностью у подавляющего большинства пользователей, так и наиболее актуальные в работе с сообщениями bb-теги (размер шрифта, его стиль, цвет и начертание, вставка ссылки или картинки и пр.) собраны в сборки, которые чаще всего используют на форумах и сайтах.

bb-теги, в отличие от html-тегов, обрамлены в квадратные скобки, но точно так же требуют ответных частей - закрывающих тегов, обозначеных слешем перед названием тега:

<img src="http://forumavatars.ru/img/avatars/0000/14/1c/31687-1381335330.jpg"></img>

[img]http://forumavatars.ru/img/avatars/0000/14/1c/31687-1381335330.jpg[/img]

Первый пример - html-тег картинки. Второй - его bb-код аналог. Первый работает в html-пространстве (Админке), второй - в сообщениях, и имеет более простую форму записи, чем оригинал.

Но вернемся в Админку и к тому, как можно влиять на внешний вид форума.
Мало знать, что существуют блоки-матрешки, из которых состоит любая страница форума. Чтобы ее видоизменить, нужно иметь представление, какие команды можно задавать нашим матрешкам и как. Здесь тоже необходимо принять к сведению и выучить синтаксис обращения.
1. Прежде всего, нужно точно определить, какая из матрешек нам нужна.
2. Следующим шагом выяснить, как зовут эту матрешку (имя матрешки - это так называемый селектор).
3. Затем выбрать действие, которое необходимо произвести над матрешкой, или иными словами, какие параметры или свойства данной матрешки требуется изменить - передвинуть по странице, поменять размер, форму, цвет и т.д.
4. Найти, как звучат эти параметры на языке html
5. И наконец, узнать, какие значения для выбранных параметров возможны и подходят для решения поставленной задачи.

Итак, три правила:

селектор {
    параметр: значение;
    }

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

Например, мы хотим изменить ширину форума, сделав ее 750px, а также задать фоновый цвет, который в шестнадцатеричной системе имеет вот такой код #746059. Определяем, что элемент страницы, вмещающий в себя тело форума, идентифицируется по селектору #pun. Находим, что параметр, способный влиять на ширину, звучит как width, а свойство, способное оперировать фоном - как background-color. Зная, какое значение нам нужно прописать для ширины, и каков шифр загаданного цвета, мы можем составить код:

#pun {
    width: 750px;
    background-color: #746059;
    }

Если есть намерения разместить этот код в Администрировании → Свой стиль, то в представленном выше виде он полностью готов к применению, его нужно лишь вставить в окно к другим кодам (как правило в конец окна). Если же есть необходимость поместить код в Администрировании → Настройки → html-верх, то как и писалось раньше, код необходимо обернуть в теги стиля:

<style type="text/css">
#pun {
    width: 750px;
    background-color: #746059;
    }
</style>

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