Moushe.ru

Блог обо всём

OpenCart 1.5.3 панель навигации



Сегодня мы с вами сделаем новую панель навигации в верхней части шапки сайта.

1

1. Откроем файл header.tpl (../catalog/view/theme/default/template/common) и найдём это (63-70):

<div id="welcome">
<?php if (!$logged) { ?>
<?php echo $text_welcome; ?>
<?php } else { ?>
<?php echo $text_logged; ?>
<?php } ?>
</div>
<div class="links"><a href="<?php echo $home; ?>"><?php echo $text_home; ?></a><a href="<?php echo $wishlist; ?>" id="wishlist-total"><?php echo $text_wishlist; ?></a><a href="<?php echo $account; ?>"><?php echo $text_account; ?></a><a href="<?php echo $shopping_cart; ?>"><?php echo $text_shopping_cart; ?></a><a href="<?php echo $checkout; ?>"><?php echo $text_checkout; ?></a></div>

добавим к этому коду две строки:

<div id="navi">
<div id="welcome">
<?php if (!$logged) { ?>
<?php echo $text_welcome; ?>
<?php } else { ?>
<?php echo $text_logged; ?>
<?php } ?>
</div>
<div class="links"><a href="<?php echo $home; ?>"><?php echo $text_home; ?></a><a href="<?php echo $wishlist; ?>" id="wishlist-total"><?php echo $text_wishlist; ?></a><a href="<?php echo $account; ?>"><?php echo $text_account; ?></a><a href="<?php echo $shopping_cart; ?>"><?php echo $text_shopping_cart; ?></a><a href="<?php echo $checkout; ?>"><?php echo $text_checkout; ?></a></div>
</div>

вырезаем получившийся код и вставляем его после этого (45-47):

</head>
<body>
<div id="container">

2. Откроем файл stylesheet.css и удалим это (290-317):

#header #welcome {
position: absolute;
top: 47px;
right: 0px;
z-index: 5;
width: 298px;
text-align: right;
color: #999999;
}
#header .links {
position: absolute;
right: 0px;
bottom: 3px;
font-size: 10px;
padding-right: 10px;
}
#header .links a {
float: left;
display: block;
padding: 0px 0px 0px 7px;
color: #38B0E3;
text-decoration: none;
font-size: 12px;
}
#header .links a + a {
margin-left: 8px;
border-left: 1px solid #CCC;
}

после этого (88-90):

#column-right + #content {
margin-right: 195px;
}

вставим это:

#navi {
background: #585858;
border-bottom: 1px solid #000000;
height: 37px;
margin-bottom: 15px;
-webkit-border-radius: 0px 0px 5px 5px;
-moz-border-radius: 0px 0px 5px 5px;
-khtml-border-radius: 0px 0px 5px 5px;
border-radius: 0px 0px 5px 5px;
-webkit-box-shadow: 0px 2px 2px #DDDDDD;
-moz-box-shadow: 0px 2px 2px #DDDDDD;
box-shadow: 0px 2px 2px #DDDDDD;
}
#welcome {
display: inline-block;
color: #fff;
padding-top: 5px;
padding-left: 10px;
}
#welcome a {
color: #fff;
text-decoration: none;
}
#welcome a:hover {
color: #38B0E3;
text-decoration: underline;
}
.links a {
padding: 0px 0px 0px 7px;
color: #fff;
text-decoration: none;
}
.links a:hover {
color: #38B0E3;
text-decoration: underline;
}
.links {
display: inline-block;
padding-left: 160px;
}

На сегодня всё, до новых встреч. Следите за новостями. Улыбка

2 Комментария

  1. Сделайте пожалуйста урок, как переназначить кнопки на новой панели…. ОС 1.5.3.1… 🙂

Добавить комментарий

Your email address will not be published.

*

CAPTCHA image
*

© 2016 Moushe.ru При копировании материалов, ссылка на нас обязательна!

Вверх ↑



Яндекс.Метрика