Перейти к содержимому


Помогите С Дизайном! Срочно!


  • Авторизуйтесь для ответа в теме
Сообщений в теме: 19

#1 Roman(GRR)

Roman(GRR)

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

  • Пользователи
  • PipPipPip
  • 76 сообщений

Отправлено 08 Август 2013 - 08:07

Добрый день нужна помощь профессионалов!

0)Меню поднять на верх, а каталог сделать в отдельном от страницы блоке чуть выше, отметил на 5 скрине

1)Нужно сделать такую же корзину как на первом скрине вот сайт http://masterpuf.ru/

2) Сделать все блоки раздельными и скругленными. На скрине выделил пустые места красным.

3) сделать такой жепоиск как на этом сайте http://tonometr5.ru/, указал на втором скрине, надо так же над блоками
мой сайт http://bigb.storeland.ru

4) Сделать такие же отзывы, как на этом сайте http://masterpuf.ru/, он работает тоже на storeland, значит и мне можно реализовать такое же. Отметил на 3 скрине!

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

Заранее тому кто поможет очень сильно благодарен!

.

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

  • Безымяммнный.png
  • Безымянааный.png
  • Бссезымянный.png
  • Безымяииный.jpg
  • Безымянппный.png


#2 Roman(GRR)

Roman(GRR)

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

  • Пользователи
  • PipPipPip
  • 76 сообщений

Отправлено 08 Август 2013 - 08:30

6) Всё должно получиться примерно так! Смотрите 6 скрин.

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

  • Безымттянный.png


#3 Stasya

Stasya

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

  • Модератоpы
  • 4 007 сообщений

Отправлено 08 Август 2013 - 12:47

0) В файле main.css найдите блок
#logo {
height: 134px;
}
и замените его на
#logo {
height: 134px;
margin-left: -155px;
}
Теперь в шаблоне HTML найдите блок
<!-- Верхний блок навигации -->
<div class="containerin" id="top-menu">
<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>
<div class="clr"></div>
</div>
<!-- end Верхний блок навигации -->
скопируйте, удалите и вставьте после блока
<div class="pad-box cont620" id="logo"><a href="http://{NET_DOMAIN}/"><span>На главную</span></a></div>
Теперь в файле maiin.css найдите блок
#top-menu {
height: 40px;
overflow: hidden;
margin-top: 125px;
}
и замените его на
#top-menu {
height: 40px;
overflow: hidden;
}

Далее найдите блок
<ul class="leftmenu">
							 <li class="categories">
								
						 <div class="sdvig">
<ul>
								 {%IFNOT catalog_empty %}
										 {% FOR catalog %}
										 {% IFNOT catalog.HIDE %}
												 <li class="cat-item">
												 <a href="{catalog.URL}"
														 {% IF catalog.LEVEL>0%}style="padding-left:{catalog.LEVEL | multiply("20")}px"{% ENDIF %}
														 {% IF catalog.CURRENT %}class="selected"{% ENDIF %}
												 >{catalog.NAME}</a>
												 <div></div>
												 </li>
										 {% ENDIF %}
										 {% ENDFOR %}
								 {% ENDIF %}
								 </ul></div><br />
								 </li></ul>
удалите его и после строки
<!-- end Поиск -->
вставьте блок
<ul class="leftmenu" style="margin-top:119px;">
							 <li class="categories">
								
						 <div class="sdvig">
<ul>
								 {%IFNOT catalog_empty %}
										 {% FOR catalog %}
										 {% IFNOT catalog.HIDE %}
												 <li class="cat-item">
												 <a href="{catalog.URL}"
														 {% IF catalog.LEVEL>0%}style="padding-left:{catalog.LEVEL | multiply("20")}px"{% ENDIF %}
														 {% IF catalog.CURRENT %}class="selected"{% ENDIF %}
												 >{catalog.NAME}</a>
												 <div></div>
												 </li>
										 {% ENDIF %}
										 {% ENDFOR %}
								 {% ENDIF %}
								 </ul></div><br />
								 </li></ul>
1. В файле main.css найдите блок
#cartInfo {
position: absolute;
font-size: 13px;
top: 14px;
left: 283px;
white-space: nowrap;
overflow: hidden;
height: 20px;
width: 340px;
color: white !important;
}
  и замените его на
#cartInfo {
position: absolute;
font-size: 13px;
top: -1px;
left: 637px;
white-space: nowrap;
overflow: hidden;
height: 23px;
width: 189px;
color: rgb(17, 16, 16) !important;
background: rgb(209, 209, 211);
padding-top: 15px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
}

