1. Приветствуем Вас на неофициальном форуме технической поддержки XenForo на русском языке. XenForo - новый и перспективный форумный движок от бывших создателей vBulletin.

Как создать вертикальное меню для портала XenForo?

Тема в разделе "Вопросы по стилям, изменения в CSS и шаблонах", создана пользователем rango177, 23 июл 2012.

Загрузка
  1. rango177

    rango177 Местный

    Регистрация:
    31.12.11
    Сообщения:
    26
    Симпатии:
    1
    Версия XF:
    1.2.3
    как создать вертикальное меню для портала xenforo что бы примерно выглядело вот так.
    [​IMG]
    Или в интернете много разновидностей вертикального меню где предоставляют html код, css код и png картинку. Помогите пожалуйста, как установить меню. Спасибо
     
  2. exarh

    exarh Местный

    Регистрация:
    05.11.10
    Сообщения:
    364
    Симпатии:
    78
    Версия XF:
    1.1.3
    Все очень просто. Изучайте HTML! А вопрос вообще не в той теме задали. Вы спросите лучше как создать блок портала.
     
  3. rango177

    rango177 Местный

    Регистрация:
    31.12.11
    Сообщения:
    26
    Симпатии:
    1
    Версия XF:
    1.2.3
    нужно было быстрое решение. мог бы и найтись добрый дядя - написать мини гайдик как устанавливать. Думаю это многим нужно
     
  4. rango177

    rango177 Местный

    Регистрация:
    31.12.11
    Сообщения:
    26
    Симпатии:
    1
    Версия XF:
    1.2.3
  5. KakBeOlolo

    KakBeOlolo Местный

    Регистрация:
    08.10.11
    Сообщения:
    511
    Симпатии:
    91
    Версия XF:
    1.1.2
    Это HTML меню
    Код:
    <ul id=vm>
    <li> <a href="тут ссылка"><b>название кнопки</b></a></li>
    <li><a href="тут ссылка"><b>название кнопки</b></a></li>
    <li> <a href="тут ссылка"><b>название кнопки</b></a></li>
    </ul>

    Это CSS стиль для него, у меня он такой:
    Код:
    #vm{
    margin:0px;
    padding:0;
    border-bottom:0px;
    list-style:none;
    width:220px;
    font:12px Verdana ;
    }
    #vm a{
    display: block;
    padding: 10px;
    text-decoration: none;
    border-top:1px solid #FFFFFF;
    color: #FFFFFF;
    background:#000000;
    border: solid 2px #b3bdc4!important;
    border-radius: 10px!important;
     
    background: -moz-linear-gradient(#5a8cb0, #00345e)!important;
    background: -webkit-gradient(linear, center top, center bottom, from(#5a8cb0), to(#00345e))!important;
    filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#5a8cb0,endColorStr=#00345e)!important;
    background: -o-linear-gradient(top,#5a8cb0,#00345e);
     
    }
    #vm a:hover{
    background:#ecf7ff!important;
    color: #00345e;
     
    background: -moz-linear-gradient(#ecf7ff, #dbf0ff)!important;
    background: -webkit-gradient(linear, center top, center bottom, from(#ecf7ff), to(#dbf0ff))!important;
    filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#ecf7ff,endColorStr=#dbf0ff)!important;
    background: -o-linear-gradient(top,#ecf7ff,#dbf0ff);
    border: solid 2px #b3bdc4!important;
    border-radius: 10px!important;
    }
    * html #nav a{height:1%}

    #vm a:hover - это стиль при наведении курсора
     
    rango177 нравится это.
  6. Witold

    Witold Местный

    Регистрация:
    19.01.12
    Сообщения:
    132
    Симпатии:
    23
    Версия XF:
    1.2.2
    А как это все и куда вписывать ?
     
  7. KakBeOlolo

    KakBeOlolo Местный

    Регистрация:
    08.10.11
    Сообщения:
    511
    Симпатии:
    91
    Версия XF:
    1.1.2
    HTML меню вписывать в блок для портала, а CSS стиль для него можно например в шаблон EXTRA.CSS пихнуть

    Что бы стиль сделать для кнопок тебе пригодится:
    http://css-tricks.com/examples/ButtonMaker/#
    http://www.colorzilla.com/gradient-editor/
     

Поделиться этой страницей