Moushe.ru

Блог обо всём

OcStore 1.5.5.1.1 несколько улучшений (3 часть)



Продолжим наши труды над стандартным шаблоном для OcStore 1.5.5.1.1.

12

Список задач на сегодня:

1. Переместим хлебные крошки

2. Изменим стиль хлебных крошек

3. Поправим стили меню категорий и модулей

Приступим:

1.1. Откроем папку ../catalog/view/theme/default/template/account, во всех файлах этой папки вы увидите строки:

<div class="breadcrumb">
<?php foreach ($breadcrumbs as $breadcrumb) { ?>
<?php echo $breadcrumb['separator']; ?><a href="<?php echo $breadcrumb['href']; ?>"><?php echo $breadcrumb['text']; ?></a>
<?php } ?>
</div>

(они отвечают за вывод хлебных крошек) нам нужно вырезать их и вставить после этих слов (первая строка):

<?php echo $header; ?>

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

1.2. Откроем папку ../catalog/view/theme/default/template/affiliate, во всех файлах этой папки вы увидите строки:

<div class="breadcrumb">
<?php foreach ($breadcrumbs as $breadcrumb) { ?>
<?php echo $breadcrumb['separator']; ?><a href="<?php echo $breadcrumb['href']; ?>"><?php echo $breadcrumb['text']; ?></a>
<?php } ?>
</div>

(они отвечают за вывод хлебных крошек) нам нужно вырезать их и вставить после этих слов (первая строка):

<?php echo $header; ?>

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

1.3. Откроем папку ../catalog/view/theme/default/template/checkout,  и в файлах cart.tpl и checkout.tpl вы увидите строки:

<div class="breadcrumb">
<?php foreach ($breadcrumbs as $breadcrumb) { ?>
<?php echo $breadcrumb['separator']; ?><a href="<?php echo $breadcrumb['href']; ?>"><?php echo $breadcrumb['text']; ?></a>
<?php } ?>
</div>

(они отвечают за вывод хлебных крошек) нам нужно вырезать их и вставить после этих слов (первая строка):

<?php echo $header; ?>

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

1.4. Откроем папку ../catalog/view/theme/default/template/error, и в файле  not_found.tpl вы увидите строки:

<div class="breadcrumb">
<?php foreach ($breadcrumbs as $breadcrumb) { ?>
<?php echo $breadcrumb['separator']; ?><a href="<?php echo $breadcrumb['href']; ?>"><?php echo $breadcrumb['text']; ?></a>
<?php } ?>
</div>

(они отвечают за вывод хлебных крошек) нам нужно вырезать их и вставить после этих слов (первая строка):

<?php echo $header; ?>

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

1.5. Откроем папку ../catalog/view/theme/default/template/information, во всех файлах этой папки вы увидите строки:

<div class="breadcrumb">
<?php foreach ($breadcrumbs as $breadcrumb) { ?>
<?php echo $breadcrumb['separator']; ?><a href="<?php echo $breadcrumb['href']; ?>"><?php echo $breadcrumb['text']; ?></a>
<?php } ?>
</div>

(они отвечают за вывод хлебных крошек) нам нужно вырезать их и вставить после этих слов (первая строка):

<?php echo $header; ?>

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

1.6. Откроем папку ../catalog/view/theme/default/template/product,  и в файлах category.tpl, compare.tpl, manufacturer_info.tpl, manufacturer_list.tpl, product.tpl, search.tpl и special.tpl вы увидите строки:

<div class="breadcrumb">
<?php foreach ($breadcrumbs as $breadcrumb) { ?>
<?php echo $breadcrumb['separator']; ?><a href="<?php echo $breadcrumb['href']; ?>"><?php echo $breadcrumb['text']; ?></a>
<?php } ?>
</div>

(они отвечают за вывод хлебных крошек) нам нужно вырезать их и вставить после этих слов (первая строка):

<?php echo $header; ?>

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

P.S. Иногда первая строка имеет вот такой вид:

<?php echo $header; ?><?php echo $column_left; ?><?php echo $column_right; ?>

тогда установите курсор после:

<?php echo $header; ?>

и нажмите два раза Enter и на получившуюся пустую строку вставляйте код наших хлебных крошек.

Первый этап выполнен, переходим ко второму.

2. Откроем файл ../catalog/view/theme/default/stylesheet/stylesheet.css и вместо этих строк (402-417):

.breadcrumb {
background: url('../image/background.png') repeat-x transparent;
border: 1px solid #DBDEE1;
-webkit-border-radius: 7px 7px 0px 0px;
-moz-border-radius: 7px 7px 0px 0px;
-khtml-border-radius: 7px 7px 0px 0px;
border-radius: 7px 7px 0px 0px;
color: #CCCCCC;
height: 30px;
line-height: 30px;
margin-bottom: 10px;
padding-left: 10px;
}
.breadcrumb a {
color:#000;
}

