Отключен JavaScript

У вас отключен JavaScript. Некоторые возможности системы не будут работать. Пожалуйста, включите JavaScript для получения доступа ко всем функциям.

Изменение Общего Стиля. Детали

Автор A-myshop, 20 сент. 2014 12:26

Меню Замена цвета оформление

Вперед

Авторизуйтесь для ответа в теме

Сообщений в теме: 32

#1 A-myshop

Продвинутый пользователь

Пользователи
150 сообщений

Отправлено 20 Сентябрь 2014 - 12:26

Ребят помогите пожалуйста, как провернуть всё это?
Подробно всё расписал на скрине. Буду очень благодарен за помощь.

Вот основные вопросы:
1. Вместо иконки дом в главном меню поставить лого beauty style, а при нажатии на лого попадална главную страницу.
2. панель меню переставить на верх.
3. Поменять цвета на иконках панели кнопках, вобщем везде где есть красный заменить на фиолетовый
4 иконку корзины в правом верхнем углу переместить в панель меню, возможно ли это?

Прикрепленные изображения

Наверх

#2 Danil

Активный участник

Пользователи
4 645 сообщений

Отправлено 20 Сентябрь 2014 - 15:34

A-myshop (20 Сентябрь 2014 - 12:26) писал:

Здравствуйте.
Уточните номер аккаунта.

Наверх

#3 A-myshop

Продвинутый пользователь

Пользователи
150 сообщений

Отправлено 20 Сентябрь 2014 - 16:09

http://z45293.storeland.ru/

Наверх

#4 Danil

Активный участник

Пользователи
4 645 сообщений

Отправлено 20 Сентябрь 2014 - 16:41

A-myshop (20 Сентябрь 2014 - 16:09) писал:

http://z45293.storeland.ru/

Попробуйте такой вариант.
Для начала сделайте бэкап, чтобы можно было вернуть изменения, если не понравится.
В шаблоне html найдите код