2. В том же файле найдите блок
.content_catalog .pad-box .leftmenu {
border: 1px solid #E5E5E5 !important;
border-radius: 5px;
box-shadow: 0 0 8px rgba(0,0,0,0.5);
padding: 5px;
}
и замените его на
.content_catalog .pad-box .leftmenu li {
border: 1px solid #E5E5E5 !important;
border-radius: 5px;
box-shadow: 0 0 8px rgba(0,0,0,0.5);
padding: 5px;
margin-bottom: 10px;
}

3. В шаблоне hTML найдите блок [size=4]
[/size]
<!-- Поиск -->
		 <div id="search">
		 <form action="http://{NET_DOMAIN}/search" id="searchform" method="get">
				 <div>
				 <input type="text" value="{% IF SEARCH_QUERY %}{SEARCH_QUERY}{%ELSE%}Поиск{%ENDIF%}" onblur="this.value=(this.value=='') ? 'Поиск' : this.value;" onfocus="this.value=(this.value=='Поиск') ? '' : this.value;" id="s" class="search_box alignleft" name="q" />
				 <input type="image" class="submit alignright" src="{ASSETS_IMAGES_PATH}search_but.gif" />
				 <div class="clr"></div>
				 </div>
		 </form>
		 </div>
		 <div class="clr"></div>
		 <!-- end Поиск -->
и удалите его. Теперь найдите блок
<li class="categories">
								 <br />
								 </li>
и замените его на
<li >
								 <!-- Поиск -->
		 <div id="search">
		 <form action="http://{NET_DOMAIN}/search" id="searchform" method="get">
				 <div>
				 <input type="text" value="{% IF SEARCH_QUERY %}{SEARCH_QUERY}{%ELSE%}Поиск{%ENDIF%}" onblur="this.value=(this.value=='') ? 'Поиск' : this.value;" onfocus="this.value=(this.value=='Поиск') ? '' : this.value;" id="s" class="search_box alignleft" name="q" />
				 <input type="image" class="submit alignright" src="{ASSETS_IMAGES_PATH}search_but.gif" />
				 <div class="clr"></div>
				 </div>
		 </form>
		 </div>
		 <div class="clr"></div>
		 <!-- end Поиск -->
								 <br />
								 <br />
								 </li>
В файле main.css найдите блок
#search {
height: 35px;
float: right;
padding-top: 5px;
padding-right: 15px;
width: 247px;
right: 136px;
position: absolute;
}
и замените его на
#search {
height: 35px;
float: right;
padding-top: 5px;
padding-right: 15px;
width: 202px;
right: 136px;
position: absolute;
margin-right: -92px;
margin-top: -5px;
}

4. Данный магазин находиться не нашей платформе. И у нас такое, к сожалению реализовать нельзя.

5. Вам поможет данная тема.

#4 Roman(GRR)

Roman(GRR)

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

  • Пользователи
  • PipPipPip
  • 76 сообщений

Отправлено 08 Август 2013 - 12:55

Спасибо, а с остальными не поможете?

#5 Stasya

Stasya

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

  • Модератоpы
  • 4 007 сообщений

Отправлено 08 Август 2013 - 16:21

Я дописала свое  сообщение выше.

#6 Roman(GRR)

Roman(GRR)

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

  • Пользователи
  • PipPipPip
  • 76 сообщений

Отправлено 08 Август 2013 - 18:37

5) Вы написали: поможет данная тема, это мне шаблон надо менять или вы про тему форума??


#7 sengun

sengun

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

  • Модератоpы
  • 1 139 сообщений
  • ГородНижний Новгород

Отправлено 08 Август 2013 - 21:04

Просмотр сообщенияRoman(GRR) (08 Август 2013 - 18:37) писал:

5) Вы написали: поможет данная тема, это мне шаблон надо менять или вы про тему форума??
Имелась ввиду тема форума. У вас есть 3 блока под логотипом и телефонами, вы уже справились с задачей?

#8 Roman(GRR)

Roman(GRR)

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

  • Пользователи
  • PipPipPip
  • 76 сообщений

Отправлено 09 Август 2013 - 07:22

Ещё нет, это просто картинка, шапка сайта, а мне надо что бы были блоки.

Вот ещё меня выше не много не поняли.

