Форум
Важная информация!
Правила форума
для обязательного прочтения!
Пожалуйста, не регистрируйтесь на этом форуме с электронными адресами mail.ru, bk.ru, inbox.ru, list.ru - вам может не прийти письмо со ссылкой активации!
Вы можете воспользоваться адресами типа yandex.ru, rambler.ru, gmail.com и т.д.
(забыл / потерял пароль)
Общий FAQ по управлению форумом
FAQ: реклама на форуме
Туториалы по разным функциям ваших форумов
Алфавитный указатель
Интересные решения для форумов
Наши видео-туториалы
Условия пользования сервисом
Ссылки на полезные ресурсы
Последние темы
» ВПНавтор Danny_Marcelo Вчера в 07:47
» Пропала вкладка "Обработка пользователей"
автор Svet007 Ноябрь 23rd 2024, 07:39
» Как найти администратора?
автор PushPayer Ноябрь 21st 2024, 00:58
» Не корректное отображение картинок
автор VENEFICA. Ноябрь 15th 2024, 14:46
» Не меняется название форума
автор Aviator Ноябрь 14th 2024, 15:40
» Дублируется ссылка на форум в боковом меню
автор Чистый сталкер Октябрь 26th 2024, 21:13
» совет админам
автор лексей2222 Октябрь 23rd 2024, 05:45
» Проблема с гугл из-за Hitskin
автор Вултур Октябрь 21st 2024, 15:43
» [решено]Редактирвоание темы
автор AlexDarkTech Октябрь 13th 2024, 08:14
» Пропали иконки редактирования - HEEELP
автор Archaea Сентябрь 23rd 2024, 18:11
Публичное меню...
Участников: 3
Бесплатный форум: форум поддержки :: Взаимопомощь и Поддержка :: Оформление вашего форума :: [Архив] Оформление форума
Страница 1 из 1
Публичное меню...
автор Natsu Март 28th 2014, 01:08
Здраствуйте! 
Могу ли я спросить возможно ли сделать вот такое меню?
Или
Могу ли я спросить возможно ли сделать вот такое меню?
Или
Natsu-
-
Сообщения : 141
Возраст : 29
Регистрация : 2013-06-07
Благодарности : 0
Re: Публичное меню...
автор Dana Domirani Март 28th 2014, 09:42
Можете. Это банальная таблица со ссылками / картинками.
| Где находится CSS? Па > Оформление > Цвета > Каскадная таблица стилей CSS Где искать основные шаблоны? ПА > Оформление > Шаблоны > Общие настройки Где находится раздел для подключения скриптов ПА > Модули > Управление кодами Javascript |
Dana Domirani- Администратор
-
Сообщения : 22996
Возраст : 39
Регистрация : 2008-04-18
Благодарности : 9286
-
Natsu-
-
Сообщения : 141
Возраст : 29
Регистрация : 2013-06-07
Благодарности : 0
Ilya- Помощник
-
Сообщения : 3249
Регистрация : 2011-10-29
Благодарности : 1519
-
Re: Публичное меню...
автор Natsu Март 28th 2014, 13:11
Natsu-
-
Сообщения : 141
Возраст : 29
Регистрация : 2013-06-07
Благодарности : 0
Re: Публичное меню...
автор Dana Domirani Март 28th 2014, 18:11
Дабы тупо не копировать коды с указанных форумов — отдельный пример:
Живой пример
Ставите код в приветствие на главной странице и разбираетесь, какой фрагмент за что отвечает. Меняете тексты, картинки, цвета и так далее.
- Код:
<table style="width: 100%;" class="paneltable" border="0">
<tbody>
<tr>
<td colspan="2" style="vertical-align: top;">
<h1>Добро пожаловать!</h1>
<p style="margin: 0 auto;text-align: center">
<img src="http://i56.servimg.com/u/f56/15/82/36/69/dfdf310.png" alt="" />
</p>
<p>
<img src="http://i56.servimg.com/u/f56/15/82/36/69/hh447710.jpg" style="float:left;margin:0 5px 0 0" alt="" /> Будет Алоэ – будем жить. Сегодня наша беседа идет о Алоэ. С Алоэ я сталкивался сам, видел и у других. Так издревле бывало: Алоэ – много и Алоэ – мало. Величие не в том, чтобы впадать в Алоэ, но в том, чтобы касаться одновременно двух Алоэ и заполнять промежуток между ними. Алоэ как горчица, требует осторожности и знания меры. Боль души иногда сладка, когда заедаешь ее Алоэ. Алоэ – это то, что случается с нами, пока мы строим планы на будущее. Алоэ. Люди лишь воспользовались тем, что нашли в природе. А вот «Эола» – это Алоэ наоборот. Если вы из того поколения, которое ждало 12 долгих лет, чтобы увидеть Алоэ, если вы еще не так стары, но из тех, кому интересно, кого люди ждали 12 чертовых лет, то с радостью сообщаю – Алоэ уже здесь. Алоэ уже перешагнул последнюю грань, отделяющую разумных существ от неразумных, но по улицам не носятся религиозные фанатики с криками «Алоэ, Алоэ!!» — мир, вроде, ничего и не заметил. Пусть Алоэ сияет здоровьем!
</p>
<p style="margin: 0 auto;text-align: center">
<img src="http://i56.servimg.com/u/f56/15/82/36/69/dfdf210.png" alt="" />
</p>
</td>
<td style="width: 280px; text-align: center;" rowspan="2">
<img src="http://i56.servimg.com/u/f56/15/82/36/69/we310.png" alt="" />
</td>
</tr>
<tr>
<td colspan="2" class="miniimg">
<h1>Иконки со ссылками</h1>
<a href="#"><img src="http://i56.servimg.com/u/f56/15/82/36/69/000910.jpg" alt="" title="ссылка 1" /></a><a href="#"><img src="http://i56.servimg.com/u/f56/15/82/36/69/000210.jpg" alt="" title="ссылка 2" /></a><a href="#"><img src="http://i56.servimg.com/u/f56/15/82/36/69/000310.jpg" alt="" title="ссылка 3" /></a><a href="#"><img src="http://i56.servimg.com/u/f56/15/82/36/69/000410.jpg" alt="" title="ссылка 4" /></a><a href="#"><img src="http://i56.servimg.com/u/f56/15/82/36/69/000110.jpg" alt="" title="ссылка 5" /></a>
</td>
</tr>
<tr>
<td style="vertical-align: top;">
<h1>Разделы</h1>
<!-- замените символы # на ссылки -->
<p style="margin: 0 auto;text-align: center">
<img src="http://i56.servimg.com/u/f56/15/82/36/69/dfdf310.png" alt="" />
</p>
<form>
<select onchange="location.href=(form.select.options[form.select.selectedIndex].value)" class="forminput" name="select">
<optgroup label="Основные разделы форума">
<option value="/forum">Главная</option>
<option value="/faq">FAQ</option>
<option value="/search">Поиск</option>
</optgroup>
<optgroup label="Для гостей и партнеров">
<option value="#">Задать вопрос</option>
<option value="#">Гостевая</option>
<option value="#">Реклама</option>
</optgroup>
</select>
</form>
<p style="margin: 0 auto;text-align: center">
<img src="http://i56.servimg.com/u/f56/15/82/36/69/dfdf210.png" alt="" />
</p>
<p>
Алоэ есть. Если верить. И хотеть. В неравной борьбе за Алоэ все равны. Да, мы интеллигентные люди, поэтому и говорим на эту тему. Пусть другие молчат. А мы будем говорить. Если человек знает что он хочет, то он либо мало знает, либо хочет Алоэ.
</p>
</td>
<td style="width:400px; vertical-align: top;">
<h1>Информация</h1>
<div class="novosty">
<p>
2014 Март. Текст новости, например. Сегодня наша беседа идет о Алоэ. С Алоэ я сталкивался сам, видел и у других.
</p>
<p>
2014 Март. Текст новости, например. Сегодня наша беседа идет о Алоэ. С Алоэ я сталкивался сам, видел и у других.
</p>
<p>
2014 Март. Текст новости, например. Сегодня наша беседа идет о Алоэ. С Алоэ я сталкивался сам, видел и у других.
</p>
<p>
2014 Март. Текст новости, например. Сегодня наша беседа идет о Алоэ. С Алоэ я сталкивался сам, видел и у других.
</p>
<p>
2014 Март. Текст новости, например. Сегодня наша беседа идет о Алоэ. С Алоэ я сталкивался сам, видел и у других.
</p>
<p>
2014 Март. Текст новости, например. Сегодня наша беседа идет о Алоэ. С Алоэ я сталкивался сам, видел и у других.
</p>
<p>
2014 Март. Текст новости, например. Сегодня наша беседа идет о Алоэ. С Алоэ я сталкивался сам, видел и у других.
</p>
<p>
2014 Март. Текст новости, например. Сегодня наша беседа идет о Алоэ. С Алоэ я сталкивался сам, видел и у других.
</p>
<p>
2014 Март. Текст новости, например. Сегодня наша беседа идет о Алоэ. С Алоэ я сталкивался сам, видел и у других.
</p>
<p>
2014 Март. Текст новости, например. Сегодня наша беседа идет о Алоэ. С Алоэ я сталкивался сам, видел и у других.
</p>
<p>
2014 Март. Текст новости, например. Сегодня наша беседа идет о Алоэ. С Алоэ я сталкивался сам, видел и у других.
</p>
<p>
2014 Март. Текст новости, например. Сегодня наша беседа идет о Алоэ. С Алоэ я сталкивался сам, видел и у других.
</p>
<p>
2014 Март. Текст новости, например. Сегодня наша беседа идет о Алоэ. С Алоэ я сталкивался сам, видел и у других.
</p>
<p>
2014 Март. Текст новости, например. Сегодня наша беседа идет о Алоэ. С Алоэ я сталкивался сам, видел и у других.
</p>
<p>
2014 Март. Текст новости, например. Сегодня наша беседа идет о Алоэ. С Алоэ я сталкивался сам, видел и у других.
</p>
<p>
2014 Март. Текст новости, например. Сегодня наша беседа идет о Алоэ. С Алоэ я сталкивался сам, видел и у других.
</p>
</div>
</td>
<td class="banners">
<h1>Баннеры</h1>
<a href="#"><img src="http://i56.servimg.com/u/f56/15/82/36/69/e87e5510.png" alt="название баннера 1" title="название баннера 1" /></a><br /><a href="#"><img src="http://i56.servimg.com/u/f56/15/82/36/69/e87e5510.png" alt="название баннера 2" title="название баннера 2" /></a><br /><a href="#"><img src="http://i56.servimg.com/u/f56/15/82/36/69/e87e5510.png" alt="название баннера 3" title="название баннера 3" /></a><br /><a href="#"><img src="http://i56.servimg.com/u/f56/15/82/36/69/e87e5510.png" alt="название баннера 3" title="название баннера 3" /></a><br /><a href="#"><img src="http://i56.servimg.com/u/f56/15/82/36/69/e87e5510.png" alt="название баннера 3" title="название баннера 3" /></a>
</td>
</tr>
</tbody>
</table>
<style type="text/css">
table.paneltable td {
background: #c7dd77;
background: -moz-linear-gradient(top, #c7dd77 1%, #e3f5ab 46%, #f8ffe8 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#c7dd77), color-stop(46%,#e3f5ab), color-stop(100%,#f8ffe8));
background: -webkit-linear-gradient(top, #c7dd77 1%,#e3f5ab 46%,#f8ffe8 100%);
background: -o-linear-gradient(top, #c7dd77 1%,#e3f5ab 46%,#f8ffe8 100%);
background: -ms-linear-gradient(top, #c7dd77 1%,#e3f5ab 46%,#f8ffe8 100%);
background: linear-gradient(to bottom, #c7dd77 1%,#e3f5ab 46%,#f8ffe8 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c7dd77', endColorstr='#f8ffe8',GradientType=0 );
border-radius: 12px;
padding: 5px 10px;
}
/* Заголовки разделов */
.paneltable h1 {
border-bottom: none;
background-color: #fff;
margin: 5px 0;
border-radius: 6px;
padding: 5px;
color: #6BA00D;
font-size: 1.6em;
font-weight: bold;
text-align: center;
}
.paneltable p {
text-align: justify;
font-style: italic;
}
/* ячейка с иконками */
.miniimg {
vertical-align:middle;
height:120px;
text-align:center;
}
/* Иконки со ссылками */
.miniimg img {
border: 5px solid #fff;
margin: 0 5px 5px;
border-radius: 12px;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
/* Иконки со ссылками при наведении */
.miniimg img:hover {
border: 5px solid #6BA00D;
}
/* ячейка с баннерами */
.paneltable td.banners {
vertical-align: top;
text-align: center;
}
/* ячейка с баннерами > настройка баннеров */
.paneltable td.banners img {
border: 3px solid #fff;
margin: 5px 0;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
/* ячейка с баннерами > настройка баннеров при наведении */
.paneltable td.banners img:hover {
border: 3px solid #6BA00D;
}
/* блок с прокруткой */
.novosty {
width: 100%;
height: 250px;
overflow-x: hidden;
overflow-y: scroll;
}
.novosty p {
margin-right: 10px;
}
/* разворачивающийся список */
.paneltable select {
width: 100%;
background-color: #fff;
border: 1px solid #AEEB2E;
border-radius: 6px;
padding: 5px 0;
}
</style>
Живой пример
Ставите код в приветствие на главной странице и разбираетесь, какой фрагмент за что отвечает. Меняете тексты, картинки, цвета и так далее.
| Где находится CSS? Па > Оформление > Цвета > Каскадная таблица стилей CSS Где искать основные шаблоны? ПА > Оформление > Шаблоны > Общие настройки Где находится раздел для подключения скриптов ПА > Модули > Управление кодами Javascript |
Dana Domirani- Администратор
-
Сообщения : 22996
Возраст : 39
Регистрация : 2008-04-18
Благодарности : 9286
-
Natsu-
-
Сообщения : 141
Возраст : 29
Регистрация : 2013-06-07
Благодарности : 0
Re: Публичное меню...
автор Dana Domirani Март 28th 2014, 18:39
Навигатор по ПА > П > Приветствие на главной странице
| Где находится CSS? Па > Оформление > Цвета > Каскадная таблица стилей CSS Где искать основные шаблоны? ПА > Оформление > Шаблоны > Общие настройки Где находится раздел для подключения скриптов ПА > Модули > Управление кодами Javascript |
Dana Domirani- Администратор
-
Сообщения : 22996
Возраст : 39
Регистрация : 2008-04-18
Благодарности : 9286
-
Похожие темы» Как можно закруглить углы у панели меню и выровнять разделы меню по одинаковой ширине?
» Помогите с кнопками меню, чтобы они раскрывались в доп.меню
» Как заменить стандартное меню навигации на разворачивающееся меню?
» Основное меню форума с разворачиающимися меню для отдельных пунктов
» Меню с выпадающими меню подразделов в боковом виджете
» Помогите с кнопками меню, чтобы они раскрывались в доп.меню
» Как заменить стандартное меню навигации на разворачивающееся меню?
» Основное меню форума с разворачиающимися меню для отдельных пунктов
» Меню с выпадающими меню подразделов в боковом виджете
Бесплатный форум: форум поддержки :: Взаимопомощь и Поддержка :: Оформление вашего форума :: [Архив] Оформление форума
Страница 1 из 1
Права доступа к этому форуму:
Вы не можете отвечать на сообщения
Facebook
ВКонтакте