Скрытый текст

   <div id="header">
		<div class="container">
		  <div class="logo">
			<a href="http://{NET_DOMAIN}/"><img src="{ASSETS_IMAGES_PATH}logo.png" alt="" title="" width="265" height="55" class="scale-with-grid"></a>		   
		  </div>
		  
		  <div class="contacts">
			{% IF SETTINGS_STORE_PHONE_NUMBER1 || SETTINGS_STORE_PHONE_NUMBER2 || SETTINGS_STORE_PHONE_NUMBER3 || SETTINGS_STORE_SKYPE || SETTINGS_STORE_ICQ %}
			  <div class="phone" title="Звоните, мы проконсультируем вас по любым вопросам"> 
				<b>Контакты:</b><br />
				<!-- Первый контактный телефон -->
				{% IF SETTINGS_STORE_PHONE_NUMBER1 %}
				  {SETTINGS_STORE_PHONE_COUNTRY_CODE1}
				  {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}<span class="phone_code">({SETTINGS_STORE_PHONE_CITY_CODE1})</span>{% ENDIF %}
				  {SETTINGS_STORE_PHONE_NUMBER1}<br />
				{% ENDIF %}
			   
				<!-- Второй контактный телефон -->
				{% IF SETTINGS_STORE_PHONE_NUMBER2 %}
				  {SETTINGS_STORE_PHONE_COUNTRY_CODE1}
				  {% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}<span class="phone_code">({SETTINGS_STORE_PHONE_CITY_CODE2})</span>{% ENDIF %}
				  {SETTINGS_STORE_PHONE_NUMBER2}<br />
				{% ENDIF %}
						 
				<!-- Третий контактный телефон -->
				{% IF SETTINGS_STORE_PHONE_NUMBER3 %}
				  {SETTINGS_STORE_PHONE_COUNTRY_CODE3}
				  {% IF SETTINGS_STORE_PHONE_CITY_CODE3 %}<span class="phone_code">({SETTINGS_STORE_PHONE_CITY_CODE3})</span>{% ENDIF %}
				  {SETTINGS_STORE_PHONE_NUMBER3}
				{% ENDIF %}
					   
				<!-- Skype номер -->
				{% IF SETTINGS_STORE_SKYPE %}
				  <div class="contentTableHeadMainSkype">
					<a class="valignMiddle" href="skype:{SETTINGS_STORE_SKYPE}?call" title="Свяжитесь с нами по Skype">
					  <img class="valignMiddle" src="{FORALL_IMAGES_PATH}icon/skype.png" width="16" height="16" alt="Свяжитесь с нами по Skype" />
					  <span class="valignMiddle">{SETTINGS_STORE_SKYPE}</span>
					</a>
				  </div>
				{% ENDIF %}
					  
				<!-- ICQ номер -->
				{% IF SETTINGS_STORE_ICQ %}
				  <div class="contentTableHeadMainIcq">
					<img class="valignMiddle" src="http://wwp.icq.com/scripts/online.dll?icq={SETTINGS_STORE_ICQ_ONLY_DIGITS}&amp;img=27" alt="Статус" width="16" height="16" />
					<span class="valignMiddle">{SETTINGS_STORE_ICQ}</span>
				  </div>
				{% ENDIF %}
			  </div>
			{% ENDIF %}
		   
			<!-- Время работы магазина -->
			{% IF SETTINGS_STORE_WORK_TIME %}
			  <div class="time">
				<b>Время работы:</b><br />
				<span class="work-time" title="Время работы нашего магазина: {SETTINGS_STORE_WORK_TIME}">
				  {SETTINGS_STORE_WORK_TIME}
				</span>
			  </div>
			{% ENDIF %}
			<div class="clear"></div>
		  </div>
			 
		  <!-- Корзина -->
		  <div class="shopping_cart_block">
			<a href="{CART_URL}" class="shopping_cart"  title="Просмотреть корзину">
			  {% IFNOT cart_count_empty %}
				<span id="cart-total">
				  {CART_COUNT_TOTAL}
				</span>
			  {% ENDIF %}
			</a>
		   
			{% IFNOT cart_count_empty %}
			  <div id="shopping_cart_mini" class="hidden-phone hidden-tablet">
		   <div class="inner-wrapper">
		   <table class="table_style">
			<tbody>
					  {% FOR cart_items %}
			 <tr class="item">
			  <td class="t_right v_align_top">{cart_items.ORDER_LINE_QUANTITY}&nbsp;x&nbsp;</td>
			  <td class="v_align_top"><a href="{cart_items.GOODS_URL}">{cart_items.GOODS_NAME}</a></td>
			 </tr>
			 {% ENDFOR %}
			</tbody>
		   </table>
		   <div class="wrapper">
			<a class="button" title="Просмотр корзины" href="{CART_URL}">В корзину</a>
			<a class="button" title="Оформление заказа" href="{ORDER_STAGE_CONTACTS_URL}">Оформить</a>
		   </div>
		  </div>
		 </div>
			{% ENDIF %}
		  </div>
		 
		   
		  <div class="nav-container">
			<div id="menu_block_head">
			  <div class="nav_block_head_field">Выберите пункт меню...</div>
			  <span class="menu_block_head_button"> </span>
			  <div class="clear"></div>
			</div>
			<!-- Верхний блок навигации -->
			<div class="menu_block_dropdown">
			  <div class="et_categ_box">
				<div id="et_categ_box_scroll">
				  <div class="img_link_wrapper"><a class="image-link" href="http://{NET_DOMAIN}/"></a></div>
				  {% FOR menu %}
					{% FOR header %}
					  {% FOR links %}
						 <div class="cat-name"><a href="{menu.header.links.URL}" class="main_category {% IF menu.header.links.SELECTED %}selected{%ENDIF%}" {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %}>{menu.header.links.NAME}</a></div>
					  {% ENDFOR %}
					{% ENDFOR %}
				  {% ENDFOR %}
				</div> 
			  </div>
			</div>
			<!-- end Верхний блок навигации -->
		  </div>
		</div>
	  </div>

И замените на

