Первый способ:

Некоторые часто хотят сделать вместо иконок новых/нет новых/ и т.д. сообщений на главной странице индивидуальные не меняющиеся иконки для каждого подфорума.
Как это  сделать?

Как всегда пишем стандартные теги для кодоав css(Вместо точек будем вставлять коды):

<style type="text/css">
.....................
.....................
</style>

--------------------------------------------------------------------------------

1. Для начала пишем код:

#pun-main .category Div.icon {float: left; display: block; border-style: none none none none; height: ...; width: ...;}
Вместо троеточий вставляем максимальную высоту и ширину тех иконок, которые будем вставлять для разделов.

2. Далее берем следующий блок:

tr#forum_fx Div.icon, tr#forum_fx TR.iclosed Div.icon, tr#forum_fx TR.iredirect Div.icon, tr#forum_fx TR.inew Div.icon   {background-color : transparent; background-image: url(http://time.3bb.ru/uploads/time/2_br_redirect.gif);  background-repeat : no-repeat; background-position: top center;}
Размножаем его копипэйстом, столько раз, сколько у нас подфорумов.

3. Теперь идем на главную страницу.

Наводим мышку на первый подфорум.
В строке браузера отразится его адрес.
Например, он может выглядеть вот так:
http://help.forumbb.ru/viewforum.php?id=2
(Чтобы было понятно - это над Пуском)
Берем ту цифру, которая идет после "=".  В данном случае - 2.

4. В первом блоке ВСЕ X замеянем на это число.
Получаем:

tr#forum_f2 Div.icon, tr#forum_f2 TR.iclosed Div.icon, tr#forum_f2 TR.iredirect Div.icon, tr#forum_f2 TR.inew Div.icon   {background-color : transparent; background-image: url(http://time.3bb.ru/uploads/time/2_br_redirect.gif);  background-repeat : no-repeat; background-position: top center;}
Вместо троеточия в скобках вставляем адрес иконки для первого раздела.

5.Снова идем на главную:
Наводим мышку на второй раздел. Смотри адрес и берем цифру после =. В следующем блоке ВСЕ X заменяем на это число. В скобках ставим адрес уже для картинки второго раздела. И так до конца.

6. Теперь, чтобы перед темами по-прежнему остались нормальные иконки в зависимости от того, есть ли новые сообщения и т.д.

Пишем:

