ForumD.ru - Дизайн для форумов и техническая поддержка

Объявление

Акция! Дизайн «MyBB Technical Support»

Дизайн для форума MyBB в тематике компьютерных сообществ или технической поддержки
Стоимость при покупке эксклюзивно: 2000р 1200р
Скидка 40%. В стоимость входит настройка и корректировка дизайна.

Подробнее

Дизайн «Warlords of Draenor»

Детализированный rpg-дизайн для MyBB форума гильдии «Warlords of Draenor»
Стоимость при покупке эксклюзивно: 6300р
В стоимость входит настройка и корректировка дизайна под ваш проект.

Подробнее

Светлый дизайн в фентези стиле с аниме-графикой

Макет для светлого дизайна в фентези стиле с аниме-графикой.
Стоимость: 2600р*
Дизайн продается эксклюзивно (в одни руки).

Подробнее

Дизайн для MyBB форума гильдии WoW Exodar

Детализированный rpg-дизайн для mybb форума гильдии в тематике Экзодара.
Стоимость: 2150р*
В стоимость входит настройка и корректировка дизайна.

Подробнее

Поддержать проект

Если у вас есть желание помочь нам сделать наш проект лучше:
Финансовая помощьРеклама на сайте
Стать модераторомОтзывы

Предложения

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.



Боковая панель для форума

Сообщений 1 страница 10 из 13

1

Вариант Информационного Блока от Duka
с облегченным заполнением Информацией.

Боковая панель (сайдбар) с облегченным заполнением информацией и автоподгонкой по высоте форума (модификация скрипта от Duka).

[html]<center><img class="postimg" src="http://gerda.moy.su/_bd/0/27.jpg" width="350px"></center>[/html]
Автор: Deff
Платформа: MyBB

скрипт и описание

Поскольку при заполнении Информационного Блока от Duka возникает Слишком много вопросов и Ошибок, вот Вариант с облегченным заполнением Информацией.

В HTML низ

<div id=Inf_block_Left style="display:none">
<!--НАЧАЛО-->
<h2>НОВОСТЬ 1</h2>
Текст НОВОСТИ
<h2>НОВОСТЬ 2</h2>
Текст НОВОСТИ
<h2>НОВОСТЬ 3</h2>
Текст НОВОСТИ
</div>

<div id=Inf_block_Right style="display:none">
<!--НАЧАЛО-->
<h2>НОВОСТЬ 1</h2>
Текст НОВОСТИ
<h2>НОВОСТЬ 2</h2>
Текст НОВОСТИ
<h2>НОВОСТЬ 3</h2>
Текст НОВОСТИ
</div>

<script type="text/javascript">
var L=$("#Inf_block_Left").html();$("#Inf_block_Left").replaceWith("");
var R=$("#Inf_block_Right").html();$("#Inf_block_Right").replaceWith("");
if($(".punbb").attr("id")=="pun-index";){

  var LeftSUM='', RightSUM='',block1='<div class="container" style="padding:5px;" id=News_';
  var block2="</div><br><br>";
if(L!=null){ var c = L.split(/<h2>|<\/h2>/igm);
for(i=1; i<c.length; i+=2){
LeftSUM+=block1+'L'+(i+1)/2+' >'+'<h2><center>'+c[i]+'</center></h2>'+c[i+1]+block2;
}LeftSUM='<td id=LeftNews width=21% valign=top>'+LeftSUM+'</td>';/*alert(LeftSUM);*/}
if(R!=null){ var c = R.split(/<h2>|<\/h2>/igm);
for(i=1; i<c.length; i+=2){
RightSUM+=block1+'R'+(i+1)/2+' >'+'<h2><center>'+c[i]+'</center></h2>'+c[i+1]+block2;
}RightSUM='<td id=RightNews width=21% valign=top>'+RightSUM+'</td>';/*alert(RightSUM);*/}

  if(LeftSUM!='' || RightSUM!=''){ $("#pun-main").html('<table width=100% id="NEWS"><tr valign=top>'+LeftSUM+'<td>'+$("#pun-main").html()+'</td>'+RightSUM+'</tr></table>'); };}
</script>

Красным - заголовки и текст новости
Если какой блок не нужен( левый или правый) - его просто убираем из кода

ПОПРАВЛЕНО ДЛЯ ИЕ! Вставки синим Жирным -
<!--НАЧАЛО-->
в начале каждого Блока - Обязательны!