Скрытый текст

   <div id="header">
		<div class="container">
	 
		<div class="nav-container">
			<div id="menu_block_head">
			  <div class="nav_block_head_field">Выберите пункт меню...</div>
			  <span class="menu_block_head_button"> </span>
			  <div class="clear"></div>
			</div>
			<!-- Верхний блок навигации -->
			<div class="menu_block_dropdown">
			  <div class="et_categ_box">
				<div id="et_categ_box_scroll">
				  <div class="img_link_wrapper"><a class="image-link" href="http://{NET_DOMAIN}/"></a></div>
				  {% FOR menu %}
					{% FOR header %}
					  {% FOR links %}
						 <div class="cat-name"><a href="{menu.header.links.URL}" class="main_category {% IF menu.header.links.SELECTED %}selected{%ENDIF%}" {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %}>{menu.header.links.NAME}</a></div>
					  {% ENDFOR %}
					{% ENDFOR %}
				  {% ENDFOR %}
				</div> 
			  </div>
			</div>
			<!-- end Верхний блок навигации -->
		  </div>
			 
		  <!-- Корзина -->
		  <div class="shopping_cart_block">
			<a href="{CART_URL}" class="shopping_cart"  title="Просмотреть корзину">
			  {% IFNOT cart_count_empty %}
				<span id="cart-total">
				  {CART_COUNT_TOTAL}
				</span>
			  {% ENDIF %}
			</a>
		   
			{% IFNOT cart_count_empty %}
			  <div id="shopping_cart_mini" class="hidden-phone hidden-tablet">
		   <div class="inner-wrapper">
		   <table class="table_style">
			<tbody>
					  {% FOR cart_items %}
			 <tr class="item">
			  <td class="t_right v_align_top">{cart_items.ORDER_LINE_QUANTITY}&nbsp;x&nbsp;</td>
			  <td class="v_align_top"><a href="{cart_items.GOODS_URL}">{cart_items.GOODS_NAME}</a></td>
			 </tr>
			 {% ENDFOR %}
			</tbody>
		   </table>
		   <div class="wrapper">
			<a class="button" title="Просмотр корзины" href="{CART_URL}">В корзину</a>
			<a class="button" title="Оформление заказа" href="{ORDER_STAGE_CONTACTS_URL}">Оформить</a>
		   </div>
		  </div>
		 </div>
			{% ENDIF %}
		  </div>
		 
		   
		
		</div>
	  </div>

Далее в style.css найдите код

.shopping_cart_block {
position: absolute;
right: 20px;
top: 40px;
z-index: 10;
}

И замените на

.shopping_cart_block {
float: right;
z-index: 10;
min-width: 20%;
}

После найдите код

.nav-container {
background: #000000;
margin-bottom: 0px;
position: relative;
display: block;
float: left;
bottom: 0;
width: 100%;
}

И замените на

.nav-container {
background: #000000;
margin-bottom: 0px;
position: relative;
display: block;
float: right;
bottom: 0;
width: 100%;
}

Далее в шаблоне html найдите код

<div class="img_link_wrapper"><a class="image-link" href="http://{NET_DOMAIN}/"></a></div>

И замените на

<div class="img_link_wrapper"><a class="image-link" href="{ASSETS_IMAGES_PATH}logo.png"></a></div>

Чтобы изменить цвет воспользуйтесь этой инструкцией http://forum.storela...нужно-производ/

Наверх

#5 A-myshop

Продвинутый пользователь

Пользователи
150 сообщений

Отправлено 20 Сентябрь 2014 - 17:08

Спасибо большое всё в тему) немного не получилось с корзиной,логотипом...
И сразу ещё вопрос, можно ли что бы слайдер был побольше. нужно что бы кончался на сантиметров 5 ниже. Спасибо за помощь.

Прикрепленные изображения

Наверх

#6 A-myshop

Продвинутый пользователь

Пользователи
150 сообщений

Отправлено 20 Сентябрь 2014 - 17:16

С корзиной вроде разобрался)

Наверх

#7 Danil

Активный участник

Пользователи
4 645 сообщений

Отправлено 20 Сентябрь 2014 - 17:23

A-myshop (20 Сентябрь 2014 - 17:08) писал:

