:::РАСКРУТКА ФОРУМОВ И ПОМОЩЬ::: |
| Наша реклама Правила форума Новости форума |
 |
Календарь: |
| Мастера:Поварёна | Реклама:в полезной ссылке | |
| Админ:Мара |
Привет, Гость! Войдите или зарегистрируйтесь.
Вы здесь » :::РАСКРУТКА ФОРУМОВ И ПОМОЩЬ::: » СКРИПТЫ » Простые и чаще используемые скрипты.
Тут будут скриптики вроде смены иконок новые сообщения/старые сообщения, фон, логотип и прочее, прочее. Вы так же смело выкладывайте=) Помощь зала очень приветствуется=)
Так же, хочу заметить, что при создании всех графических процесс в дизайне форума, вам не обойтись без бесплтного фото-хостинга http://radikal.ru
Все скрипты взяты с форума технической поддержки MyBB.
правда некоторые подаю я по своему.
Иконки
Самый наираспрастранненейший скрипт. Без него просто НИКАК XD
<style type="text/css">
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>Думаю, и так понятно, что и куда. Но на всякий пожарный объясню:
Div. icon - иконка "нет новых сообщений"
TR.inew Div.icon - иконка "есть новые сообщения"
TR.isticky Div.icon - "Важно!"
TR.iclosed Div.icon - "Закрыто"
TR.iredirect Div.icon - иконка перемещенного сообщения.
Если у вас не помещается картинка в окошко для иконки, то надо просто вашу иконку подвести под размер уже имеющуюсих там (родных) иконок. Что бы узнать размер родной картинки, достаточно лишьщелкнуть на родную иконку правой кнопкой мыши и выбрать графу "сохранить фон как" . Выбираете папку, куда сохранить и вуа-ля! Вы можете просто узнать размер картинки и подвести вашу под тот же размер, либо рисовать поверх сохраненной. =) Все гениально и просто=)
Есть так же другой вариант:
#pun-main .category Div.icon {float: left; display: block; border-style: none none none none; height: 52; width: 48;}height - высота картинки; width - ширина
Ставим желаемуюю высоту и ширину вашей картинки, прописываем и ставим данный скрипт между
<style type="text/css"> и Div.icon
Получается так:
<style type="text/css">
#pun-main .category Div.icon {float: left; display: block; border-style: none none none none; height: 52; width: 48;}Div.icon {
background-image : url(адрес картинки);
background-repeat: no-repeat;
}
ЛОГОТИП
Разработка шапки идет двумя спосабами:
Оснавная фоновая картинка со всем нужным и все...
Так же можно сделать фон один и свой маленький логотипчик.
Разберем по порядку!
Самый легкий простой способ (на мое мнение). Из выбранного вами стиля форума, сохраняем фон шапки ( так же, как и иконки, жмякаем правой кнопкой мыши на фон >>> сохранит как фон ) . И творим из сохраненной картинки все, что душе удобно. Но не забываем про рекламный баннер, чтоб он не загораживал нам картинку основательно.
Затем, перегоняем полученный результат через фото-радикал и прописываем скрипт в хтмл-верх.
<style type="text/css">
#pun-title table {background-image: url(код картиинки);}
</style>А для тоого, чтоп стандартный логотип "Mybb - мы создаем общение" не мазолил глазки, прописываем туда же
<style type="text/css">
#pun-title TABLE {background-image: none;}
</style>Готово!!
Получается примерно так:
Видите, рекламный баннер расположен в углу, а вокруг него серая полоса? Это тоже один из приемов скриптов, но об этом позже.
Теперь, другой вариант:
Фон трогать не обязательно, но если вы хотите, то пользуйтесь скриптом
<style type="text/css">
#pun-title table {background-image: url(код картиинки);}
</style>Затем, нарисовав свой логотип, и проматав его через радикал, пользуемся кодом
либо этим <a href="Адрес твоей картинки" target=_blank>
Либо этим
<img id="Mylogo" src="адрес картинки" />
<style type="text/css">
#Mylogo {width: 100%; margin: 0 0 0 0;}
</style>Там, где width: 100% , выбираем ширину логотипчика. 100% - чтоб лого занимал всю ширину шапки.
Расширение окна под аватар.
Ведь бывает такое, что ставишь аватар, а он не помещается... 
<style type="text/css"> #pun-main .post-author ul {width: 200px;}
</style>
Цифру на свою. 
Форум вправо/влево/по центру
<style type="text/css">#pun {margin-left: 0;}</style>
left - влево. right - вправо. center - центрик =)
Фоновая картинка влево/вправо/по центру
<style type="text/css"> body {background: url(ссылка на картинку фона) right;}</style>
left - влево. right - вправо. center - центрик =)
Картинка в форме ответа
<style type="text/css">
.punbb textarea {
background-image: url(ссылка на картинку) ;
}
</style>Замена "мужской/женский" (пол) на картинки
<script type="text/javascript">
var sex=document.getElementById('pun-main').getElementsByTagName("li")
var sx=0
for (sx=0; sx<=(sex.length-1); sx++)
{if (sex[sx].className=="pa-sex")
{if (sex[sx].innerHTML.indexOf("Мужской")!=-1)
{sex[sx].innerHTML="Пол: "+"<img src='мужская картинка' />"}
else if (sex[sx].innerHTML.indexOf("Женский")!=-1)
{sex[sx].innerHTML="Пол: "+"<img src='женская картинка' />"}
}}
</script>
Меняем надписи при регестрации
Вместо "Ник", "Пароль" и прочее, свое 
<script type="text/javascript">
if(document.URL.indexOf("register.php")!=-1){
document.getElementsByTagName("label")[0].innerHTML="Введите ник"
document.getElementsByTagName("label")[1].innerHTML="Введи кодовое слово"
document.getElementsByTagName("label")[2].innerHTML="Повтори кодовое слово"
document.getElementsByTagName("label")[3].innerHTML="Дай свой e-mail"
}
</script>автор Andriy
Все коды CSS вставляются в поле HTML-верх, какими страшными они небыли!!
Все коды CSS начинаются тэгом <style> и заканчиваются тэгом</style>. Это ОЧЕНЬ ВАЖНО
Вот самые востребованные коды CSS:
Сделать название темы и ее описание посредине
<style>
#pun-main .category .container table .hasicon .alt1 .tcl .intd .tclcon,
#pun-main .category .container table .hasicon .alt2 .tcl .intd .tclcon {text-align: center}
</style>Ссылки при наведении становяться заданого цвета
<style>
.punbb a:hover {color: ЦВЕТ}
</style>Делает по центру абсолютно всё на главной
<style>
HTML, BODY , #pun, #pun #pun-index #pun-main .category .container table thead tr .tcl, #pun-main .category .container table .hasicon .alt1 .tcl .intd .tclcon,
#pun-main .category .container table .hasicon .alt2 .tcl .intd .tclcon {text-align: center}
</style>Размер текста и шрифт
<style>
HTML, BODY {font-family:ШРИФТ ;font-size: Размер }
</style>Варианты размеров: xx-small, x-small, small, medium, large, x-large, xx-large
Убрать ссылку "поиск"
<style>
#pun #pun-index #pun-navlinks .container #navsearch a span, #pun .punbb #pun-navlinks .container #navsearch a span,
#pun #pun-index #pun-navlinks .container #navsearch, #pun .punbb #pun-navlinks .container #navsearch,
{ display: none }
</style>Убрать строку "зарегестрированых пользователей"
<style type="text/css">
#pun #pun-index #pun-stats .statscon .container .item3 span, #pun #pun-index #pun-stats .statscon .container .item3 strong {display: none}
</style>Цвет ссылок
<style>
.punbb a:link {color: pink}
.punbb a:visited {color: red;}
.punbb a:hover {color: black;}
</style>1 - цвет в норме
2 - посещенная ссылка
3 - при наведении
Это кроме меню навигации и ссылок снизу, они задаються соответственно
Фон статистики и цвет самой надписи "статистика"
<style>
#pun #pun-index #pun-stats h2{background-image: url(ССЫЛЬ) ; color: red}
</style>Цвет фона статус строки цвет поля с названием форума
<style>
.pa-title {background-color: black}
#pun #pun-index #pun-crumbs1 .crumbs{background-color: aqua; color: red}
</style>PS:
color- цвет текста
background-color- цвет фона
Первая строка в коде: цвет ссылок пользователя
2: фон поля, где салово "обьявление" и цвет самого слова
3: цвет фона статус-строки
4: цвет поля с названием форума и цвет самого названия форума
Убрать обьявление на странице ПОСТОВ
<style>
#pun #pun-viewtopic #pun-announcement{display: none}
</style>Сделать весь форум курсивом
<style>
#pun #pun-index, #pun #pun-viewtopic, #pun .punbb{font-style: italic}
</style>Изменить/поставить значки возле ссылок "форум" , "Участники" , "Правила" и тд
<style>
#pun #pun-index #pun-navlinks .container #navindex,
#pun #pun-index #pun-navlinks .container #navuserlist,
#pun #pun-index #pun-navlinks .container #navsearch,
#pun #pun-index #pun-navlinks .container #navprofile,
#pun #pun-index #pun-navlinks .container #navpm,
#pun #pun-index #pun-navlinks .container #navadmin,
#pun #pun-index #pun-navlinks .container #navlogout,
#pun #pun-index #pun-navlinks .container #navregister,
#pun #pun-index #pun-navlinks .container #navlogin,
#pun .punbb #pun-navlinks .container #navindex,
#pun .punbb #pun-navlinks .container #navuserlist,
#pun .punbb #pun-navlinks .container #navsearch,
#pun .punbb #pun-navlinks .container #navprofile,
#pun .punbb #pun-navlinks .container #navpm,
#pun .punbb #pun-navlinks .container #navadmin,
#pun .punbb #pun-navlinks .container #navlogout,
#pun .punbb #pun-navlinks .container #navregister,
#pun .punbb #pun-navlinks .container #navlogin
{background-image: url(Рисунок)}
</style>Изменить фон таблиц
<style>
#pun #pun-index #pun-main .category .container table .hasicon .alt1 .tcl,
#pun #pun-index #pun-main .category .container table .hasicon .alt2 .tcl,
#pun #pun-index #pun-main .category .container table .hasicon .alt1 .tc2,
#pun #pun-index #pun-main .category .container table .hasicon .alt2 .tc2,
#pun #pun-index #pun-main .category .container table .hasicon .alt1 .tc3,
#pun #pun-index #pun-main .category .container table .hasicon .alt2 .tc3,
#pun #pun-index #pun-main .category .container table .hasicon .alt1 .tcr,
#pun #pun-index #pun-main .category .container table .hasicon .alt2 .tcr {background-image: url(Рисунок)}
</style>Цвет полосы прокрутки. Только для ИЕ
<style>
html, body{scrollbar-base-color: red}
</style>Убрать слово "Обьявление"
<style>
#pun #pun-index #pun-announcement h2 span {display: none}
</style>Сменить значок в строке адреса браузера
<link rel="shortcut icon" href="ССыль" type="image/x-icon">
Фон форума
<style>
HTML, BODY {background-image: url([color=red]адресс картинки...[/color])}
</style>Отредактировано Эхитор (2008-12-10 20:37:59)
Ширина таблиц на главной странице
<style>
#pun {width:ЗНАЧЕНИЕ}
</style>Вы здесь » :::РАСКРУТКА ФОРУМОВ И ПОМОЩЬ::: » СКРИПТЫ » Простые и чаще используемые скрипты.