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

[Leonid19]

Добрый вечер! Помогите пожалуйста переместить поиск, растянуть меню и добавить группу вконакте
На данный момент сайт выглядит так:
Надо что бы получилось вот так:

[Castiel]

 Leonid19 (23 Январь 2014 - 17:31) писал:

Добрый вечер! Помогите пожалуйста переместить поиск, растянуть меню и добавить группу вконакте
На данный момент сайт выглядит так: Безымянный.jpg
Надо что бы получилось вот так: Безымянный.jpg

Здравствуйте,
редактируем шаблон HTML
Находим и вырезаем

												<!-- Форма поиска -->
				  <div id="search_block_top">
						<form id="searchbox" action="http://{NET_DOMAIN}/search" method="get" onsubmit="if($(this).find('#search_query_top').val()=='Поиск...') return false;">
						  <div class="search_block_top_form">
								<input id="search_query_top" type="text" name="q" value="{% IF SEARCH_QUERY %}{SEARCH_QUERY}{% ELSE %}Поиск...{% ENDIF %}" onfocus="if(this.value=='Поиск...'){this.value='';}" onblur="if(this.value==''){this.value='Поиск...';}" class="search_query light ac_input" />
								<input type="submit" name="submit_search" title="Искать" value="" class="search_button">
						  </div>
						</form>
				  </div>
				  <!-- /Форма поиска -->

Вставляем этот код перед

				  <!-- Корзина -->			   
		 <div id="header_shopping_cart">

редактируем style.css
Находим

#search_block_top {
position: static;
float: right;
clear: both;
margin: 0;
}

Заменяем на

#search_block_top {
position: static;
float: right;
clear: both;
margin-right: 174px;
margin-top: -13px;
}

Находим

#search_block_top #search_query_top {
width: 470px;
vertical-align: middle !important;
border: 1px solid #cecece!important;
padding-right: 35px;
}

Заменяем на

#search_block_top #search_query_top {
width: 300px;
vertical-align: middle !important;
border: 1px solid #cecece!important;
padding-right: 35px;
}

Находим

#search_block_top input[type=text] {
height: 25px!important;
}

Заменяем на

#search_block_top input[type=text] {
height: 36px!important;
}

Находим

.search_button {
width: 35px!important;
height: 26px!important;
background: transparent url('http://design.elephoneshop.ru/search.png') no-repeat 50%!important;
border: none!important;
position: absolute!important;
top: 0!important;
right: 0!important;
cursor: pointer!important;
box-shadow: none!important;
}

Заменяем на

.search_button {
width: 35px!important;
height: 36px!important;
background: transparent url('http://design.elephoneshop.ru/search.png') no-repeat 50%!important;
border: none!important;
position: absolute!important;
top: 0!important;
right: 0!important;
cursor: pointer!important;
box-shadow: none!important;
}

Находим

#header_shopping_cart {
position: static;
width: 170px;
float: right;
clear: both;
margin-top: -15px;
list-style: none;
background-clip: padding-box;
-moz-background-clip: padding-box;
-webkit-background-clip: padding-box;
background: #f7f7f7 url('http://design.elephoneshop.ru/cart_red.png') no-repeat 12px;
border: 1px solid #cecece;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
-moz-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
-webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
}

Заменяем на

#header_shopping_cart {
position: static;
width: 170px;
float: right;
clear: both;
margin-top: -36px;
list-style: none;
background-clip: padding-box;
-moz-background-clip: padding-box;
-webkit-background-clip: padding-box;
background: #f7f7f7 url('http://design.elephoneshop.ru/cart_red.png') no-repeat 12px;
border: 1px solid #cecece;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
-moz-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
-webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
}

[Leonid19]

Не чего не получилось, всё разбросало по сайту. В HTML шаблоне у меня два одинаковых кода
                                              <!-- Форма поиска -->
  <div id="search_block_top">