1)по поводу страницы, она должна быть отдельно стоять от блоков, т.е. так же как и блоки скруглена и не должна доходить до блоков, я отметил зелёным.
2)По поводу корзины, мне надо что бы там был значок тележки или корзинки, и написано "Корзина(0)", т.е. что бы было число вместо "на сколько рублей товаров в корзине"
3)Верхнее меню, перегородки между пунктами надо сделать, меньше я указал голубой стрелочкой.
4)Нижнее меню, которое находится под блоками надо обрамить в тоже скругленую форму как блоки. ещё я заметил что когда на него наводишь оно сдвигается вправо, теперь это можно убрать, т.к. вместе с ним дёргаются картинки товаров
5)Выделил жёлтым, то что там написано, это я в граф редакторе сделал, как сделать точно такое же только уже на сайте?
6)По поводу пункта 5 выше, по той теме котрую вы мне дали я сделать не могу, т.к. у меня в файле html нету блока <Шапка сайта>

Опять я много написал, заранее спасибо.

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

  • Безыпмянный.png


#9 Taisia

Taisia

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

  • Модератоpы
  • 1 289 сообщений

Отправлено 09 Август 2013 - 12:31

Прежде чем производить изменения сделайте бэкап сайта

далее

1) найдите в файле main.css код

#cpages  {
	background:; /* Цвет фона */
	-moz-box-shadow: 0 0 10px rgba(0,0,0,0.5); /* Для Firefox */
	-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5); /* Для Safari и Chrome */
	box-shadow: 0 0 15px rgba(0,0,0,0.5); /* Параметры тени */
  padding: 10px 10px 10px 0px;
}

замените на код

#cpages  {
  padding: 10px 10px 10px 0px;
}

там же найдите код

.content_body {
  vertical-align:top;
}

замените на код

.content_body {
  vertical-align:top;
-moz-box-shadow: 0 0 10px rgba(0,0,0,0.5); /* Для Firefox */
	-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5); /* Для Safari и Chrome */
	box-shadow: 0 0 15px rgba(0,0,0,0.5); /* Параметры тени */
  padding: 10px 10px 10px 0px;
}

2)
прежде всего загрузите через вкладку Сайт-Редактор шаблонов- добавить файл изображение корзины которое вы хотите видеть на сайте.

3) перегородки это изображение что бы они стали меньше по высоте вам необходимо скачать изображение с сайта уменьшить его высоту в графическом редакторе и снова загрузить на сайт
ссылка на изображение для наглядности http://bigb.storeland.net/78.png

#10 Taisia

Taisia

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

  • Модератоpы
  • 1 289 сообщений

Отправлено 09 Август 2013 - 12:39

4) что бы ссылки перестали двигаться найдите код в main.css
.sdvig a {
-moz-transition: all 0.1s ease-in-out;
-o-transition: all 0.1s ease-in-out;
-webkit-transition: all 0.1s ease-in-out;
color:#222;
display:block;
}

И замените на код

.sdvig a {
-moz-transition: all 0.1s ease-in-out;
-o-transition: all 0.1s ease-in-out;
color:#222;
display:block;
}


#11 Roman(GRR)

Roman(GRR)

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

  • Пользователи
  • PipPipPip
  • 76 сообщений

Отправлено 09 Август 2013 - 12:42

Я тут ещё ошибку заметил на форуме storeland.ru  Вот тема которую я создал http://forum.storela...ме-storelandru/

#12 Taisia

Taisia

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

  • Модератоpы
  • 1 289 сообщений

Отправлено 09 Август 2013 - 12:45

добавьте код в main.css в конец файла

.sdvig ul li {border: 1px solid #E5E5E5 !important;
border-radius: 5px;
box-shadow: 0 0 8px rgba(0,0,0,0.5);
padding: 5px;
margin-bottom: 10px;
}

найдите код

#header {
		height: 374px;
}

замените на код

#header {
		height: 400px;
}


#13 Taisia

Taisia

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

  • Модератоpы
  • 1 289 сообщений

Отправлено 09 Август 2013 - 12:55

5)

найдите код
#contactInfo {
  position:absolute;
  font-size:1.8em;
  top: 79px;
left: 605px;
color: #9605c5;
}

и замените на код

#contactInfo {
  position:absolute;
  font-size:1.8em;
  top: 47px;
  left: 643px;
  color: yellow;
  border: solid;
}


#14 Roman(GRR)

Roman(GRR)

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

  • Пользователи
  • PipPipPip
  • 76 сообщений

Отправлено 09 Август 2013 - 13:01

2) Добавил, называется "корзина.png"


Ещё у нижнего меню надо убрать полосы

5) Да мне не рамку надо, а что бы эти надписи вывелись, точно такие же.
Что бы они не на картинки были а как текст на сайте!

7) А можно ещё мне кнопочку обратного звонка? :rolleyes:

#15 Taisia