Div.icon {
background-image : url(http://НЕ НАШ СЕРВИС!/img/Mybb_Ocean_zero/old.gif);
background-repeat: no-repeat;
}

TR.inew Div.icon {
background-image : url(http://НЕ НАШ СЕРВИС!/img/Mybb_Ocean_zero/old.gif);
background-repeat: no-repeat;
}
TR.isticky Div.icon {
background-image : url(http://НЕ НАШ СЕРВИС!/img/Mybb_Ocean_zero/old.gif);
background-repeat: no-repeat;
}

TR.iclosed Div.icon {
background-image : url(http://НЕ НАШ СЕРВИС!/img/Mybb_Ocean_zero/old.gif);
background-repeat: no-repeat;
}
TR.iredirect Div.icon {
background-image : url(http://НЕ НАШ СЕРВИС!/img/Mybb_Ocean_zero/old.gif);
background-repeat: no-repeat;
}

--------------------------------------------------------------------------------

--------------------------------------------------------------------------------

Втoрой способ проще:

<style type="text/css">
#pun-main .category Div.icon {float: left; display: block; border-style: none none none none; height: 40px; width: 40px; background-repeat : no-repeat; background-position: top center; background-color : transparent;}

tr#forum_f2 div.icon {background-image: url(Ваша ссылка на картинку);  }
tr#forum_f2 div.inew {background-image: url(Ваша ссылка на картинку);  }</style>
div.icon = обычная иконка
div.inew = иконка  при появлении новых сообщений

tr#forum_f2 =  номер   Раздела  форума   иначе  id форума котрый  высвечивается в Адресной строке браузера когда Вы входите   в раздел форума вот.

Пример: http://help.forumbb..ru/viewtopic.php?id=87
Тут  id=87  значит в код нужно вписать   87
40px - высота и ширина иконки

копируете(размножаете) две части столько сколько у Вас форумов., остальное как обычно.

Некотрые решения по коду может помогут:

  Внимание! Если у вас по каким-то причинам возникли проблемы со следующим:

#pun-main .category Div.icon {float: left; display: block; border-style: none none none none; height: 40px; width: 40px; background-repeat : no-repeat; background-position: top center; background-color : transparent;}
Попробуйте его заменить на:

#pun-main table Div.icon {padding-left: 35px; padding-top: 15px; padding-bottom: 20px;}  - является стабильным сейчас и рабочим параметром
#pun-main table div.tclcon {padding-left: 35px; padding-top: 15px; padding-bottom: 20px;} - если не поможет передыдущий пробуйте этот.

--------------------------------------------------------------------------------

--------------------------------------------------------------------------------

1. в коде иконки float: left замени на float: none;
Далее пишешь

#pun-main table div.tclcon {margin-left: ...px;}
Подставляешь разные значения вместо троеточия пока не добъешься нужного отступа.

#pun-stats .container hr {display: none;}
2. если сделал , но не пашет, то напиши

#pun-main table Div.icon {float: none !important;}
3. Если ещё проблемы, тогда еще пишем

#pun-main .category table div.tclcon {margin: ...px;}

ИЛИ

<style type="text/css">
#pun-main .category Div.icon {float: left; display: block; border-style: none none none none; height: 50; width: 50;}

tr#forum_fN Div.icon, tr#forum_fN.iclosed Div.icon, tr#forum_fN.iredirect Div.icon, tr#forum_fN.inew Div.icon   {background-color : transparent; background-image: url(адрес картинки-иконки для данного раздела, т.е. форума);  background-repeat : no-repeat; background-position: top center;}

Div.icon {
background-image : url(адрес иконки темы без новых сообщений);
background-repeat: no-repeat;
}
TR.inew Div.icon {
background-image : url(адрес иконки темы с новыми сообщениями);
background-repeat: no-repeat;
}
TR.isticky Div.icon {
background-image : url(адрес иконки выделенной темы);
background-repeat: no-repeat;
}
TR.iclosed Div.icon {
background-image : url(адрес иконки закрытой темы);
background-repeat: no-repeat;
}
TR.iredirect Div.icon {
background-image : url(адрес иконки перемещенной темы (кстати, нифига не пашет));
background-repeat: no-repeat;
}
</style>

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

Блок с иконками ДЛЯ ТЕМ вставляется ОДИН раз

1 способ:
Код вставляется в HTML в форме ответа

<img onclick="insert_text(' -- ', '')" src="адрес_смайла" alt="Смайл" />

Будет отображаться смайл, по клику на который в текст сообщения будет вставлен необходимый BBCode

2 способ:
Код вставляется в HTML в форме ответа

<img onclick="return changeVisibility('id_смайлов', this)" src="адресс_смайла" alt="описание_смайлов" />
<div class="container" id="id_смайлов" style="display:none; width:199px; position: absolute; z-index: 2">
<div id="smilies-block">
<img src="адрес_смайла" alt="описание_смайла" style="cursor: pointer" onclick="insert_text(' -- ', ''); return changeVisibility('id_смайлов', this)" />
</div>
</div>
id_смайлов - название блока смайлов. Например: smiles-icq, smiles-area2, smiles.
описание_смайла - по желанию, вешь вообщем-то ненужная, ИМХО, так что можно смело удалять.
Добавлять смайлы просто копируя строчку:
<img src="адрес_смайла" alt="описание_смайла" style="cursor: pointer" onclick="insert_text(' -- ', ''); return changeVisibility('id_смайлов', this)" />

Адреса можно писать в формате: uploads/имя_форума/имя_файла , исключение - адрес между --, там адрес должен быть полным, начиная с http:// и т.д.

Выглядит это так:

Используя этот способ можно создать несколько наборов смайлов, оформляя каждый набор отдельным блоком. Каждому блоку надо присваивать уникальные id.

3 способ :
позволяет при нажатии на ссылку показать окошко с дополнительными смайлами.
При нажатии на доп. смайл его код дописывается в окно быстрого ответа.

Первая часть -  её можно распологать где угодно - хоть в html-верхе, хоть в низе, хоть в объявлении.

<script language="JavaScript">
function popwnd()
{
var smiles = new Array

//Добавлять смайлики здесь
smiles.push("http://www.mysmiles.ru/super_smilies101.gif")
smiles.push("http://www.mysmiles.ru/super_smilies097.gif")
smiles.push("http://www.mysmiles.ru/super_smilies104.gif")
smiles.push("http://www.mysmiles.ru/super_smilies088.gif")
smiles.push("http://www.mysmiles.ru/super_smilies079.gif")
smiles.push("http://www.mysmiles.ru/super_smilies070.gif")

var msg = new String("")
msg = "<html><head><TITLE>Дополнительные смайлики</TITLE></head>\r\n"
msg += "<body bgcolor=#F5F5F5 >"
msg = msg + "<" + "script language=\"JavaScript\">\r\n"

msg += "function insert(a){\r\n"
msg += "txt = \"-- \";\r\n"
msg += "window.opener.insert_text(txt,'');\r\n"
msg += "window.focus()\r\n"
msg += "return false}\r\n"

msg = msg + "</" + "script>\r\n"

i=0

msg += "<div style=\"width: 100%; text-align : justify;\" >" 
while(smiles[i])
{
msg = msg + "<img src=\"" + smiles[i] + "\" onclick=\"return insert(this)\">\r\n"
i++
}

msg += "</div><br><br><center><a href=\"\" onclick=\"window.close()\">Закрыть</a></center>"
msg += "</BODY></html>";

popup = window.open("","popDialog","height=390,width=258")
popup.document.write(msg)
popup.document.close()

return false
}
</script>

Добавлять смайлики нужно после "//Добавлять смайлики здесь". Просто скопируйте строчку smiles.push("...") и в кавычках пропишите URL смайла

Вторая часть кода - ссылка

<a id="addsmile"  href="" onclick="return popwnd()">Дополнительные смайлики</a>

<script language="JavaScript">
str=document.URL
page=str.substring(str.lastIndexOf('/')+1)

if(page.indexOf("viewtopic.php")==-1)
   document.getElementById("addsmile").style.display = "none";
</script>

Этот код распологайте там, где хотите расположить ссылку на доп. смайлики.
Только не забудьте скрипт, который идёт после ссылки. Благодаря ему ссылка отображается только при просмотре тем.

Отредактировано DREД (06.01.2008 10:16:42)