<form id="searchbox" action="http://{NET_DOMAIN}/search" method="get" onsubmit="if($(this).find('#search_query_top').val()=='Поиск...') return false;">
  <div class="search_block_top_form">
<input id="search_query_top" type="text" name="q" value="{% IF SEARCH_QUERY %}{SEARCH_QUERY}{% ELSE %}Поиск...{% ENDIF %}" onfocus="if(this.value=='Поиск...'){this.value='';}" onblur="if(this.value==''){this.value='Поиск...';}" class="search_query light ac_input" />
<input type="submit" name="submit_search" title="Искать" value="" class="search_button">
  </div>
</form>
  </div>
  <!-- /Форма поиска -->
Какой из низ вырезать? Перед каким из них вот этот код то вставлять?     
            <!-- Корзина -->                        
                 <div id="header_shopping_cart">

[miyako]

 Leonid19 (24 Январь 2014 - 06:22) писал:

Не чего не получилось, всё разбросало по сайту. В HTML шаблоне у меня два одинаковых кода
  <!-- Форма поиска -->
  <div id="search_block_top">
<form id="searchbox" action="http://{NET_DOMAIN}/search" method="get" onsubmit="if($(this).find('#search_query_top').val()=='Поиск...') return false;">
  <div class="search_block_top_form">
<input id="search_query_top" type="text" name="q" value="{% IF SEARCH_QUERY %}{SEARCH_QUERY}{% ELSE %}Поиск...{% ENDIF %}" onfocus="if(this.value=='Поиск...'){this.value='';}" onblur="if(this.value==''){this.value='Поиск...';}" class="search_query light ac_input" />
<input type="submit" name="submit_search" title="Искать" value="" class="search_button">
  </div>
</form>
  </div>
  <!-- /Форма поиска -->
Какой из низ вырезать? Перед каким из них вот этот код то вставлять?
<!-- Корзина -->
<div id="header_shopping_cart">

Найдите код в шаблоне HTML -

<ul id="megamenu">
				
								
											 <!-- Форма поиска -->
				 <div id="search_block_top">
					 <form id="searchbox" action="http://{NET_DOMAIN}/search" method="get" onsubmit="if($(this).find('#search_query_top').val()=='Поиск...') return false;">
						 <div class="search_block_top_form">
							 <input id="search_query_top" type="text" name="q" value="{% IF SEARCH_QUERY %}{SEARCH_QUERY}{% ELSE %}Поиск...{% ENDIF %}" onfocus="if(this.value=='Поиск...'){this.value='';}" onblur="if(this.value==''){this.value='Поиск...';}" class="search_query light ac_input" />
							 <input type="submit" name="submit_search" title="Искать" value="" class="search_button">
						 </div>
					 </form>
				 </div>
				 <!-- /Форма поиска -->

строки 173 по 185

и замените на -

<ul id="megamenu">
				
								

Далее найдите код -

			 <div id="header-right">

и после него добавьте -

<!-- Форма поиска -->
				 <div id="search_block_top">
					 <form id="searchbox" action="http://{NET_DOMAIN}/search" method="get" onsubmit="if($(this).find('#search_query_top').val()=='Поиск...') return false;">
						 <div class="search_block_top_form">
							 <input id="search_query_top" type="text" name="q" value="{% IF SEARCH_QUERY %}{SEARCH_QUERY}{% ELSE %}Поиск...{% ENDIF %}" onfocus="if(this.value=='Поиск...'){this.value='';}" onblur="if(this.value==''){this.value='Поиск...';}" class="search_query light ac_input" />
							 <input type="submit" name="submit_search" title="Искать" value="" class="search_button">
						 </div>
					 </form>
				 </div>
				 <!-- /Форма поиска -->

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

#header-right {
height: 140px;
z-index: 20;
position: absolute;
right: 0;
top: 65px;
}

и замените на -

#header-right {
height: 140px;
z-index: 20;
position: absolute;
right: 0;
top: 76px;
}

Далее найдите код -

#search_block_top {
position: static;
float: right;
clear: both;
margin: 0;
}