Taisia

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

  • Модератоpы
  • 1 289 сообщений

Отправлено 09 Август 2013 - 13:04

Чем более детально вы объясняете тем проще понять что вы хотите видеть в конечном результате.

по пункту 6)

из темы на которую вам дали ссылку вставьте код

<div class="blocks"><table><tbody><tr>
				 <td width="33%" class="w"><div class="block">
				 <div class="img">
						 <a href="адрес на страницу" title="Описание адреса"><img src="{ASSETS_IMAGES_PATH}block1.png" alt="Описание изображения"></a>
				 </div>
				 </div></td>
				 <td width="33%" class="w"><div class="block">
				 <div class="img">
				 <a href="адрес на страницу" title="Описание адреса"><img src="{ASSETS_IMAGES_PATH}block2.png" alt="Описание изображения"></a>
				 </div>
				 </div></td>
				 <td width="33%" class="w"><div class="block">
				 <div class="img">
						 <a href="адрес на страницу" title="Описание адреса"><img src="{ASSETS_IMAGES_PATH}block3.png" alt="Описание изображения"></a>
				 </div>
				 </div></td>
				 </tr></tbody></table>
			
		 </div>


ПЕРЕД кодом в вашем файле html

</div>
<div class="container" id="cpages">


замените block1.png block2.png block3.png на ваши названия изображений

так же учтите что после вставки вам необходимо будет увеличить высоту шапки в коде

#header {
				height: 400px;
}


#16 Roman(GRR)

Roman(GRR)

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

  • Пользователи
  • PipPipPip
  • 76 сообщений

Отправлено 09 Август 2013 - 13:10

1)Страница должна быть не квадратной, а скруглена как блоки
2) по корзине я думаю должно быть понятно.
5)http://tonometr5.ru/   вот видите у них номер и кнопка обратного звонка, мне надо так же, У них номер с текстом не на картинке, а текстом прописан.
6)Помогите мне ещё по 6 пункту.

Кстати, а там премиальные за нахождение ошибки не дают? :huh:

По пункту 6, там изображения получаются под меню, а мне надо НАД ним сделать

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

  • 78й.png


#17 Taisia

Taisia

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

  • Модератоpы
  • 1 289 сообщений

Отправлено 09 Август 2013 - 13:28

Просмотр сообщенияRoman(GRR) (09 Август 2013 - 13:01) писал:


Ещё у нижнего меню надо убрать полосы



Найдите код

.leftmenu li li div {
border-bottom: 1px solid #D6D6D6;
}

и удалите его из файла main.css

код для блоков вы вставили не корректно
еще раз прочитайте инструкцию

Цитата

Кстати, а там премиальные за нахождение ошибки не дают? :huh:


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

Что бы закруглить карая у страницы найдите код

.content_body {
  vertical-align:top;
-moz-box-shadow: 0 0 10px rgba(0,0,0,0.5); /* Для Firefox */
		-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5); /* Для Safari и Chrome */
		box-shadow: 0 0 15px rgba(0,0,0,0.5); /* Параметры тени */
  padding: 10px 10px 10px 0px;
}

и замените его на код

.content_body {
  vertical-align:top;
-moz-box-shadow: 0 0 10px rgba(0,0,0,0.5); /* Для Firefox */
		-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5); /* Для Safari и Chrome */
		box-shadow: 0 0 15px rgba(0,0,0,0.5); /* Параметры тени */
  padding: 10px 10px 10px 0px;
  border-radius: 5px;
}

что бы поменять текст корзины найдите в файле html  код

<!-- Корзина -->
		 <div id="cartInfo">
		 <a href="{CART_URL}">в корзине товаров на</a>:
		 <span id="cartSum">

меняйте текст в корзине товаров на на нужный вам

перезалейте ваш файл изображения корзины заменив название на ЛАТИНСКИЕ буквы.

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

по шестому пункту
вы не верно вставили код - я писала вам о это выше в сообщении
пожалуйста внимательно читайте инструкции

найдите у вас в файле html  код

</div>
<!-- контент -->
<div class="blocks"><table><tbody><tr>
								 <td width="33%" class="w"><div class="block">
								 <div class="img">
												 <a href="адрес на страницу" title="Описание адреса"><img src="{ASSETS_IMAGES_PATH}block1.png" alt="Описание изображения"></a>
								 </div>
								 </div></td>
								 <td width="33%" class="w"><div class="block">
								 <div class="img">
								 <a href="адрес на страницу" title="Описание адреса"><img src="{ASSETS_IMAGES_PATH}block2.png" alt="Описание изображения"></a>
								 </div>
								 </div></td>
								 <td width="33%" class="w"><div class="block">
								 <div class="img">
												 <a href="адрес на страницу" title="Описание адреса"><img src="{ASSETS_IMAGES_PATH}block3.png" alt="Описание изображения"></a>
								 </div>
								 </div></td>
								 </tr></tbody></table>
					   
				 </div>