В style.css найдите код

.shopping_cart_block {
position: absolute;
right: 20px;
top: 40px;
z-index: 10;
}

И замените на

.shopping_cart_block {
float:right;
z-index: 10;
min-width:20%;
}

В шаблоне html найдите код

	   <div class="img_link_wrapper"><a class="image-link" href="{ASSETS_IMAGES_PATH}logo.png"></a></div>

И замените на

	   <div class="img_link_wrapper"><a class="image-link" href="#"><img src="{ASSETS_IMAGES_PATH}logo.png"></a></div>

После в style.css найдите код

a.image-link, a:hover.image-link{display: block;background: url('{ASSETS_IMAGES_PATH}icon_home.png') 17px 16px no-repeat;width: 53px;height:49px;padding:0;margin:0;}

И замените на

a.image-link, a:hover.image-link{display: block;height:49px;padding:0;margin:0;}

В style.css найдите код

.camera_wrap {
height: 600px !important;
}

И замените на

.camera_wrap {
height: 700px !important;
}

Наверх

#8 A-myshop

Продвинутый пользователь

Пользователи
150 сообщений

Отправлено 20 Сентябрь 2014 - 17:50

Спасибо) Всё класс) Мне нравится) Только вот при нажатии на лого ничего не происходит, и картинка слайдов больше не стала( почему так вобще не понимаю.... на трёх строчках заметил восклицательный знак в жёлтом треугольнике может дело в этом?( http://z45293.storeland.ru/

Прикрепленные изображения

Наверх

#9 Dars

Активный участник

Пользователи
1 410 сообщений

Отправлено 20 Сентябрь 2014 - 19:02

A-myshop (20 Сентябрь 2014 - 17:50) писал:

В шаблоне HTML найдите строку:

		   <div class="img_link_wrapper"><a class="image-link" href="#"><img src="{ASSETS_IMAGES_PATH}logo.png"></a></div>

и замените её на:

			<div class="img_link_wrapper"><a class="image-link" href="//{NET_DOMAIN}"><img src="{ASSETS_IMAGES_PATH}logo.png"></a></div>

В style.css найдите код:

.camera_wrap {height:600px !important;}

Наряду с этим кодом изменяйте также строку:

.fluid-container  {position: relative;height: 600px;/*min-height: 400px;background: url('http://z45293.storeland.net/slide4.jpg') center center;*/}

То есть если высота картинки должна быть 700px, то измените значение 600 на 700 в обеих строках.

Наверх

#10 A-myshop

Продвинутый пользователь

Пользователи
150 сообщений

Отправлено 20 Сентябрь 2014 - 19:41

Спасибо, всё круто. Получилось. Вот только пока ждал ответа, хотел сам блок пониже отпустить и чего то намудрил, как поправить найти теперь не могу(

Прикрепленные изображения

Наверх

#11 Dars

Активный участник

Пользователи
1 410 сообщений

Отправлено 20 Сентябрь 2014 - 19:49

A-myshop (20 Сентябрь 2014 - 19:41) писал:

Честно говоря, сложно уже сказать, что именно привело к таким последствиям. У вас есть бэкап , сделанный 4 часа назад, возможно, имеет смысл его восстановить?

Наверх

#12 A-myshop

Продвинутый пользователь

Пользователи
150 сообщений

Отправлено 20 Сентябрь 2014 - 21:02

Всё супер. восстановил. доделал. получилось как хотел. спасибо вам модераторы и просто хорошие люди) Низкий поклон)

Наверх

#13 A-myshop

Продвинутый пользователь

Пользователи
150 сообщений

Отправлено 20 Сентябрь 2014 - 21:13

Продолжаю мучить всех вокруг но, по другому никак) Вы уж простите))

Как сделать что бы табличка с текстом выскакивала в правую половину на первом слайде, а на остальных её вообще не было?

Прикрепленные изображения

Наверх

#14 Dars

Активный участник

Пользователи
1 410 сообщений

Отправлено 20 Сентябрь 2014 - 21:27

A-myshop (20 Сентябрь 2014 - 21:13) писал:

В шаблоне HTML найдите код:

<div class="camera_wrap camera_black_skin" id="camera_wrap_1">
		  <div data-thumb="{ASSETS_IMAGES_PATH}slide1.jpg" data-src="{ASSETS_IMAGES_PATH}slide1.jpg">
			<div class="camera_caption moveFromLeft">
			  Мечты становятся реальностью, когда мысли превращаются в действия!
			</div>
		  </div>
		  <div data-thumb="{ASSETS_IMAGES_PATH}slide2.jpg" data-src="{ASSETS_IMAGES_PATH}slide2.jpg">
			<div class="camera_caption moveFomRight">
			  Мечты становятся реальностью, когда мысли превращаются в действия!
			</div>
		  </div>
		  <div data-thumb="{ASSETS_IMAGES_PATH}slide3.jpg" data-src="{ASSETS_IMAGES_PATH}slide3.jpg">
			<div class="camera_caption moveFromLeft">
			  Мечты становятся реальностью, когда мысли превращаются в действия!
			</div>
		  </div>
		  <div data-thumb="{ASSETS_IMAGES_PATH}slide4.jpg" data-src="{ASSETS_IMAGES_PATH}slide4.jpg">
			<div class="camera_caption moveFomRight">
			  Мечты становятся реальностью, когда мысли превращаются в действия!
			</div>
		  </div>
		  <div data-thumb="{ASSETS_IMAGES_PATH}slide1.jpg" data-src="{ASSETS_IMAGES_PATH}slide1.jpg">
			<div class="camera_caption fadeFromLeft">
			  Мечты становятся реальностью, когда мысли превращаются в действия!
			</div>
		  </div>
		  <div data-thumb="{ASSETS_IMAGES_PATH}slide2.jpg" data-src="{ASSETS_IMAGES_PATH}slide2.jpg">
			<div class="camera_caption fadeFromRight">
			  Мечты становятся реальностью, когда мысли превращаются в действия!
			</div>
		  </div>
		  <div data-thumb="{ASSETS_IMAGES_PATH}slide3.jpg" data-src="{ASSETS_IMAGES_PATH}slide3.jpg">
			<div class="camera_caption fadeFromLeft">
			  Мечты становятся реальностью, когда мысли превращаются в действия!
			</div>
		  </div>
		  <div data-thumb="{ASSETS_IMAGES_PATH}slide4.jpg" data-src="{ASSETS_IMAGES_PATH}slide4.jpg">
			<div class="camera_caption fadeFromRight">
			  Мечты становятся реальностью, когда мысли превращаются в действия!
			</div>
		  </div>
		</div><!-- #camera_wrap_1 -->

и замените его на:

<div class="camera_wrap camera_black_skin" id="camera_wrap_1">
			<div data-thumb="{ASSETS_IMAGES_PATH}slide1.jpg" data-src="{ASSETS_IMAGES_PATH}slide1.jpg">
			  <div class="camera_caption moveFromRight" style="left:300px;">
				Мечты становятся реальностью, когда мысли превращаются в действия!
			  </div>
			</div>
			<div data-thumb="{ASSETS_IMAGES_PATH}slide2.jpg" data-src="{ASSETS_IMAGES_PATH}slide2.jpg">
			</div>
			<div data-thumb="{ASSETS_IMAGES_PATH}slide3.jpg" data-src="{ASSETS_IMAGES_PATH}slide3.jpg">
			</div>
			<div data-thumb="{ASSETS_IMAGES_PATH}slide4.jpg" data-src="{ASSETS_IMAGES_PATH}slide4.jpg">
			</div>
			<div data-thumb="{ASSETS_IMAGES_PATH}slide1.jpg" data-src="{ASSETS_IMAGES_PATH}slide1.jpg">
			  <div class="camera_caption moveFromRight" style="left:300px;">
				Мечты становятся реальностью, когда мысли превращаются в действия!
			  </div>
			</div>
			<div data-thumb="{ASSETS_IMAGES_PATH}slide2.jpg" data-src="{ASSETS_IMAGES_PATH}slide2.jpg">
			</div>
			<div data-thumb="{ASSETS_IMAGES_PATH}slide3.jpg" data-src="{ASSETS_IMAGES_PATH}slide3.jpg">
			</div>
			<div data-thumb="{ASSETS_IMAGES_PATH}slide4.jpg" data-src="{ASSETS_IMAGES_PATH}slide4.jpg">
			</div>
		  </div><!-- #camera_wrap_1 -->
		<div class="clear"></div>