и замените на -

#search_block_top {
position: static;
clear: both;
margin: 0;
float: left;
}

Далее найдите код -

#search_block_top input[type=text] {
height: 25px!important;
}

и замените на -

#search_block_top input[type=text] {
height: 36px!important;
}

Далее найдите код -

#header_user_info {
color: #fafafa;
font-size: 12px;
text-align: right;
clear: both;
margin-top: 6px;
padding: 0;
display: block;
}

и замените на -

#header_user_info {
color: #fafafa;
font-size: 12px;
text-align: right;
clear: both;
margin-top: 6px;
padding: 0;
display: none;
}

Далее найдите код -

#header_shopping_cart {
position: static;
width: 170px;
float: right;
clear: both;
margin-top: -15px;
list-style: none;
background-clip: padding-box;
-moz-background-clip: padding-box;
-webkit-background-clip: padding-box;
background: #f7f7f7 url('{ASSETS_IMAGES_PATH}cart_red.png') no-repeat 12px;
border: 1px solid #cecece;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
-moz-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
-webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
}

и замените на -

#header_shopping_cart {
position: static;
width: 170px;
float: right;
list-style: none;
background-clip: padding-box;
-moz-background-clip: padding-box;
-webkit-background-clip: padding-box;
background: #f7f7f7 url('{ASSETS_IMAGES_PATH}cart_red.png') no-repeat 12px;
border: 1px solid #cecece;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
-moz-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
-webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
}

Затем найдите код -

#header #cart_block {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
-moz-box-shadow: 0 0 0 1px rgba(0,0,0,0.095) ,0 1.5px 1.5px 0 rgba(0,0,0,0.2),0 2px 1.5px 0 rgba(0,0,0,0.1);
-webkit-box-shadow: 0 0 0 1px rgba(0,0,0,0.095) ,0 1.5px 1.5px 0 rgba(0,0,0,0.2),0 2px 1.5px 0 rgba(0,0,0,0.1);
box-shadow: 0 0 0 1px rgba(0,0,0,0.095) ,0 1.5px 1.5px 0 rgba(0,0,0,0.2),0 2px 1.5px 0 rgba(0,0,0,0.1);
top: 86px;
background: #fcfcfc;
width: auto;
}

и замените на -

#header #cart_block {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
-moz-box-shadow: 0 0 0 1px rgba(0,0,0,0.095) ,0 1.5px 1.5px 0 rgba(0,0,0,0.2),0 2px 1.5px 0 rgba(0,0,0,0.1);
-webkit-box-shadow: 0 0 0 1px rgba(0,0,0,0.095) ,0 1.5px 1.5px 0 rgba(0,0,0,0.2),0 2px 1.5px 0 rgba(0,0,0,0.1);
box-shadow: 0 0 0 1px rgba(0,0,0,0.095) ,0 1.5px 1.5px 0 rgba(0,0,0,0.2),0 2px 1.5px 0 rgba(0,0,0,0.1);
background: #fcfcfc;
width: auto;
top: 50px;
}

Должно получится как на скриншоте -

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

• 

[Leonid19]

С поиском всё получилось, большое спасибо!
Но теперь подвал гармошкой и половина верхнего меню не активна

[miyako]

 Leonid19 (24 Январь 2014 - 14:14) писал:

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

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

[Leonid19]

 miyako (24 Январь 2014 - 15:56) писал:

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

Хорошо, сейчас верну.

[Leonid19]

 miyako (24 Январь 2014 - 15:56) писал:

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

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

[Stasya]

Сейчас на Вашем сайте работают все пункты верхнего меню.

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

• 
• 

[Farid]

А как все таки добавить группу вк?

[Vaccina]

Сгенерируйте код виджета, если вы хотите расположить его после каталога товаров, то зайдите в шаблон HTML и вставьте код после:

</div>
			<!-- /Каталог товаров -->
		  </div>
		</div>

сл.образом:

<div class="block2">
код виджета
</div>