<div class="container" id="cpages">

и замените на код

<!-- контент -->
<div class="blocks"><table><tbody><tr>
								 <td width="33%" class="w"><div class="block">
								 <div class="img">
												 <a href="адрес на страницу" title="Описание адреса"><img src="{ASSETS_IMAGES_PATH}block1.png" alt="Описание изображения"></a>
								 </div>
								 </div></td>
								 <td width="33%" class="w"><div class="block">
								 <div class="img">
								 <a href="адрес на страницу" title="Описание адреса"><img src="{ASSETS_IMAGES_PATH}block2.png" alt="Описание изображения"></a>
								 </div>
								 </div></td>
								 <td width="33%" class="w"><div class="block">
								 <div class="img">
												 <a href="адрес на страницу" title="Описание адреса"><img src="{ASSETS_IMAGES_PATH}block3.png" alt="Описание изображения"></a>
								 </div>
								 </div></td>
								 </tr></tbody></table>
					   
				 </div></div>
<div class="container" id="cpages">


#18 Roman(GRR)

Roman(GRR)

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

  • Пользователи
  • PipPipPip
  • 76 сообщений

Отправлено 09 Август 2013 - 13:31

Спасибо вам! :) А по пункту 5??
6 пункт тоже не получается сделать

#19 Taisia

Taisia

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

  • Модератоpы
  • 1 289 сообщений

Отправлено 09 Август 2013 - 13:40

что бы вставить уже готовое изображение корзины вам необходимо найти в файле html  код

<!-- Корзина -->
		 <div id="cartInfo">
		 <a href="{CART_URL}">в корзине товаров на</a>:

и заменить на код

<!-- Корзина -->
		 <div id="cartInfo">
<img src="{ASSETS_IMAGES_PATH}тут имя изображения вашей корзины.jpg">
		 <a href="{CART_URL}">в корзине товаров на</a>:

по вопросу кнопки "заказать звонок"
ознакомьтесь пожалуйста с темой

http://forum.storela...братный-звонок/

что бы телефоны на сайте были не картинкой а текстом заполните соответствующие поля в админке магазина вкладка Настройки-Основные
поля
Телефоны на сайте:
Время работы магазина: и тд.

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

#20 Vaccina

Vaccina

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

  • Модераторы
  • 24 353 сообщений

Отправлено 09 Август 2013 - 23:16

6. Как понимаю, необходимо изображения разместить над категориями(сумки из натуральной кожи и т.д.), для этого код:
<div class="blocks"><table><tbody><tr>
								 <td width="33%" class="w"><div class="block">
								 <div class="img">
												 <a href="адрес на страницу" title="Описание адреса"><img src="{ASSETS_IMAGES_PATH}block1.png" alt="Описание изображения"></a>
								 </div>
								 </div></td>
								 <td width="33%" class="w"><div class="block">
								 <div class="img">
								 <a href="адрес на страницу" title="Описание адреса"><img src="{ASSETS_IMAGES_PATH}block2.png" alt="Описание изображения"></a>
								 </div>
								 </div></td>
								 <td width="33%" class="w"><div class="block">
								 <div class="img">
												 <a href="адрес на страницу" title="Описание адреса"><img src="{ASSETS_IMAGES_PATH}block3.png" alt="Описание изображения"></a>
								 </div>
								 </div></td>
								 </tr></tbody></table>
					   
				 </div>
необходимо переместить и поставить перед:
<ul class="leftmenu" style="margin-top:293px;">
														 <li class="categories">
															   
												 <div class="sdvig">
<ul>
																 {%IFNOT catalog_empty %}
																				 {% FOR catalog %}
																				 {% IFNOT catalog.HIDE %}
																								 <li class="cat-item">
																								 <a href="{catalog.URL}"
																												 {% IF catalog.LEVEL>0%}style="padding-left:{catalog.LEVEL | multiply("20")}px"{% ENDIF %}
																												 {% IF catalog.CURRENT %}class="selected"{% ENDIF %}
																								 >{catalog.NAME}</a>
																								 <div></div>
																								 </li>
																				 {% ENDIF %}
																				 {% ENDFOR %}
																 {% ENDIF %}
																 </ul></div><br />
																 </li></ul>





Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных