Изменение Стилистики!
#1
Отправлено 22 Май 2013 - 23:16
Я наверное уже вас достала....
Мне необходимо разобрать следующие вопросы с темой Техника:
1. Заменить фон
2. Это товары на главной, необходимо добавить описание и растянуть, чтобы товары были в списком, а не таблицей.
3. кнопку подробнее сделать текстом после описания и вставить кнопку купить, которая переходит на быстрый заказ
4. убрать
5. Выделить цветом и поменять цвет текста
6. перенести меню под слайдер
7. изменить стилистику поиска (поменять цвет и иконку)
8. контакты спустить чуть ниже и добавить перед номером телефона иконку. также увеличить текст
все показано на картинке
SL-206585
#2
Отправлено 23 Май 2013 - 03:46
http://forum.storela...ю-заменить-фон/
2. обсуждалось в сл.ветке форума:
http://forum.storela...ак-в-бэк-офисе/
3.Подробнее: сайт - редактор шаблонов - main.css:
.btn-success2 { background-color: #000000; color: #FFFFFF; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); }замените на:
.btn-success2 { color: #000; }Купить в один клик:
http://forum.storela...кко/#entry59475
4. http://forum.storela...латы-с-главной/
5. main.css в самом низу пропишите:
.menu_main { background: ваше значение цвета для фона ; } .menu_main a{ color: ваше значение цвета для текста ; }
6. http://forum.storela...еста/#entry2072
7. main.css найдите:
.header .form-search { border: 1px solid #E8E8E8; margin: 5px 24px 5px 0; overflow: hidden; padding: 7px 11px 7px 8px; } .header .form-search button { background: url("http://test-storeland.storeland.net/top_search_button.gif") no-repeat scroll left top transparent; float: right; height: 21px; overflow: hidden; width: 20px; }и измените стили на необходимые
8. main.css найдите:
.contacts { vertical-align: middle; }
вставьте туда необходимые стили, например margin-top: 20px; font-weight:bold; и прочие
#3
Отправлено 23 Май 2013 - 08:08
Цитата
тему с этим вопросом уже читала, но ничего не получается у меня.
#4
Отправлено 23 Май 2013 - 08:46
Цитата
#5
Отправлено 23 Май 2013 - 09:12
Цитата
#6
Отправлено 23 Май 2013 - 09:31
Цитата
.menu_main {
background: ваше значение цвета для фона ;
}
.menu_main a{
color: ваше значение цвета для текста ;
}
необходимо все выделенное взять в один фон.
#7
Отправлено 23 Май 2013 - 10:00
.span8 { background: #EDEDED; padding-top: 10px; padding-left: 1%; }и заменить в строке
background: #EDEDED;значение цвета - #EDEDED, или же вообще удалить всю эту строку.
#8
Отправлено 23 Май 2013 - 10:05
Цитата
не нашла необходимой информации.мне нужно просто переместить меню под слайдер из левой колонки в правую
#9
Отправлено 23 Май 2013 - 10:20
Цитата
2. Это товары на главной, необходимо добавить описание и растянуть, чтобы товары были в списком, а не таблицей.
3. кнопку подробнее сделать текстом после описания и вставить кнопку купить, которая переходит на быстрый заказ
5. Выделить цветом и поменять цвет текста
6. перенести меню под слайдер
кто поможет с тем что осталось?
#10
Отправлено 23 Май 2013 - 11:14
<!-- Каталог товаров --> <div class="menu_main"> <span class="link_nav"></span><a href="#" class="link_nav">Каталог</a> <a href="{CATALOG_URL}" title="Каталог" style="text-decoration: none"><h4 class="hidden-phone">Каталог</h4></a> {%IFNOT catalog_full_empty%} {%FOR catalog_full%} {% IF catalog_full.FIRST %}<ul>{% ENDIF %} <li {% IF catalog_full.CURRENT %}class="open"{% ELSEIF catalog_full.CURRENT_PARENT %}class="open"{% ENDIF %}> <a href="{catalog_full.URL}"{% IF catalog_full.CURRENT %}class="selected"{% ENDIF %}>{catalog_full.NAME}</a><span class="icons"{% IFNOT catalog_full.ISSET_SUB %}style="display: none;"{% ENDIF %}></span> {% IF catalog_full.ISSET_SUB=0 %}</li>{% ENDIF %} {% IF catalog_full.LAST %}{%FOR out%}</ul>{%IFNOT catalog_full.out.LAST%}</li>{%ENDIF%}{%ENDFOR%}{% ENDIF %} {%ENDFOR%} {%ENDIF%} </div>и удалите его с того места, где он стоял. Теперь вставьте его перед блоком
<!-- Список товаров на главной -->Теперь в файле bootstrap-responsive.min.css найдите блок и замените его на
.menu_main li { display: block; text-align: left; width: auto; margin: 0px; line-height: 1.2; }и замените его на
.menu_main li { display: inline-block; text-align: left; width: auto; line-height: 1.2; margin-left: 26px; }
2. Чтобы товары на главной отображались списком Вам необходимо найти в шаблоне HTML блок
<!-- Список товаров на главной --> {% IFNOT index_page_goods_empty %} <ul class="products-grid"> {% FOR index_page_goods %} <li class="span3 item {index_page_goods.index0 | is_divided("3","first","")} {index_page_goods.index | is_divided("3","last","")}"> <div class="product-box"> <div class="span12"> <a title="{index_page_goods.NAME}" href="{index_page_goods.URL_MIN_PRICE_NOW | url_amp}"> <div class="product-image" style="background: url('{% IF index_page_goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-small.png{% ELSE %}{index_page_goods.IMAGE_SMALL}{% ENDIF %}') no-repeat center center; background-size: contain; /* IE8 */ -ms-filter:'progid:DXImageTransform.Microsoft.AlphaImageLoader(src='{% IF index_page_goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-small.png{% ELSE %}{index_page_goods.IMAGE_SMALL}{% ENDIF %}',sizingMethod='scale')'\9; /* IE < 8 */ filter:progid:DXImageTransform.Microsoft.AlphaImageLoader( src='{% IF index_page_goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-small.png{% ELSE %}{index_page_goods.IMAGE_SMALL}{% ENDIF %}', sizingMethod='scale')\9; background-image: none\9; /* IE ≤ 9.0 */"> </div></a> </div> <div class="quick-shop"> <div class="bg-quick-shop"> <form action="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}" method="post" class="goodsListItemCatalogueAddToCartButton product-form-{index_page_goods.MIN_PRICE_NOW_ID}"> <div> <input type="hidden" name="hash" value="{HASH}" /> <input type="hidden" name="form[goods_from]" value="{index_page_goods.GOODS_FROM}" /> <input type="hidden" name="form[goods_mod_id]" value="{index_page_goods.MIN_PRICE_NOW_ID}" /> <a onclick="$('.product-form-{index_page_goods.MIN_PRICE_NOW_ID}').attr('rel', 'quick').submit();return false;" title="Быстро оформить заказ"> </a> </div> </form> </div> </div> <table style="width: 100%;"> <tr><td height="50" style="text-align: center"> <div class="product-name"> <h2><a title="{index_page_goods.NAME}" href="{index_page_goods.URL_MIN_PRICE_NOW | url_amp}" style="*height:;">{index_page_goods.NAME}</a></h2> </div> </td></tr> <tr><td height="50" style="text-align: center"> <button onclick="document.location='{index_page_goods.URL_MIN_PRICE_NOW | url_amp}';return false;" class="btn btn-success2" title="Узнать подробнее о «{index_page_goods.NAME}»" type="button">Подробнее</button> </td></tr> </table> </div> </li> {% ENDFOR index_page_goods %} </ul> {% ENDIF %} <!-- /Список товаров на главной -->и замените его на
<!-- Список товаров на главной --> {% IFNOT index_page_goods_empty %} <ol class="span7 products-list" style="*padding: 0px;"> {% FOR index_page_goods %} <li class="span7 item"> <div class="span66 product-box"> <div class="span5"> <a href="{index_page_goods.URL | url_amp}" title="{index_page_goods.NAME}" class="thumbnail"><img class="goods-image-other" src="{% IF index_page_goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-other.png{% ELSE %}{index_page_goods.IMAGE_OTHER}{% ENDIF %}" alt="{index_page_goods.NAME}" /></a> </div> <div class="quick-shop"> <div class="bg-quick-shop"> <form action="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}" method="post" class="goodsListItemCatalogueAddToCartButton product-form-{goods.MIN_PRICE_NOW_ID}"> <div> <input type="hidden" name="hash" value="{HASH}" /> <input type="hidden" name="form[goods_from]" value="{index_page_goods.GOODS_FROM}" /> <input type="hidden" name="form[goods_mod_id]" value="{index_page_goods.MIN_PRICE_NOW_ID}" /> <a onclick="$('.product-form-{index_page_goods.MIN_PRICE_NOW_ID}').attr('rel', 'quick').submit();return false;" title="Быстро оформить заказ"> </a> </div> </form> </div> </div> <div class="span6 product-shop"> <div class="f-fix"> <h2 class="product-name"><a href="{index_page_goods.URL | url_amp}" title="{index_page_goods.NAME}">{index_page_goods.NAME}</a></h2> <div class="price-box"> <span class="regular-price"> <span class="price">{index_page_goodsindex_page_goods.MIN_PRICE_NOW | money_format}</span> </span> {% IF index_page_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT>index_page_goods.MIN_PRICE_NOW %} <span class="old-price" style="padding-left:5px;"> <span class="price">{index_page_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT | money_format}</span> </span> {% ELSEIF index_page_goods.MIN_PRICE_OLD>index_page_goods.MIN_PRICE_NOW %} <span class="old-price" style="padding-left:5px;"> <span class="price">{index_page_goods.MIN_PRICE_OLD | money_format}</span> </span> {% ENDIF %} </div> <p><button type="button" title="Добавить товар в корзину" class="btn btn-success" onclick="$('.product-form-{index_page_goods.MIN_PRICE_NOW_ID}').submit();return false;"><i class="icon-ok icon-white"></i> Добавить в корзину</button> </p> {% IF index_page_goods.DESCRIPTION_SHORT %} <div class="desc std"> <div class="htmlDataBlock"> {index_page_goods.DESCRIPTION_SHORT} <a href="{index_page_goods.URL | url_amp}" title="{index_page_goods.NAME}" class="link-more">узнать больше...</a> </div> </div> {% ENDIF %} <ul class="add-to-links"> <li><a href="{index_page_goods.URL | url_amp}" class="link-wishlist" title="Перейти на страницу информации о {index_page_goods.NAME}">Подробней</a></li> <!-- Если в тарифном плане подключен модуль сравнения товаров --> {% IF TARIFF_FEATURE_GOODS_COMPARE %} <!-- Если не выключен модуль сравнения товаров в настройках магазина --> {% IFNOT SETTINGS_COMPARE_DISABLE %} <li> <span class="separator">|</span> {% IF goods.IS_HAS_IN_COMPARE_LIST %} <a title="Убрать товар из списка сравнения с другими товарами" href="{COMPARE_DELETE_URL}?id={index_page_goods.MIN_PRICE_NOW_ID}&return_to={CURRENT_URL | urlencode}" class="link-compare">убрать из сравнения</a> {% ELSE %} <a title="Добавить товар к списку сравнения с другими товарами" href="{COMPARE_ADD_URL}?id={index_page_goods.MIN_PRICE_NOW_ID}&from={index_page_goods.GOODS_FROM}&return_to={CURRENT_URL | urlencode}" class="link-compare">Сравнить</a> {% ENDIF %} </li> {% ENDIF %} {% ENDIF %} </ul> </div> </div> <br class="clear" /> </div> </li> {% ENDFOR %} </ol> {% ENDIF %} <!-- /Список товаров на главной -->В разделе Товары-Товары- Товары на главной к каждому товару можно сделать короткое описание, которое будет выводиться
#11
Отправлено 23 Май 2013 - 19:13
Цитата
но это я думаю, можно будет просто скопировать например из карточки товара?
Цитата
#12
Отправлено 24 Май 2013 - 04:55
Цитата
но это я думаю, можно будет просто скопировать например из карточки товара?
Да, код будет аналогичный, только изменятся переменные которые выводят информацию о товаре.
Цитата
В данном случае вам необходимо провести предложенные операции только уже с блоком
<!-- Блок навигации --> {% IFNOT menu_empty %} <ul class="span44 links"> {% FOR menu %} {% FOR header %} {% FOR links %} <li {% IF menu.header.links.first %}class="first"{% ELSEIF menu.header.links.last %}class="last"{% ENDIF %}> <a href="{menu.header.links.URL}" {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %} class="{% IF menu.header.links.NAME=Каталог %}catalog{% ELSEIF menu.header.links.NAME=Каталог товаров %}catalog{% ELSEIF menu.header.links.NAME=Акции %}present{% ELSEIF menu.header.links.NAME=Акции магазина %}present{% ELSEIF menu.header.links.NAME=Доставка %}clock{% ELSEIF menu.header.links.NAME=Контакты %}address{% ELSEIF menu.header.links.NAME=Связь с администрацией %}address{% ELSEIF menu.header.links.NAME=Л.Кабинет %}briefcase{% ELSEIF menu.header.links.NAME=Личный кабинет %}briefcase{% ELSEIF menu.header.links.NAME=Выход %}key{% ELSEIF menu.header.links.NAME=Вход в бэк-офис %}key{% ELSEIF menu.header.links.NAME=Войти в ЛК %}key{% ELSEIF menu.header.links.NAME=Вход в личный кабинет %}key{% ELSEIF menu.header.links.NAME=Мои заказы %}tick{% ELSEIF menu.header.links.NAME=История заказов %}tick{% ELSEIF menu.header.links.NAME=Новинки %}label{% ELSEIF menu.header.links.NAME=Хиты %}heart{% ELSEIF menu.header.links.NAME=Хиты продаж %}heart{% ELSEIF menu.header.links.NAME=Статьи %}clipboard{% ELSEIF menu.header.links.NAME=Корзина %}cart{% ELSEIF menu.header.links.NAME=Главная %}home{% ELSEIF menu.header.links.NAME=Лента новостей %}document{% ELSEIF menu.header.links.NAME=Новости магазина %}document{% ELSEIF menu.header.links.NAME=Каталог статей %}document{% ELSEIF menu.header.links.NAME=Новости СМИ %}document{% ELSEIF menu.header.links.NAME=Регистрация %}user{% ELSEIF menu.header.links.NAME=Восстановление пароля %}user{% ENDIF %}{% IF menu.header.links.SELECTED %}-act selected{% ENDIF %}">{menu.header.links.NAME}</a> </li> {% ENDFOR %} {% ENDFOR %} {% ENDFOR %} </ul> {% ENDIF %} <div class="clear"></div>
#13
Отправлено 24 Май 2013 - 11:35
Цитата
а не могли Вы мне написать что именно необходимо сделать чтобы был быстрый заказ как в шаблоне вечность?
все изменения произвела, и заменила кнопку на странице товар, но он просто сразу перенаправляет на страницу корзины, а я хочу вылетающее окно
и еще теперь на главной странице не работает кнопка "добавить в корзину".
#14
Отправлено 24 Май 2013 - 13:05
tega4 (24 Май 2013 - 11:35) писал:
а не могли Вы мне написать что именно необходимо сделать чтобы был быстрый заказ как в шаблоне вечность?
все изменения произвела, и заменила кнопку на странице товар, но он просто сразу перенаправляет на страницу корзины, а я хочу вылетающее окно
и еще теперь на главной странице не работает кнопка "добавить в корзину".
В шаблоне вечность быстрый заказ идет по умолчанию. Может Вы имеете шаблон Техника?
#15
Отправлено 24 Май 2013 - 13:24
<p><button type="button" title="Добавить товар в корзину" class="btn btn-success" onclick="$('.product-form-{index_page_goods.MIN_PRICE_NOW_ID}').submit();return false;"><i class="icon-ok icon-white"></i> Добавить в корзину</button> </p>и заменить ее на
<div class="quick-shop"> <div class="bg-quick-shop"> <form action="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}" method="post" class="goodsListItemCatalogueAddToCartButton product-form-{index_page_goods.MIN_PRICE_NOW_ID}"> <div> <input type="hidden" name="hash" value="{HASH}" /> <input type="hidden" name="form[goods_from]" value="{index_page_goods.GOODS_FROM}" /> <input type="hidden" name="form[goods_mod_id]" value="{index_page_goods.MIN_PRICE_NOW_ID}" /> <a onclick="$('.product-form-{index_page_goods.MIN_PRICE_NOW_ID}').attr('rel', 'quick').submit();return false;" title="Быстро оформить заказ"> </a> </div> </form> </div> </div>
#16
Отправлено 24 Май 2013 - 21:23
Цитата
Цитата
#17
Отправлено 24 Май 2013 - 21:25
tega4 (24 Май 2013 - 21:23) писал:
вы делали изменения из сообщения - http://forum.storela...ики/#entry69283 ?
#18
Отправлено 24 Май 2013 - 21:43
Цитата
и как отредактировать навигацию?
#19
Отправлено 25 Май 2013 - 18:37
tega4 (24 Май 2013 - 21:43) писал:
и как отредактировать навигацию?
Вам нужно в конец файла main.js добавить
// Быстрый заказ function quickorder(formSelector) { // Находим форму, которую отправляем на сервер, для добавления товара в корзину var formBlock = $($(formSelector).get(0)); // Проверка на существование формы отправки запроса на добавление товара в корзину if(1 > formBlock.length || formBlock.get(0).tagName != 'FORM') { alert('Не удалось найти форму добавления товара в корзину'); return false; } // Получаем данные формы, которые будем отправлять на сервер var formData = formBlock.serializeArray(); // Сообщаем серверу, что мы пришли через ajax запрос formData.push({name: 'ajax_q', value: 1}); // Так же сообщим ему, что нужно сразу отобразить форму быстрого заказа formData.push({name: 'fast_order', value: 1}); // Аяксом добавляем товар в корзину и вызываем форму быстрого заказа товара $.ajax({ type : "POST", cache : false, url : formBlock.attr('action'), data : formData, success: function(data) { var width = $(window).width() * 0.8; if(width < 800) width = 'auto'; $.fn.nyroModalManual({ content: data, gallery: null, resizable: true, autoSizable: true, windowResize: true, width: width, minHeight: 230 }); } }); return false; }
закачиваем файл (прикрепленный) и меняем код кнопки с такого:
onclick="$('.product-form-{goods.MIN_PRICE_NOW_ID}').attr('rel', 'quick').submit();return false;"
на такой:
onclick="quickorder('.product-form-{goods.MIN_PRICE_NOW_ID}');return false;"
На странице товара:
onclick="$('.product-form-{related_goods.MIN_PRICE_NOW_ID}').attr('rel', 'quick').submit();return false;"
на такой:
onclick="quickorder('.product-form-{related_goods.MIN_PRICE_NOW_ID}');return false;"
если не заработает, тогда зайдите в шаблон HTML и после
<!-- Скрипты магазина -->
вставьте
<link rel="stylesheet" href="{FORALL_STYLES_PATH}fancybox/2.1.4/jquery.fancybox.css" /> <script src="{FORALL_STYLES_PATH}fancybox/2.1.4/jquery.fancybox.pack.js"></script>
Прикрепленные файлы
#20
Отправлено 25 Май 2013 - 19:00
Цитата
Цитата
<div class="bg-quick-shop">
<form action="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}" method="post" class="goodsListItemCatalogueAddToCartButton product-form-{goods.MIN_PRICE_NOW_ID}">
<div>
<input type="hidden" name="hash" value="{HASH}" />
<input type="hidden" name="form[goods_from]" value="{goods.GOODS_FROM}" />
<input type="hidden" name="form[goods_mod_id]" value="{goods.MIN_PRICE_NOW_ID}" />
<a onclick="quickorder('.product-form-{goods.MIN_PRICE_NOW_ID}');return false;" title="Быстро оформить заказ"> </a>
</div>
</form>
</div>
</div>
<div class="span6 product-shop">
<div class="f-fix">
<h2 class="product-name"><a href="{goods.URL | url_amp}" title="{goods.NAME}">{goods.NAME}</a></h2>
<div class="price-box">
<span class="regular-price">
<span class="price">{goods.MIN_PRICE_NOW | money_format}</span>
</span>
{% IF goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT>goods.MIN_PRICE_NOW %}
<span class="old-price" style="padding-left:5px;">
<span class="price">{goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT | money_format}</span>
</span>
{% ELSEIF goods.MIN_PRICE_OLD>goods.MIN_PRICE_NOW %}
<span class="old-price" style="padding-left:5px;">
<span class="price">{goods.MIN_PRICE_OLD | money_format}</span>
</span>
{% ENDIF %}
</div>
<p><button type="button" title="Добавить товар в корзину" class="btn btn-success" onclick="quickorder('.product-form-{goods.MIN_PRICE_NOW_ID}');return false;"><i class="icon-ok icon-white"></i> Добавить в корзину</button>
</p>
зеленый код который верно исправлен, красный неверный.
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных