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


Глобальные Изменения В Шаблоне.

изменение стиля изменение шаб лона вечность расположение элементов

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

#1 ConstantinRS

ConstantinRS

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

  • Пользователи
  • PipPipPip
  • 110 сообщений
  • ГородЧелябинск

Отправлено 05 Январь 2014 - 08:11

Здравствуйте.

Боюсь, специалисты StoreLand меня скоро посылать будут.. ) Но сайт мне нужен, и не довести его до приличного состояния я не могу.

Что имеем:

ДО.png

Как должно выглядеть в итоге:

ПОСЛЕ.png

Что требуется сделать:
1. Удалить отображение названия страницы и строку навигации.
2. Про удаление старой корзины вопрос уже есть в теме: http://forum.storela...-окне-браузера/
Так что дублировать не буду. Пишу это лишь, чтобы ясно было, куда корзина денется.
3. Заменить панель каталога на восемь изображений 170х100 пикселей с небольшим расстоянием друг от друга.
На каждый пункт будет по два изображения, второе- для замены изображения в случае, когда активен соответствующий раздел каталога. Панель каталога из восьми изображений должна также отображаться на всех страницах сайта.
4. Над логотипом и под ним есть расстояние, на которое хотелось бы поднять всю страницу.
5. Необходимо подтянуть страницу до нового каталога из восьми изображений.
6. Над элементом "Поиск по магазину.." хотелось бы добавить изображение. В нём планирую разместить номер телефона горячей линии.
7. Некогда изменил вид страницы каталога. По умолчанию, сразу отображаются товары, а я сделал меню каталога, как в остальных шаблонах и не могу найти тему, из которой брал инструкцию..
Если не сложно напишите, пожалуйста, как изменить вид страницы "Каталог" к стандартному.
Помню, что менял то-то в шаблоне HTML и добавлял в конец Style.css, или наоборот.

P.S. Прошу прощения, что с такими объёмами в праздничное время..

#2 ne_yana

ne_yana

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

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

Отправлено 07 Январь 2014 - 12:43

Просмотр сообщенияConstantinRS (05 Январь 2014 - 08:11) писал:

Здравствуйте.

Боюсь, специалисты StoreLand меня скоро посылать будут.. ) Но сайт мне нужен, и не довести его до приличного состояния я не могу.

Что имеем:

Прикрепленный файл ДО.png

Как должно выглядеть в итоге:

Прикрепленный файл ПОСЛЕ.png

Что требуется сделать:
1. Удалить отображение названия страницы и строку навигации.
2. Про удаление старой корзины вопрос уже есть в теме: http://forum.storela...-окне-браузера/
Так что дублировать не буду. Пишу это лишь, чтобы ясно было, куда корзина денется.
3. Заменить панель каталога на восемь изображений 170х100 пикселей с небольшим расстоянием друг от друга.
На каждый пункт будет по два изображения, второе- для замены изображения в случае, когда активен соответствующий раздел каталога. Панель каталога из восьми изображений должна также отображаться на всех страницах сайта.
4. Над логотипом и под ним есть расстояние, на которое хотелось бы поднять всю страницу.
5. Необходимо подтянуть страницу до нового каталога из восьми изображений.
6. Над элементом "Поиск по магазину.." хотелось бы добавить изображение. В нём планирую разместить номер телефона горячей линии.
7. Некогда изменил вид страницы каталога. По умолчанию, сразу отображаются товары, а я сделал меню каталога, как в остальных шаблонах и не могу найти тему, из которой брал инструкцию..
Если не сложно напишите, пожалуйста, как изменить вид страницы "Каталог" к стандартному.
Помню, что менял то-то в шаблоне HTML и добавлял в конец Style.css, или наоборот.

P.S. Прошу прощения, что с такими объёмами в праздничное время..
Здравствуйте,
1. В файле style.css замените
section header {margin-bottom: 1em; overflow: hidden;}
на
section header {margin-bottom: 1em; overflow: hidden;display: none;}
и
.breadcrumb {border: none;  margin: 1em 0; z-index: 10; position: relative;text-align: justify;}
на
.breadcrumb {border: none;  margin: 1em 0; z-index: 10; position: relative;text-align: justify;display: none;}


#3 ConstantinRS

ConstantinRS

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

  • Пользователи
  • PipPipPip
  • 110 сообщений
  • ГородЧелябинск

Отправлено 10 Январь 2014 - 20:01

Спасибо. Помогло. Хотя, сортировку саму хотелось бы оставить, но она удаляется этим способом вместе с названием страницы... )

Ещё озвучу пару проблем, которые так и не удалось решить. (нумерация в продолжение предыдущего сообщения):

8. При обновлении страницы или переходе к другой странице сайта происходит подобное мерцание:
мерцание.png
Хотелось бы без него обойтись. Просто чтобы вовремя загрузки страницы отображалась текущая страница, а уже после загрузки необходимой страницы происходило отображение последней.

9. Хотелось бы уже убрать цифру количества рядом со словом "заказать"/"купить":
колво товаров.png

#4 Castiel

Castiel

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

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

Отправлено 10 Январь 2014 - 21:55