Контейнер вставки Скриптов
"Контейнер вставки" позволит вставить: Чат, часы, календарики, различные фреймы с анимированным Флеш-контентом  и другие скрипты.
Сам контейнер

<style id=script_N alt=0>/*
Сейчас в чате присутствуют: <br><span style="color: #336699"><script type="text/javascript" language="JavaScript" src="http://api.chatovod.ru/call?chatname=forumletai&method=getOnlineUsersByChat&retvar=onlineUsers"></script>
<script type="text/javascript" language="JavaScript">
  for(var i=0;i<onlineUsers.length;i++) {
    if (i != 0) document.write(", ");
    var u = onlineUsers[i];
    document.write(u.nick.replace(/&/gi, "&amp;").replace(/</gi, "&lt;").replace(/>/gi, "&gt;"));
  }
</script></span>

*/</style>
<script>
var Id_script='script_N';
if($("style.#"+Id_script).attr("alt")==1){//alert($("style.#"+Id_script).html().replace(/^\/\*([\s\S]*)\*\//img,"$1"));
$("style.#"+Id_script).replaceWith($("style.#"+Id_script).html().replace(/^\/\*([\s\S]*)\*\//img,"$1"))
}else $("style.#"+Id_script).attr("alt","1")
</script>

Красным  - Номер скрипта (1,2,3, ... и т.д.)
Для каждого последующего такого контейнера номер N свой!
Синим - собственно код скрипта (заменяем на свой собственный)
Сам "Контейнер Вставки"  вставляем вместо очередного Текст НОВОСТИ (или вместе с ним)


Sidebar - боковая панель для форума (HTML + CSS)
Боковая панель (сайдбар), настраиваемая БЕЗ скриптов.

Автор: rps
Платформа: MyBB

код и описание

1. Ставить в HTML-верх следующий код:

Код:
<style>
#pun {
  margin: auto 20px auto 185px;
  width : 870px;}
.sidbar {background: transparent url(http://i009.radikal.ru/0908/34/c646503d774e.png); width: 188px; height: 1600px; border: 1px solid; position: absolute; z-index: 1000;  top: 0px; right: 310px; left: 5px;}
.sidbar h1 , .sidbar h2 , .sidbar h3 {
background:  transparent  url(http://i041.radikal.ru/0908/f8/606ac58d6426.png); height: 17px; text-align: center; color: #496690; border: 0px none; width: 90%; margin: auto;}
.sidbar p {padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; text-align: center;}
</style>
<div class="sidbar">...</div>

2. Рассмотрим содержимое кода по-порядку, чтоб Вы смогли максимально точно настроить его под себя.

#pun {
  margin: auto 20px auto 185px;
  width : 870px;
}

Выделенное зелёным - это ширина Вашего форума. В пикселах.
Выделенное красным - отступы от краём экрана до форума. Тоже в пикселах. Причём значения идут в порядке: верхний, правый, нижний и левый отступы. Auto указывает на то, что отступ подберётся сам при необходимости.

.sidbar {background: transparent url(http://i009.radikal.ru/0908/34/c646503d774e.png); width: 188px; height: 1600px; border: 1px solid ; position: absolute; z-index: 1000;  top: 0px; right: 310px; left: 5px;}

Выделенное красным - цвет самой панели. Значение transparent - прозрачная.
Выделенное зелёным - фоновая картинка для панели. При значении none - без фонового изображения.
Выделенное синим - ширина и высота самой панели. Допустимо использовать значения в пикселах или процентах (в процентах - от общей длинны или ширины форума).
Выделенное жёлтым - рамка вокруг боковой панели. Первое значение - толщина в пикселах, второе слово - тип начертания.
Выделенное розовым - позиция панели относительно форума. НЕ РЕКОМЕНДУЕТСЯ изменять эти значения начинающим пользователям и пользователям со средним опытом.

.sidbar h1 , .sidbar h2 , .sidbar h3 {
background:  transparent url(http://i041.radikal.ru/0908/f8/606ac58d6426.png); height: 17px; width: 90%; text-align: center; color: #496690; border: 0px none; margin: auto;}

Выделенное красным - цвет заголовков минидополнений. Значение transparent - прозрачные.
Выделенное зелёным - фоновая картинка для заголовков минидополнений. При значении none - без фонового изображения.
Выделенное синим - ширина и высота самих заголовков. Допустимо использовать значения в пикселах или процентах (в процентах - от общей длинны или ширины форума).
Выделенное жёлтым - выравнивание текста в заголовках категорий по центру.
Выделенное розовым - цвет текста заголовков.
Выделенное оливковым - рамка вокруг боковой панели. Первое значение - толщина в пикселах, второе слово - тип начертания.
Выделенное голубым - выравнивание заголовков относительно сайдбара. НЕ РЕКОМЕНДУЕТСЯ изменять это значение начинающим пользователям и пользователям со средним опытом.

.sidbar p {padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; text-align: center;}

Выделенное красным - отступы от минидополнений до границы сайдбара. Необходимы для выравнивания минидополнений по центру панели. Значения идут в порядке: верхнее, правое, нижнее, левое.
Выделенное зелёным - выравнивание текстовой информации в минидополнениях.
Теперь о том, как добавить своё минидополнение на сайдбар.
Для этого найдите в коде (в самом конце) строчку

Код:
<div class="sidbar">...</div>

Вместо трёх точек Вы сможете поставить те минидополнения, которые Вам понравятся.
Понятное дело, что заголовок и содержимое может быть любым.

Sidebar (боковая панель) для форума (© rps) с двух сторон

Код:
<style>
#pun {
  margin: auto 175px 0 175px;
  width : 700px;}
.sidbar1 {background: transparent url(http://i009.radikal.ru/0908/34/c646503d774e.png); width: 188px; height: 1600px; border: 1px solid; position: absolute; z-index: 1000;  top: 0px; right: 310px; left: 5px;}
.sidbar2 {background: transparent url(http://i009.radikal.ru/0908/34/c646503d774e.png); width: 188px; height: 1600px; border: 1px solid; position: absolute; z-index: 1000;  top: 0px; right: 5px; left: 895px;}
.sidbar1 h1 , .sidbar1 h2 , .sidbar1 h3, .sidbar2 h1 , .sidbar2 h2 , .sidbar2 h3 {
background:  transparent url(http://i041.radikal.ru/0908/f8/606ac58d6426.png); height: 17px; text-align: center; color: #496690; border: 0px none; width: 90%; margin: auto;}
.sidbar1 p, .sidbar2 p{padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; text-align: center;}
</style>
<div class="sidbar1">...</div>
<div class="sidbar2">...</div>

Отредактировано Герда (16.05.2013 04:56:14)

+1

2

:flag: Поправочка > Пост 534

(*Удалите после правки сообщение

+1

3

[mod]Deff
Ага, обновлено. http://i.smiles2k.net/aiwan_smiles/smile3.gif
[/mod]

+1

4

faiko  :flag: 

Там в коде  ;)  Смайлик - Моргает - обрами - круглу скобку в теги [font=Arial])[/font]

Отредактировано Deff (10.09.2011 00:34:32)

+1

5

Deff
Еще раз спасибо ==" Моя невнимательность.

0

6

Странно, тот сразу заработал, а этот нет...

0

7

Mango-rzn написал(а):

Странно, тот сразу заработал, а этот нет...

Код походу кривой - Вот исходник http://forum.mybb.ru/viewtopic.php?id=6 … 27#p683238 пост 534

0

8

Исходник работает)

0

9

Доброго ночера всем!) Установил исходник, всё нормально работает) только такая проблемка возникла, чем уже монитор, тем больше за край колонки вылазят картинки... можно ли как то это поправить?

http://forummango.mybb.ru/

0

10

Mango-rzn
Найдите в скрипте и поставьте фиксированный размер колонки

}RightSUM='<td id=RightNews width=220 valign=top>'+RightSUM+'</td>';/*alert(RightSUM);*/}

Красное - регулируйте

0

Быстрый ответ

Напишите ваше сообщение и нажмите «Отправить»


ВНИМАНИЕ! При обращении за техподдержкой и вопросами по скриптам/оформлению, оставляйте ссылку на форум/сайт с проблемой! Специалист должен вживую видеть проблему, чтобы подсказать как ее решить.

ВНИМАНИЕ! Гости (не зарегистрированные на форуме) могут писать сообщения, но не могут вставлять прямые ссылки! Чтобы оставить сообщение со ссылкой на сайт, форум или скриншот удалите символы: "http://", "https://" или "www."