Убрать Пустоту
#1
Отправлено 28 Март 2016 - 21:28
1. Во всплывающем меню каталога на главной 3 категории: "Адыгея... Пряности... Овощи..." А после них - пустота. Как сократить по содержимому?
2. Возможно ли вообще вместо пункта "Каталог" в меню на главной вынести эти 3 категории? А всплывать будут подкатегории (сейчас их еще нет)..Заранее благодарна!
#2
Отправлено 29 Март 2016 - 01:49
#4
Отправлено 29 Март 2016 - 14:58
Natashka prosto prazdnik (29 Март 2016 - 14:13) писал:
1. что бы убрать пустоту найдите в файле main.css
#custommenu ul.mainnav li ul.dropdown-menu {position: absolute;width:100%;left: 0;background: #ffffff;z-index: 999;padding: 0px 20px 10px;overflow-y: hidden;visibility: hidden;opacity: 0;filter: alpha(opacity=0);-khtml-opacity: 0;-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);-webkit-transform: scale(0.5);-moz-transform: scale(0.5);-ms-transform: scale(0.5);-o-transform: scale(0.5);transform: scale(0.5);-webkit-transform-origin: center 10%;-moz-transform-origin: center 10%;transform-origin: center 10%;-webkit-transition: all 0.25s linear;-moz-transition: all 0.25s linear;-o-transition: all 0.25s linear;transition: all 0.25s linear;}
замените на
#custommenu ul.mainnav li ul.dropdown-menu {position: absolute;width:auto;left: 0;background: #ffffff;z-index: 999;padding: 0px 20px 10px;overflow-y: hidden;visibility: hidden;opacity: 0;filter: alpha(opacity=0);-khtml-opacity: 0;-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);-webkit-transform: scale(0.5);-moz-transform: scale(0.5);-ms-transform: scale(0.5);-o-transform: scale(0.5);transform: scale(0.5);-webkit-transform-origin: center 10%;-moz-transform-origin: center 10%;transform-origin: center 10%;-webkit-transition: all 0.25s linear;-moz-transition: all 0.25s linear;-o-transition: all 0.25s linear;transition: all 0.25s linear;}
далее найдите
#custommenu ul.mainnav li.level1 {width: 24%;float: left;margin-right: 1%;}замените на
#custommenu ul.mainnav li.level1 {/*width: 24%;*/float: left;margin-right: 8px;}
#5
Отправлено 29 Март 2016 - 17:17
Ирина345 (29 Март 2016 - 14:58) писал:
1. что бы убрать пустоту найдите ...
замените на
...
Спасибо! Все получилось.
Второй вопрос перефразирую. Оказывается, нужно чтобы пункты меню отображались там, где сейчас отображаются категории каталога. То есть в шапке должно быть: "Каталог", "Сотрудничество", "Рецепты" и т.д. Это возможно?
#6
Отправлено 29 Март 2016 - 17:43
Natashka prosto prazdnik (29 Март 2016 - 17:17) писал:
Второй вопрос перефразирую. Оказывается, нужно чтобы пункты меню отображались там, где сейчас отображаются категории каталога. То есть в шапке должно быть: "Каталог", "Сотрудничество", "Рецепты" и т.д. Это возможно?
Здравствуйте, если я Вас правильно поняла, то Вам нужно в шаблоне HTML код
<ul class="pad-box cont620" id="mainmenu"> {% FOR menu %} {% FOR header %} {% FOR links %} <li><a href="{menu.header.links.URL}" {% IF menu.header.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %}>{menu.header.links.NAME}</a></li> {% ENDFOR %} {% ENDFOR %} {% ENDFOR %} </ul>
и замените на код:
<ul class="pad-box cont620" id="mainmenu"> {%IFNOT catalog_full_empty%} {%FOR catalog_full%} {% IF catalog_full.FIRST %}{% IFNOT catalog_full.LEVEL = 0 %}<ul class="sub {% IF catalog_full.LEVEL > 2 %}hide-cat{% ENDIF %} {% IF catalog_full.LEVEL = 1 %}dropdown-menu{% ENDIF %}">{% ENDIF %}{% ENDIF %} <li class="level{catalog_full.LEVEL} {% IF catalog_full.ISSET_SUB %}parent{% ENDIF %} {% IF catalog_full.CURRENT %}active{% ENDIF %}"> <a href="{catalog_full.URL}" class="title-lv{catalog_full.LEVEL} {% IF catalog_full.CURRENT %}active{% ENDIF %}" title="{catalog_full.NAME}"><span>{catalog_full.NAME}</span></a> {% 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%} </ul>
выглядеть будет так:
#7
Отправлено 30 Март 2016 - 08:05
Юля123 (29 Март 2016 - 17:43) писал:
Неверно)
1. Вопрос относится к аккаунту SL-375241
2. Неверно сформулировала сама изначально) В шапке есть иконка "Меню" (при наведении на которую всплывает окно с разделами - каталог, сотрудничество, рецепты...... и т.д.) и меню каталога, где сейчас отображается "Каталог" (при наведении выпадает "Продукция Адыгеи", "Пряности, травы ..." и т.д.) и "Сотрудничество" (как товарная позиция - это мое извращение дабы искусственно добиться желаемого))). Так вот мне нужно, чтобы "Каталог" (с выпадающими категориями каталога) остался на месте - меню в шапке, а правее появились разделы, которые сейчас всплывают при наведении на иконку "Меню". Не знаю как еще объяснить...
#8
Отправлено 30 Март 2016 - 09:27
Natashka prosto prazdnik (30 Март 2016 - 08:05) писал:
1. Вопрос относится к аккаунту SL-375241
2. Неверно сформулировала сама изначально) В шапке есть иконка "Меню" (при наведении на которую всплывает окно с разделами - каталог, сотрудничество, рецепты...... и т.д.) и меню каталога, где сейчас отображается "Каталог" (при наведении выпадает "Продукция Адыгеи", "Пряности, травы ..." и т.д.) и "Сотрудничество" (как товарная позиция - это мое извращение дабы искусственно добиться желаемого))). Так вот мне нужно, чтобы "Каталог" (с выпадающими категориями каталога) остался на месте - меню в шапке, а правее появились разделы, которые сейчас всплывают при наведении на иконку "Меню". Не знаю как еще объяснить...
Здравствуйте, давайте попробуем. Создайте бекап шаблона. После этого в шаблоне HTMl найдите код:
<!-- BEGIN: Main Navigation --> <div id="custommenu"> <ul class="mainnav"> {%IFNOT catalog_full_empty%} {%FOR catalog_full%} {% IF catalog_full.FIRST %}{% IFNOT catalog_full.LEVEL = 0 %}<ul class="sub {% IF catalog_full.LEVEL > 2 %}hide-cat{% ENDIF %} {% IF catalog_full.LEVEL = 1 %}dropdown-menu{% ENDIF %}">{% ENDIF %}{% ENDIF %} <li class="level{catalog_full.LEVEL} {% IF catalog_full.ISSET_SUB %}parent{% ENDIF %} {% IF catalog_full.CURRENT %}active{% ENDIF %}"> <a href="{catalog_full.URL}" class="title-lv{catalog_full.LEVEL} {% IF catalog_full.CURRENT %}active{% ENDIF %}" title="{catalog_full.NAME}"><span>{catalog_full.NAME}</span></a> {% 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%} </ul>
после него добавьте код:
<ul class="block-menu-links1"> {% FOR menu %} {% FOR header %} {% FOR links %} <li><a href="{menu.header.links.URL}" {% IF menu.header.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %}>{menu.header.links.NAME}</a></li> {% ENDFOR %} {% ENDFOR %} {% ENDFOR %} </ul>
в конце main.css добавьте код:
ul.block-menu-links1 { display: inline-block; } ul.block-menu-links1 li { display: inline-block; float: left; border: none; height: 38px; } ul.block-menu-links1 li a { display: block; padding: 10px 15px; color: #404040; text-transform: uppercase; position: relative; letter-spacing: 0.2px; }
#9
Отправлено 30 Март 2016 - 16:31
Юля123 (30 Март 2016 - 09:27) писал:
Проба удалась. Спасибо! Теперь:
1. Переносим пункт меню "Главная" удаляем, а на его место переносим пункт меню "Каталог" (во вложении рис.1)
2. Верхнюю строку прячем во всплывающее окно пункта меню "Каталог", а на нее поднимаем результаты 1. (во вложении рис.2)
#10
Отправлено 30 Март 2016 - 16:54
Natashka prosto prazdnik (30 Март 2016 - 16:31) писал:
1. Переносим пункт меню "Главная" удаляем, а на его место переносим пункт меню "Каталог" (во вложении рис.1)
2. Верхнюю строку прячем во всплывающее окно пункта меню "Каталог", а на нее поднимаем результаты 1. (во вложении рис.2)
Изменить положение пунктов меню, а так же удалить пункты Вы можете в разделе Сайт - Меню, изменяйте верхнее меню.
2)Изменения для шаблона HTML. Вместо кода:
<ul class="block-menu-links"> {% FOR menu %} {% FOR header %} {% FOR links %} <li><a href="{menu.header.links.URL}" {% IF menu.header.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %}>{menu.header.links.NAME}</a></li> {% ENDFOR %} {% ENDFOR %} {% ENDFOR %} </ul>
добавьте код:
<ul class="block-menu-links"> {%IFNOT catalog_full_empty%} {%FOR catalog_full%} {% IF catalog_full.FIRST %}{% IFNOT catalog_full.LEVEL = 0 %}<ul class="sub {% IF catalog_full.LEVEL > 2 %}hide-cat{% ENDIF %} {% IF catalog_full.LEVEL = 1 %}dropdown-menu{% ENDIF %}">{% ENDIF %}{% ENDIF %} <li class="level{catalog_full.LEVEL} {% IF catalog_full.ISSET_SUB %}parent{% ENDIF %} {% IF catalog_full.CURRENT %}active{% ENDIF %}"> <a href="{catalog_full.URL}" class="title-lv{catalog_full.LEVEL} {% IF catalog_full.CURRENT %}active{% ENDIF %}" title="{catalog_full.NAME}"><span>{catalog_full.NAME}</span></a> {% 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%} </ul>
и код:
<ul class="mainnav"> {%IFNOT catalog_full_empty%} {%FOR catalog_full%} {% IF catalog_full.FIRST %}{% IFNOT catalog_full.LEVEL = 0 %}<ul class="sub {% IF catalog_full.LEVEL > 2 %}hide-cat{% ENDIF %} {% IF catalog_full.LEVEL = 1 %}dropdown-menu{% ENDIF %}">{% ENDIF %}{% ENDIF %} <li class="level{catalog_full.LEVEL} {% IF catalog_full.ISSET_SUB %}parent{% ENDIF %} {% IF catalog_full.CURRENT %}active{% ENDIF %}"> <a href="{catalog_full.URL}" class="title-lv{catalog_full.LEVEL} {% IF catalog_full.CURRENT %}active{% ENDIF %}" title="{catalog_full.NAME}"><span>{catalog_full.NAME}</span></a> {% 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%} </ul>
удалите.
далее, чтобы корректно отображалось в мобильной версии, код:
<ul class="mainnav"> {% IFNOT catalog_full_empty %} {% FOR catalog_full %} {% IF catalog_full.FIRST %}{% IFNOT catalog_full.LEVEL = 0 %}<ul class="sub">{% ENDIF %}{% ENDIF %} <li class="level{catalog_full.LEVEL} {% IF catalog_full.ISSET_SUB %}parent{% ENDIF %} {% IF catalog_full.LEVEL = 0 %}subhead{% ENDIF %} {% IF catalog_full.CURRENT || catalog_full.CURRENT_PARENT %}active{% ENDIF %}"> <a href="{catalog_full.URL}" class="title-lv{catalog_full.LEVEL} {% IF catalog_full.CURRENT %}active{% ENDIF %}">{% IF catalog_full.ISSET_SUB %}<span class="open-menu {% IF catalog_full.CURRENT_PARENT || catalog_full.CURRENT %}active{% ENDIF %}"></span>{% ENDIF %}{catalog_full.NAME}</a> {% 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 %} </ul>
замените на код:
<ul class="mainnav"> {% FOR menu %} {% FOR header %} {% FOR links %} <li><a href="{menu.header.links.URL}" {% IF menu.header.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %}>{menu.header.links.NAME}</a></li> {% ENDFOR %} {% ENDFOR %} {% ENDFOR %} </ul>
а также как я понимаю, Вам нужно будет подпись мобильного меню тоже сменить, т.е. в коде:
<span class="title">Каталог</span>
добавьте нужное название вместо каталог (например, "Меню") .
#14
Отправлено 31 Март 2016 - 14:07
Natashka prosto prazdnik (31 Март 2016 - 11:28) писал:
Если я Вас правильно поняла, то Вам нужно выпадающее меню. В этом меню оно не предусмотрено, но можно прописать его вручную. Для этого в шаблоне HTML найдите код:
<ul class="block-menu-links1"> {% FOR menu %} {% FOR header %} {% FOR links %} <li><a href="{menu.header.links.URL}" {% IF menu.header.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %}>{menu.header.links.NAME}</a></li> {% ENDFOR %} {% ENDFOR %} {% ENDFOR %} </ul>
заменить на код:
<ul class="block-menu-links1"> <li><a href="http://{NET_DOMAIN}/catalog" title="Каталог товаров ">Каталог</a> <ul class="block-menu-catalog"> {%IFNOT catalog_full_empty%} {%FOR catalog_full%} {% IF catalog_full.FIRST %}{% IFNOT catalog_full.LEVEL = 0 %}<ul class="sub {% IF catalog_full.LEVEL > 2 %}hide-cat{% ENDIF %} {% IF catalog_full.LEVEL = 1 %}dropdown-menu{% ENDIF %}">{% ENDIF %}{% ENDIF %} <li class="level{catalog_full.LEVEL} {% IF catalog_full.ISSET_SUB %}parent{% ENDIF %} {% IF catalog_full.CURRENT %}active{% ENDIF %}"> <a href="{catalog_full.URL}" class="title-lv{catalog_full.LEVEL} {% IF catalog_full.CURRENT %}active{% ENDIF %}" title="{catalog_full.NAME}"><span>{catalog_full.NAME}</span></a> {% IF catalog_full.ISSET_SUB=0 %}</li>{% ENDIF %} {%ENDFOR%} {%ENDIF%} </ul> </li> <li><a href="http://{NET_DOMAIN}/page/Sotrudnichestvo" title="Сотрудничество">Сотрудничество</a></li> <li><a href="http://{NET_DOMAIN}/Recepty" title="Рецепы блюд">Рецепты</a></li> <li><a href="http://{NET_DOMAIN}/Доставка" title="Условия доставки">Доствка</a></li> <li><a href="http://{NET_DOMAIN}/cart" title="Контакты">Корзина</a></li> <li><a href="http://{NET_DOMAIN}/feedback" title="Контакты">Контакты</a></li> {% IF CLIENT_IS_LOGIN %}<li><a href="http://{NET_DOMAIN}/user/settings" title="Ваш личный кабинет">Мой кабинет</a></li>{%ENDIF%} {% IFNOT CLIENT_IS_LOGIN %}<li><a href="http://{NET_DOMAIN}/user/login " title="Личный кабинет">Войти в ЛК</a></li>{%ENDIF%} {% IF CLIENT_IS_LOGIN %}<li><a href="http://{NET_DOMAIN}/user/logout" title="Личный кабинет">Выход</a></li>{%ENDIF%} </ul>
и в main.css код:
.block-menu-links1 li ul { display: none; left: 181; width:200px; position: absolute; top: 29px; z-index:99; } .block-menu-links1li:hover ul{display:block;} .block-menu-links1 li ul li{ width:200px; padding:10px; border-bottom:1px solid #000; background:#999; }
замените на код:
.block-menu-links1 li ul { opacity:0; width:234px; position: absolute; top: 35px; left:30px; z-index:99; border: 1px solid #ddd; } .block-menu-links1 li:hover ul{opacity:1;} .block-menu-links1 li ul li{ width: 234px; padding: 10px; border-bottom: 1px solid #dddddd; background: #FCFCFC; }
Минус этого решения в том, что если у Вас изменятся пункты меню, то автоматически они уже не поменяются, и придется прописывать их вручную. Но иначе встроить выпадающее меню не получится.
#15
Отправлено 31 Март 2016 - 19:25
Юля123 (31 Март 2016 - 14:07) писал:
Спасибо! Все почти идеально! Теперь нужно сделать так, чтобы пункты выпадающего меню располагались не в столбик, а в строку. Это раз. Меню было более прозрачным. Это два. И углы скругленными. Это три. И я оставляю Вас в покое на какое-то время)
#16
Отправлено 31 Март 2016 - 19:50
Natashka prosto prazdnik (31 Март 2016 - 19:25) писал:
Здравствуйте. В шаблоне main.css найдите строки:
.block-menu-links1 li ul { opacity:0; width:234px; position: absolute; top: 35px; left:30px; z-index:99; border: 1px solid #ddd; }замените их на:
.block-menu-links1 li ul { opacity:0; width:234px; position: absolute; top: 35px; left:30px; z-index:99; }
Затем, строки:
.block-menu-links1 li ul li{ width: 234px; padding: 10px; border-bottom: 1px solid #dddddd; background: #FCFCFC; }замените их на:
.block-menu-links1 li ul li{ width: 234px; padding: 10px; border-bottom: 1px solid #dddddd; background: rgba(255,255,255,0.5); border-radius: 25px; }
Проверьте, пожалуйста, результат. На мой взгляд, лучше оставить выпадающий список в столбик. Так визуально будет понятно, что он относится к разделу каталог. Можно добавить расстояния между пунктами: в том же шаблоне, после строки:
.block-menu-links1 li ul li{добавьте еще одно свойство:
margin-bottom: 5px;
Результат:
#17
Отправлено 03 Апрель 2016 - 15:33
RedHead (31 Март 2016 - 19:50) писал:
Разобралась немного по-своему. Спасибо!)
Оказалось, что это не все. Нужно уменьшить высоту слайдера на главной на 1/3 и изменить цвет текста по умолчанию на главной и в описании товара в карточке товара с серого на черный, а размер на 16.
#18
Отправлено 03 Апрель 2016 - 15:52
Natashka prosto prazdnik (03 Апрель 2016 - 15:33) писал:
Оказалось, что это не все. Нужно уменьшить высоту слайдера на главной на 1/3 и изменить цвет текста по умолчанию на главной и в описании товара в карточке товара с серого на черный, а размер на 16.
Здравствуйте.
1) Слайдер. В шаблоне main.css найдите строки:
#slider {position: relative; margin: 0 auto;top: 0px; left: 0px; width: 1920px; height: 699px; overflow: hidden;z-index:1;} .slides_container {cursor: move; position: absolute; left: 0px; top: 0px; width: 1920px;height: 699px; overflow: hidden;}
замените их на:
#slider {position: relative; margin: 0 auto;top: 0px; left: 0px; width: 1920px; height: 466px; overflow: hidden;z-index:1;} .slides_container {cursor: move; position: absolute; left: 0px; top: 0px; width: 1920px;height: 466px; overflow: hidden;}
Слайдер уменьшится по высоте на 1/3, тем самым обрежутся изображения, тк с шириной слайдера мы ничего не делали, она по-прежнему растягивается на всю ширину экрана. Вам нужно подготовить новые изображения по новым размерам и заменить картинки слайдов.
2) Цвет текста по умолчанию измените в шаблоне main.css. Найдите строку:
body {font-family: PT Sans, arial, serif;font-size: 14px;line-height: 18px;font-weight: 400;color: #8b8b8b;overflow-x: hidden;position: relative;background-color: #ffffff;margin:0;padding:0;}
замените ее на:
body {font-family: PT Sans, arial, serif;font-size: 16px;line-height: 18px;font-weight: 400;color: #000;overflow-x: hidden;position: relative;background-color: #ffffff;margin:0;padding:0;}
Описание в карточке товара у Вас уже сделано размером 16px и черным цветом.
Уточните, пожалуйста, если где-либо еще нужно заменить начертание текста.
Количество пользователей, читающих эту тему: 1
0 пользователей, 1 гостей, 0 анонимных