• Авторизация


Преобразуем верхнее меню сайта 15-05-2013 09:48 к комментариям - к полной версии - понравилось!


Верхнее меню сейчас на сайте не очень симпатично смотрится, поэтому я решила немного его преукрасить.

 

[700x321]

 

Для этого открываю файл .../catalog/view/theme/default/template/common/header.tpl

Нахожу блок, определяющий верхнее меню

<div class="links">

меняю на

<div id="menu">

Дальше нужно задать отображение ссылок также, как в меню, для этого прописываю теги списка <ul>,

каждую ссылку заключаю в теги <li>

<ul>

<li><div class="links"><a href="<?php echo $home; ?>"><?php echo $text_home; ?></a></li>

<li><a href ="#">Оплата</a></li>

<li><a href ="#">Доставка</a></li>

<li><a href ="#">О нас</a></li>

<li><a href ="#">Контакты</a></li>

<li><a href ="#">Карта сайта</a></li>

<li><a href="<?php echo $checkout; ?>"><?php echo $text_checkout; ?></a></li>

</ul>

Теперь верхнее меню такое же, как основное.

Переставлю блок welcome на место поиска с помощью CSS стилей.

Меняю стили так:

для блока поиска:

#header #search {

    position: absolute;

    top: 40px;

    left: 0px;

    width: 180px;

    z-index: 15;

}

для блока welcome:

#header #welcome {

    position: absolute;

    top:10px;

    z-index: 5;

    width: 290px;

    text-align:right;

    text-shadow: 1px 1px 1px #3B2720;

    color: #FFFFFF;
   
    right: 60px;

}

Теперь все блоки на своих местах, такой внешний вид меня устраивает больше.

 

[700x317]

вверх^ к полной версии понравилось! в evernote


Вы сейчас не можете прокомментировать это сообщение.

Дневник Преобразуем верхнее меню сайта | Yuliakir - Дневник Yuliakir | Лента друзей Yuliakir / Полная версия Добавить в друзья Страницы: раньше»