Логотип  - это первое, что бросается в глаза на вашем форуме. Наверно нет нужды и говорить, что если вы хотите начать оформлять форум по своему, что же надо изменить первым.

Картинка внизу показывает, где находятся основные элементы логотипа:

Примечание, прочтите перед началом замены логотипа:

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

Примечание:

Во всех скриптах встречается фраза адрес вашей картинки. Чтобы его получить, достаточно залить картинку на форум. Для этого нажмите  и в появившемся окне выберите картинку, находящуюся на вашем компьютере. Обьем картинки не должен превышать 1 Мегабайта, поддерживаемые расширения  jpеg, png и gif. Не забудьте набрать любой текст в окне Быстрого ответа, иначе картинка попросту не загрузится. После успешной загрузки картинки щелкните по ней правой кнопкой мыши и и в появившемся меню выберите меню Свойства. Скопируйте текст в строке Адрес (URL)  - это и будет адрес вашей картинки.

Если картинка слишком большая и вместо нее в сообщение отображается ее уменьшенное изображение, щелкните по ней левой кнопкой мыши, отобразится реальная картинка.

Все нижеследующие скрипты вставляются в Администрирование --> Настройки -->HTML верх

Дополнительно:

Если ваша картинка не помещается по ширине или высоте, добавьте следующие параметры:

height (высота элемента)
width (ширина элемента)

Значения: px (пиксели) или % (проценты)

Пример:

#element1 {height: 200px; width: 100%;}

Если вам надо сделать отступ от рамки шапки, добавьте следующие параметры:

margin-top (верхний отступ)
margin-bottom (нижний отступ)
margin-left (левый отсуп)
margin-right (правый отсуп)
margin (все стороны отступа сразу)

Значения: px (пиксели)

Пример:

#element1 {margin-left: 40px;}

Если вам надо убрать какой-нибудь элемент, добавьте следующие параметры:

display (способ отображения элемента)

Значения: none (нет)

Пример:

#element1 {display: none;}

Способы вставки логотипа:

Самый простой способ, реализуемый при помощи css:

<style type="text/css">
#pun-title .title-logo {background-image: url(адрес вашей картинки); background-repeat: no-repeat;}
</style>

Если остальной фон шапки вы хотите отделать в том же стиле:

<style type="text/css">
#pun-title table {background-image: url(адрес вашей картинки);}
</style>

Если на вашем графическом логотипе некрасиво устроилось буквенное название форума:

<style type="text/css">
#pun-title h1 span  {display: none;}
</style>

Логотип-картинка во всю шапку (за исключением баннера):

<style type="text/css">
#pun-title .title-logo {display: none;}
#pun-title table {background-image: url(адрес вашей картинки);}
</style>

Картинка во всю шапку, с регулирующейся шириной под разные браузеры/ расширения экрана:

Примечание:

Не работает в Firefox, Safari

<style type="text/css">
#pun-title table {background-image: none !important;}
#pun-title, #pun-title table, .title-logo-tdr {background-color: transparent;}
#pun-title table  {position: relative; top: -30px ; z-index: 100 !important; height: 0px;}
#pun-title .title-logo {display: none;}
#pun-title {height: 50px;}
</style>

<script type="text/javascript">
var logot=document.getElementById('pun-title').innerHTML
document.getElementById('pun-title').innerHTML="<img src='адрес картинки'"+" style='width: 100%; position: relative; top: 30px;' />"+logot
</script>

Изменяйте красные значения, пока не отпозиционируете фон и логотип идеально для вас.

--------------------------------------------------------------------------------
Дополнительные скрипты:

Если вам надо просто стереть логотип mybb, используйте данный скрипт:

<style>
#pun-title .title-logo {display : none;}
</style>

Можно создать один большой логотип над шапкой:

<img src="адрес вашей картинки">

Если на вашем логотипе осталось буквенное название форума, его можно убрать этим скриптом:

<style type="text/css">
#pun-title h1 span  {display: none;}
</style>

Верхний баннер нельзя удалять или закрывать, но можно перемещать. Для этого воспользуйтесь данным скриптом:

<style> #pun-title table tbody tr .title-logo-tdr {position: absolute; z-index: 1; left: 510px; top: 190px
}
</style>

Значения, выделенные жирным изменяйте на свое усмотрение, но только в пределах от 190 до 510

Скрипт, позволяющий создавать логотипы, случайным образом меняющиеся при каждом обновлении страницы:

<script language="JavaScript">
<!--
image = new Array();
image[0]="адрес вашей картинки №1"
image[1]="адрес вашей картинки №2"
image[2]="адрес вашей картинки №3"
............................................................................

var img=image[Math.floor(Math.random()*image.length)]

document.write("<style>#pun-title .title-logo {background-image: url("+img+"); background-repeat: no-repeat;}</style>")
//-->
</script>

image[*]="адрес вашей картинки №*"

Повторяем для нужного вам количества картинок, соблюдая нумерацию, и вставляем заместо многоточия

Второй вариант скрипта "случайных" логотипов, с учетом разрешений экрана:

<script language="JavaScript">
if (screen.width==1024)
<!--
image = new Array();
image[0]="адрес вашей картинки №1"
image[1]="адрес вашей картинки №2"
image[2]="адрес вашей картинки №3"
............................................................................

var img=image[Math.floor(Math.random()*image.length)]

document.write("<style>#pun-title .title-logo {background-image: url("+img+"); background-repeat: no-repeat;}</style>")
//-->
</script>

<script language="JavaScript">
if (screen.width==1280)
<!--
image = new Array();
image[0]="адрес вашей картинки №1"
image[1]="адрес вашей картинки №2"
image[2]="адрес вашей картинки №3"
............................................................................

var img=image[Math.floor(Math.random()*image.length)]

document.write("<style>#pun-title .title-logo {background-image: url("+img+"); background-repeat: no-repeat;}</style>")
//-->
</script>

Повторяем для нужного вам количества картинок, соблюдая нумерацию, и вставляем заместо многоточия.

Вставляем заместо подчеркнутых цифр размер экрана

Многие задают вопрос, а как сделать баннер. Вот готовый скрипт для него:

ссылка

Вставляем нужную вам ссылку

текст при наведении

Текст, высвечивающийся при наведении курсора на баннер. Пишем нужный