Просмотр сообщенияConstantinRS (10 Январь 2014 - 20:01) писал:

Спасибо. Помогло. Хотя, сортировку саму хотелось бы оставить, но она удаляется этим способом вместе с названием страницы... )

Ещё озвучу пару проблем, которые так и не удалось решить. (нумерация в продолжение предыдущего сообщения):

8. При обновлении страницы или переходе к другой странице сайта происходит подобное мерцание:
Прикрепленный файл мерцание.png
Хотелось бы без него обойтись. Просто чтобы вовремя загрузки страницы отображалась текущая страница, а уже после загрузки необходимой страницы происходило отображение последней.

9. Хотелось бы уже убрать цифру количества рядом со словом "заказать"/"купить":
Прикрепленный файл колво товаров.png

9. Редактируем шаблон Товар
Находим
<input name="form[goods_mod_quantity]" id="qty" maxlength="12" value="1" title="Количество" style="float: left;text-align: right;width: 30px;margin-top: 1px;margin-right: 1%;padding-right: 5px;">

Заменяем на
<!-- <input name="form[goods_mod_quantity]" id="qty" maxlength="12" value="1" title="Количество" style="float: left;text-align: right;width: 30px;margin-top: 1px;margin-right: 1%;padding-right: 5px;"-->

8. Находим
html {
-webkit-font-smoothing: antialiased;
background: #0f0f0f;
}

Заменяем на
html {
-webkit-font-smoothing: antialiased;
}


#5 ConstantinRS

ConstantinRS

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

  • Пользователи
  • PipPipPip
  • 110 сообщений
  • ГородЧелябинск

Отправлено 11 Январь 2014 - 13:22

Спасибо, Castiel )

Ладно, я так понял- с заменой панели каталога на изображения никто возиться не хочет, помогите хотя бы в следующих вопросах:
1. Удаление название страницы добавлением  
 display:none; 
удаляет и сортировку, которую хотелось бы оставить. Как сделать так, чтобы название страницы не отображалось, а сортировка осталась?

2. Удалить в сортировке изменение вида каталога:
сортировка.png
3. Над элементом "Поиск по магазину.." хотелось бы добавить изображение. В нём планирую разместить номер телефона горячей линии:
горячая линия.png

В итоге страница должна получить следующий вид:
конечный вид.png

#6 Vaccina

Vaccina

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

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

Отправлено 14 Январь 2014 - 06:18

Цитата

3. Заменить панель каталога на восемь изображений 170х100 пикселей с небольшим расстоянием друг от друга.
На каждый пункт будет по два изображения, второе- для замены изображения в случае, когда активен соответствующий раздел каталога. Панель каталога из восьми изображений должна также отображаться на всех страницах сайта.

проблема скорее в том, что это все вручную придется делать, то бишь писать структуру и стили с нуля, а-ля:

<div class="catalog_img">
<ul>
<li><a href="ссылка на категорию">название категории</a></li>
<li><a href="ссылка на категорию">название категории</a></li>
<li><a href="ссылка на категорию">название категории</a></li>
...
</ul>
</div>
структура выше легка и понятна, вставьте ее измененную вместо чего-то или найдите ей новое местечко.

по стилям, в частности по картинкам вам необходимо обязательно изучить следующее(это в вашем случае крайне удобно будет при применении):
http://htmlbook.ru/css/nth-child
http://htmlbook.ru/css/hover

Если возникнут конкретные вопросы, то мы тут =)

1.В style.css найдите:
header.controls {
	background: none repeat scroll 0 0 #F1F1F0 !important;
	margin-bottom: 0;
	padding: 1em;
}
замените на:
header.controls {
	background: none repeat scroll 0 0 #F1F1F0 !important;
	display: block;
	margin-bottom: 0;
	padding: 1em;
}
2.В style.css найдите:
.view-switch {
	float: right;
}
замените на:
.view-switch {
	display: none;
	float: right;
}
3.В шаблоне HTML найдите:

<header role="banner">
после него попробуйте вставить следующее:

<div style="float:right;"><a href="ссылка"><img src="ссылка на картинку" alt="" /></a></div>


#7 ConstantinRS

ConstantinRS

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

  • Пользователи
  • PipPipPip
  • 110 сообщений
  • ГородЧелябинск

Отправлено 14 Январь 2014 - 22:16

Vaccina, огромное спасибо! )
Вопросы 2 и 3 разрешились мгновенно. А вот действия из ответа к первому, почему-то, ни к чему не привели..
У меня в style.css точного Вами указанного кода нет.
header.controls {
background: none repeat scroll 0 0 #F1F1F0 !important;
margin-bottom: 0;
padding: 1em;
}
Я решил, что нужный- это:
.two-column header.controls {padding: 1em; background: #f1f1f0; margin-bottom: 0em;}
либо:
header.controls {[size=4]padding: 1em;background: #F1F1F0 !important;margin-bottom: 0em;}[/size]
И в том и другом случае добавление
display: block;
не позволило убрать название категории между каталогом и сортировкой..
Танцы с бубном и поиском по форуму тоже не увенчались успехом..
Хотелось бы всё же убрать название категории, сохранив сортировку.

Ещё раз спасибо за решение двух вопросов и информацию о создании структуры с изображениями- обязательно воспользуюсь в будущем )

#8 Vaccina

Vaccina

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

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

Отправлено 15 Январь 2014 - 04:18

А вы немного не так танцевали =) Для начала необходимо было следовать сл.инструкции:

Просмотр сообщенияne_yana (07 Январь 2014 - 12:43) писал:

Здравствуйте,
1. В файле style.css замените
section header {margin-bottom: 1em; overflow: hidden;}
на
section header {margin-bottom: 1em; overflow: hidden;display: none;}
и
.breadcrumb {border: none; margin: 1em 0; z-index: 10; position: relative;text-align: justify;}
на
.breadcrumb {border: none; margin: 1em 0; z-index: 10; position: relative;text-align: justify;display: none;}

и далее уже по моей =)

А в стилях код в оригинале так выглядит:

header.controls {padding: 1em;background: #F1F1F0 !important;margin-bottom: 0em;}


#9 Vaccina

Vaccina

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

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

Отправлено 15 Январь 2014 - 04:24

Кстати на счет каталога, тут все же можно намного проще сделать, изменить уже имеющийся, просто для <a> задать стили примерно следующие:

.nav > li > .parent:nth-child(1){
background: url(ссылка на иконку) no-repeat left top;
text-indent: 9999px; //прячем текст
width:40px; // ширина кнопки
height:40px; // высота кнопки
display:block;
}
.nav > li > .parent:nth-child(2){
background: url(ссылка на 2ую иконку) no-repeat left top;
text-indent: 9999px; //прячем текст
width:40px; // ширина кнопки
height:40px; // высота кнопки
display:block;
}
................. и т.д.


#10 luzikov

luzikov

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

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

Отправлено 31 Март 2014 - 17:59

Просмотр сообщенияVaccina (15 Январь 2014 - 04:24) писал:

Кстати на счет каталога, тут все же можно намного проще сделать, изменить уже имеющийся, просто для <a> задать стили примерно следующие:

.nav > li > .parent:nth-child(1){
background: url(ссылка на иконку) no-repeat left top;
text-indent: 9999px; //прячем текст
width:40px; // ширина кнопки
height:40px; // высота кнопки
display:block;
}
.nav > li > .parent:nth-child(2){
background: url(ссылка на 2ую иконку) no-repeat left top;
text-indent: 9999px; //прячем текст
width:40px; // ширина кнопки
height:40px; // высота кнопки
display:block;
}
................. и т.д.
Здравствуйте, пробую сделать так как вы написали выше, у меня пчему то показывает но только лишь 1 картинку из 3х. Что не так? SL-281747

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

  • search.png


#11 Vaccina

Vaccina

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

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

Отправлено 01 Апрель 2014 - 04:08

у вас немного не срабатывает из-за отсутствия вложенности в li, попробуйте использовать подобный селектор:
.nav>li:nth-child(1)>.parent{
background: url(ссылка на иконку) no-repeat left top;
text-indent: 9999px; //прячем текст
width:40px; // ширина кнопки
height:40px; // высота кнопки
display:block;
}
.nav>li:nth-child(2)>.parent{
background: url(ссылка на 2ую иконку) no-repeat left top;
text-indent: 9999px; //прячем текст
width:40px; // ширина кнопки
height:40px; // высота кнопки
display:block;
}
................. и т.д.


#12 luzikov

luzikov

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

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

Отправлено 01 Апрель 2014 - 10:54

Просмотр сообщенияVaccina (01 Апрель 2014 - 04:08) писал:

у вас немного не срабатывает из-за отсутствия вложенности в li, попробуйте использовать подобный селектор:
.nav>li:nth-child(1)>.parent{
background: url(ссылка на иконку) no-repeat left top;
text-indent: 9999px; //прячем текст
width:40px; // ширина кнопки
height:40px; // высота кнопки
display:block;
}
.nav>li:nth-child(2)>.parent{
background: url(ссылка на 2ую иконку) no-repeat left top;
text-indent: 9999px; //прячем текст
width:40px; // ширина кнопки
height:40px; // высота кнопки
display:block;
}
................. и т.д.
спасибо)

#13 ConstantinRS

ConstantinRS

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

  • Пользователи
  • PipPipPip
  • 110 сообщений
  • ГородЧелябинск

Отправлено 09 Апрель 2014 - 13:35

Просмотр сообщенияluzikov (01 Апрель 2014 - 10:54) писал:

спасибо)
А адресом сайта-то не хотите поделиться, чтобы мы могли посмотреть, что получилось? )

#14 luzikov

luzikov

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

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

Отправлено 09 Апрель 2014 - 14:13

Просмотр сообщенияConstantinRS (09 Апрель 2014 - 13:35) писал:

А адресом сайта-то не хотите поделиться, чтобы мы могли посмотреть, что получилось? )
Передумал создавать на том сайте такое меню)





Темы с аналогичным тегами изменение стиля, изменение шаб, лона вечность, расположение элементов

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

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