вставим эти:

.breadcrumb {
background: #f9f9f9;
border: 1px solid #DBDEE1;
border-radius: 0 0 7px 7px;
color: #CCCCCC;
height: 30px;
line-height: 30px;
margin-bottom: 10px;
padding-left: 10px;
}
.breadcrumb a {
color:#000;
text-decoration: none;
}
.breadcrumb a:hover {
color: #888;
}

3.1. Откроем файл ../catalog/view/theme/default/stylesheet/stylesheet.css и вместо этих строк (321-334):

#menu {
background: #585858;
border-bottom: 1px solid #000000;
height: 37px;
margin-bottom: 15px;
-webkit-border-radius: 5px 5px 5px 5px;
-moz-border-radius: 5px 5px 5px 5px;
-khtml-border-radius: 5px 5px 5px 5px;
border-radius: 5px 5px 5px 5px;
-webkit-box-shadow: 0px 2px 2px #DDDDDD;
-moz-box-shadow: 0px 2px 2px #DDDDDD;
box-shadow: 0px 2px 2px #DDDDDD;
padding: 0px 5px;
}

вставим эти:

#menu {
background: #585858;
height: 37px;
margin: 0;
padding: 0;
}

вместо этих строк (332-337):

#menu > ul > li {
position: relative;
float: left;
z-index: 20;
padding: 6px 5px 5px 0px;
}

вставим эти:

#menu > ul > li {
position: relative;
float: left;
z-index: 20;
}

вместо этих строк (339-349):

#menu > ul > li > a {
font-size: 13px;
color: #FFF;
line-height: 14px;
text-decoration: none;
display: block;
padding: 6px 10px 6px 10px;
margin-bottom: 5px;
z-index: 6;
position: relative;
}

вставим эти:

#menu > ul > li > a {
font-size: 13px;
color: #FFF;
line-height: 14px;
text-decoration: none;
display: block;
padding: 11px 10px 12px 10px;
z-index: 6;
position: relative;
}

вместо этих строк (349-355):

#menu > ul > li:hover > a {
background: #000000;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;
}

вставим эти:

#menu > ul > li:hover > a {
background: #fff;
color: #000;
}

вместо этих строк (650-653):

.box {
margin-bottom: 20px;
text-align: center;
}

вставим эти:

.box {
margin-top: 10px;
margin-bottom: 10px;
text-align: center;
}

3.2. Откроем файл ../catalog/view/theme/default/stylesheet/slideshow.css и вместо этих строк (90-94):

.slideshow .nivoSlider {
position: relative;
background: #fff url('../image/loading.gif') no-repeat 50% 50%;
margin-bottom: 20px;
}

вставим эти:

.slideshow .nivoSlider {
position: relative;
background: #fff url('../image/loading.gif') no-repeat 50% 50%;
margin-top: 10px;
margin-bottom: 10px;
}

На сегодня всё, следите за новостями.

9 Комментариев

  1. Владимир Иванов

    22.12.2013 at 19:08

    Опишите пожалуйста как менять фоны на страницах ocStore? Чтоб можно было на задний фон поставить одну красивую картинку и она потом отображалась на всех вкладках. На просторах интернета я нашел такой способ: http://cartopen.ru/index.php?route=product/product&product_id=37
    Вроде все сделал, все получилось, но фон устанавливается только на главную страницу, а на остальных страницах появляется белый фон снова. А когда нажимаешь кнопку «купить» то снова появляется фон как положено, но при этом все остальное, кроме надписей, становится прозрачным. Надеюсь я понятно описал проблемы вышеуказанного способа. В очередной раз надеюсь на Вашу помощь.

  2. Добрый день!
    столкнулся с тем, что хлебные крошки «уехали» вправо и расползлись на 2 строки.
    Подскажите способ вернуть из в одну строку.
    заранее спасибо!

    • Добрый, а ссылку на сайт прикрепить религия не позволяет?

    • С файлами работаете специальным файловым редактором? Notepad++ или аналогичный редактор кода, обычным блокнотом? Если текстовыми редакторами Microsoft Word и т.д. предназначенными совсем для другого то вполне частая ошибка + уберите лишние пробелы или перенос строки в своём category.tpl или vqmod файле.

  3. работаю в Notepad++ , попробую поискать пробелы/ переносы, спасибо

  4. кодировка в порядке

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

Your email address will not be published.

*

CAPTCHA image
*

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

Вверх ↑



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