Единый форум поддержки

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

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


Вы здесь » Единый форум поддержки » Вопросы по оформлению форума » Дизайн своими руками


Дизайн своими руками

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

1

Доброго времени суток!
Обращаюсь с такой проблемы. Совсем недавно создала форум (ролевую игру), поставила шаюблн "Mybb: Amulet". Очень хотелось бы создать на этой базе красивый дизайн. Уже нашла, как ставить шапки, как делать фон. А с остальными "тонкостями" уже начинаются проблемы.

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

0

2

Theriona написал(а):

Доброго времени суток!
Обращаюсь с такой проблемы. Совсем недавно создала форум (ролевую игру), поставила шаюблн "Mybb: Amulet". Очень хотелось бы создать на этой базе красивый дизайн. Уже нашла, как ставить шапки, как делать фон. А с остальными "тонкостями" уже начинаются проблемы.

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

Все коды собраны в 2 темах:
Типовые Вопросы (ЧаВо)
Каталог скриптов/CSS

Изменить иконки можно так:

Код:
<style type="text/css"> /* Ставим новые иконки  */
.punbb table Div.icon {float: left; display: block; width: 70px; height: 70px; border-style: none;
background-image: url(http://...); 
background-repeat: no-repeat;
position: relative; margin-right: 13px; margin-left: 10px;}
TR.inew Div.icon {
background: url(http://...) no-repeat;}
TR.isticky Div.icon {
background: url(http://...) no-repeat;}
TR.iclosed Div.icon {
background: url(http://...) no-repeat;}
#pun-stats ul.container {background-image: url("http://..."); background-repeat: no-repeat; }/* Иконка статистики */
</style>

Html верх

Либо: Общие вопросы от новичков (42)
Либо: Иконки для разделов и тем

+1

3

Спасибо большое! Не разглядела эти темы, эх... А где сам этот код должен находиться, поясните пожалуйста...

0

4

Theriona написал(а):

Спасибо большое! Не разглядела эти темы, эх... А где сам этот код должен находиться, поясните пожалуйста...

Админка - Настройки - html верх

0

5

Поставила в HTML верх - ничего не поменялось...
вот на всякий случай адрес:
http://ottomans.rolevaya.ru
и ссылки на иконки:
http://s52.radikal.ru/i137/1407/75/4b7ab67b034b.png (нет новых сообщений)
http://s020.radikal.ru/i713/1407/23/46b0c8567372.png (есть новые сообщения)
У меня какой-то косяк...

Отредактировано Theriona (Вт, 8 Июл 2014 02:54:52)

0

6

Обе иконки у вас прописаны для форума с ID 2 (forum_f2), которого на вашем форуме не существует. Замените цифры в коде на существующий ID форума.

<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(http://s52.radikal.ru/i137/1407/75/4b7ab67b034b.png);  }
tr#forum_f2 div.inew {background-image: url(http://s52.radikal.ru/i137/1407/b3/4fbf2521579d.png);  }

</style>

Красный — для иконок "Нет новых сообщений".
Зеленый — для иконок "Есть новые сообщения".

Можно прописать для нескольких форумов, размножив две выделенные желтым фоном строчки, примерно так это будет выглядеть:

<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;}

/* Иконки разделов для форума с ID 1 */
tr#forum_f1 div.icon {background-image: url(http://s52.radikal.ru/i137/1407/75/4b7ab67b034b.png);  }
tr#forum_f1 div.inew {background-image: url(http://s52.radikal.ru/i137/1407/b3/4fbf2521579d.png);  }

/* Иконки разделов для форума с ID 3 */
tr#forum_f3 div.icon {background-image: url(http://s52.radikal.ru/i137/1407/75/4b7ab67b034b.png);  }
tr#forum_f3 div.inew {background-image: url(http://s52.radikal.ru/i137/1407/b3/4fbf2521579d.png);  }

/* Иконки разделов для форума с ID 4 */
tr#forum_f4 div.icon {background-image: url(http://s52.radikal.ru/i137/1407/75/4b7ab67b034b.png);  }
tr#forum_f4 div.inew {background-image: url(http://s52.radikal.ru/i137/1407/b3/4fbf2521579d.png);  }
</style>

Синим отмечены комментарии для понятности.

ID можно узнать наведя мышкой на такой форум:
http://sd.uploads.ru/AH6Si.jpg

0

7

Большое спасибо! А есть ли возможность сделать картинку обтекаемой текстом (в сообщении)? Если да, то каким образом? Заранее благодарю за ответ!

0

8

Theriona, скрипт обтекания изображения текстом (ставится в HTML-низ)

Код:
<!--обтекание изображения 2.4.4-->
<script language="javascript">
$(function(){
$('td#button-link').before('<td id="floatbut" style=\'background-image:url("http://s002.radikal.ru/i198/1009/43/f183caeae434.gif")\'></td>');
$('#floatbut, .vibor').click(function(){
$('div#float').toggle();});
  });
elm=document.getElementsByTagName("div")
for(x in elm) if(elm[x].className=="post-content") 
{
post = elm[x].innerHTML;
if(post.indexOf("[/float]") != -1) {
floats = /\[float=(.*?)\]([^\[]{1,11000})\[\/float\]/gi
elm[x].innerHTML = elm[x].innerHTML.replace(floats, "<span style='float: $1; margin: 15px; text-align: $1;'>$2</span>")
}}
</script>
<div id="float" style="display:none;background:#FFFFCC;border:1px solid black; width:auto; padding:8px; position:absolute; margin-top:-32%; margin-left:35%; z-index:20">
<div><strong>Направление обтекания</strong></div><br>
<div align="center">
<img class="vibor" src="http://s001.radikal.ru/i193/1009/96/695abc799ddb.png" title="left" onclick="bbcode('[float=left]', '[/float]')" />
<img class="vibor" src="http://s002.radikal.ru/i199/1009/ac/95c10fcc7d82.png" title="right" onclick="bbcode('[float=right]', '[/float]')" />
</div></div>

+1

9

Ого, какой огромный! А в самих сообщениях на форуме что-то вставляется или там только BB-коды? Потому что если это вставляется в HTML-низ, то это обтекание будет постоянным... я правильно поняла?

Отредактировано Theriona (Ср, 16 Июл 2014 12:36:31)

0

10

Theriona, нет, не постоянным. После установки скрипта в HTML-низ, на панели инструментов над формой ответа появляется новая иконка: вот такая, с собачкойhttp://www.kolobok.us/smiles/standart/mosking.gif

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

После клика на его, в текст сообщения вставляется BB-код, внутрь которого вы обычным образом вставляете изображение, затем пишете текст сообщения дальше. В результате получается обтекание картинки текстом. Если писать сообщение, не совершая перечисленных манипуляций, то автоматического обтекания не произойдёт.

0

11

О, спасибо!
Теперь вопрос касаемо шапки: можно ли убрать значок дизайна Amulet и оставить только шапку, сохранив её размер? Я в своё время находила три скрипта для шапки:
1) Шапка по центру, в своём размере, но есть значок
2) Шапка справа, стала меньше, но значка нет
3) Шапка по центру, стала меньше, и значка опять-таки нет.
Варианта три, и первый самый лучший... но значок! Если его возможно убрать, то каким образом?

0


Вы здесь » Единый форум поддержки » Вопросы по оформлению форума » Дизайн своими руками