Наверх

#15 A-myshop

Продвинутый пользователь

Пользователи
150 сообщений

Отправлено 20 Сентябрь 2014 - 21:40

А как повыше поднять табличку?

Наверх

#16 Dars

Активный участник

Пользователи
1 410 сообщений

Отправлено 20 Сентябрь 2014 - 21:45

A-myshop (20 Сентябрь 2014 - 21:40) писал:

А как повыше поднять табличку?

В camera.css найдите строку:

.camera_caption {bottom: 0;display: block;position: absolute;width: 100%;top: 300px;right: 100px;width: 450px;font-size: 30px;font-style: italic;}

и регулируйте параметр top. Например, если вы смените 300px на 200px, табличка переместится вверх на 100px.

Наверх

#17 A-myshop

Продвинутый пользователь

Пользователи
150 сообщений

Отправлено 20 Сентябрь 2014 - 22:12

Возникла серьёзная проблема( Сдвух компьютеров картика смотрится по разному, а с телефона слайды видно только на одну четвёртую... Что делать, как сделать так что бы картинка была одинаковой?

Прикрепленные изображения

Наверх

#18 A-myshop

Продвинутый пользователь

Пользователи
150 сообщений

Отправлено 20 Сентябрь 2014 - 22:42

Вопрос номер два, можно ли в сплывающем окне текста после самого текста поставить линию и ниже неё ссылка в каталог сайта

Наверх

#19 Ирина345

Активный участник

Модераторы
5 709 сообщений

Отправлено 22 Сентябрь 2014 - 13:10

A-myshop (20 Сентябрь 2014 - 22:42) писал:

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

Наверх

#20 A-myshop

Продвинутый пользователь

Пользователи
150 сообщений

Отправлено 22 Сентябрь 2014 - 14:18

Вот хотелось бы примерно так) И что бы при нажатии на каталог на тексте преходил сразу в раздел каталог.

Прикрепленные изображения

Наверх

Вперед

Обратно в Изменение общей стилистики

Темы с аналогичным тегами Меню, Замена цвета, оформление

Вопросы работы сервиса StoreLand → Дизайн → Шаблон Лето → Главная → Новогоднее Оформление С Анимацией Падения Снежинок Автор Гость_Foxis_10_* , 24 дек. 2020 снежинки, новый год, оформление и 3 еще...	0 Ответов 1 388 Просмотров	Foxis_10 24 дек. 2020
Вопросы работы сервиса StoreLand → Другие вопросы → Изменение Url'a Ссылки Навигационного Меню Автор Гость_smoke_story_* , 05 нояб. 2019 Навигация, Меню и 4 еще...	3 Ответов 3 097 Просмотров	Vaccina 16 нояб. 2019
Вопросы работы сервиса StoreLand → Дизайн → Шаблон Лазурь → Каталог товаров → Сделать Выпадающее Меню Автор Гость_arpico-latex_* , 16 янв. 2019 выпадающее, меню	3 Ответов 1 396 Просмотров	Vaccina 22 янв. 2019
Вопросы работы сервиса StoreLand → Дизайн → Шаблон Осень → Нужна Помощь Редактировании Шаблона Осень Автор Гость_Olga1215_* , 16 нояб. 2018 осень, шапка, фон сайта и 4 еще...	0 Ответов 3 141 Просмотров	Olga1215 16 нояб. 2018
Вопросы работы сервиса StoreLand → Дизайн → Шаблон Весна → Другое → Убрать Строку-Меню Перед Подвалом Автор Гость_Olivka_* , 14 июня 2018 подвал, меню	2 Ответов 1 818 Просмотров	Vaccina 15 июня 2018