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


Главная Страница


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

#1 Brendi

Brendi

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

  • Пользователи
  • PipPipPipPip
  • 719 сообщений
  • ГородНорильск

Отправлено 23 Июнь 2013 - 16:45

Здравствуйте, помогите пожалуйста разобраться с главной страницей:

1. Хочу убрать слово МобиФан.
2. Поменять цвет, размер и выделить жирным аську и контакты.
3. Как в этом поле написать текст?
4. Как сделать чтобы все было ровно, знаю что из-за разного разрешения снимков товара, но может быть можно как-то сделать чтобы они сами сжимались до примерно одинаковых размеров, или что-то вроде того?

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

#2 shnafix

shnafix

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

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

Отправлено 23 Июнь 2013 - 17:34

Просмотр сообщенияBrend7111 (23 Июнь 2013 - 16:45) писал:

Здравствуйте, помогите пожалуйста разобраться с главной страницей:

1. Хочу убрать слово МобиФан.
2. Поменять цвет, размер и выделить жирным аську и контакты.
3. Как в этом поле написать текст?
4. Как сделать чтобы все было ровно, знаю что из-за разного разрешения снимков товара, но может быть можно как-то сделать чтобы они сами сжимались до примерно одинаковых размеров, или что-то вроде того?

Прикрепленный файл Безымянный.png
укажите, пожалуйста, номер вашего аккаунта.

#3 Brendi

Brendi

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

  • Пользователи
  • PipPipPipPip
  • 719 сообщений
  • ГородНорильск

Отправлено 23 Июнь 2013 - 19:00

SL-212415

#4 shnafix

shnafix

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

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

Отправлено 23 Июнь 2013 - 20:36

Просмотр сообщенияBrend7111 (23 Июнь 2013 - 16:45) писал:

Здравствуйте, помогите пожалуйста разобраться с главной страницей:

1. Хочу убрать слово МобиФан.
2. Поменять цвет, размер и выделить жирным аську и контакты.
3. Как в этом поле написать текст?
4. Как сделать чтобы все было ровно, знаю что из-за разного разрешения снимков товара, но может быть можно как-то сделать чтобы они сами сжимались до примерно одинаковых размеров, или что-то вроде того?

Прикрепленный файл Безымянный.png
1. Чтобы просто убрать слово Мобифан, найдите блок в редакторе шаблонов->html, который начинается так
<h1 title="МобиФан">
и удалите там это слово.
2. В main.css найдите строку
.phone{font-size:17px; /*размер шрифта*/
color:red; /*ваш цвет*/ }
и добавьте там параметр font-weight: bold; как указано ниже
.phone{font-size:17px; /*размер шрифта*/
color:red; /*ваш цвет*/ ;font-weight: bold;}
C ICQ аналогично строки
.v-middle,
.valignMiddle { vertical-align:middle !important;}
на
.v-middle,
.valignMiddle { vertical-align:middle !important; font-weight: bold;}
чтобы изменить размер изменить параметр font-size, чтобы изменить цвет добавьте параметр color: цвет .
3. Укажите, пожалуйста, в каком конкретно поле?
4. Покажите на примере. чтобы мы правильно вас поняли.

#5 Brendi

Brendi

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

  • Пользователи
  • PipPipPipPip
  • 719 сообщений
  • ГородНорильск

Отправлено 24 Июнь 2013 - 15:56

Спасибо за ответы, по поводу 3 и 4.

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

3. Вот где синие полосы хочу вставить текст.
4. Что бы красная линия была прямая.

#6 support 2.0

support 2.0

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

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

Отправлено 24 Июнь 2013 - 18:01

Просмотр сообщенияBrend7111 (24 Июнь 2013 - 15:56) писал:

Спасибо за ответы, по поводу 3 и 4.

Прикрепленный файл Безымянный.png

3. Вот где синие полосы хочу вставить текст.
4. Что бы красная линия была прямая.

3. Это адаптивный шаблон, поэтому при разном разрешении экрана он будет выглядеть по-разному. Если там поставить текст, то при небольшом разрешении экрана поиск может переместиться на этот текст (можете сами попробовать уменьшить окно браузера)
Можно на то место картинку какую-нибудь поставить (шапка сайта) и тогда в случае, если поиск окажется там, визуально это будет выглядеть хорошо.
4. Вам нужно, чтобы все изображения были одной высоты, либо можно попробовать следующее:
найдите в html строчку
  <div style="width: 100%;position: relative;height: 100%;overflow:hidden;">
замените на
  <div style="width: 100%;position: relative;height: 198px;overflow:hidden;">


#7 sigaviva

sigaviva

    Пользователь

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

Отправлено 17 Июль 2013 - 16:39

как переместить текст на главной странице снизу на верх между товарами и меню каталога

Siga Viva  SL-220025

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

  • printscrin7.jpg
  • printscrin8.jpg


#8 Taisia

Taisia

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

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

Отправлено 17 Июль 2013 - 19:54

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

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

<div class="mycont">
	  
		<ul class="mycarousel">

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



<div class="mycont">
		{% IF index_page %}
	   
		<!-- /Главная страница -->
	   
		{BODY}
	  {% ENDIF %}
	 
		<ul class="mycarousel">

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

{% ENDIF %}
	  
		<!-- /Главная страница -->
	   
		{BODY}

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

{% ENDIF %}
		{% IFNOT index_page %}
		<!-- /Главная страница -->
	   
		{BODY}
{% ENDIF %}


#9 sigaviva

sigaviva

    Пользователь

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

Отправлено 18 Июль 2013 - 15:58

Спасибо!!!!

#10 Гость_Наталья C._*

Гость_Наталья C._*
  • Гости

Отправлено 06 Сентябрь 2013 - 15:24

Просмотр сообщенияshnafix (23 Июнь 2013 - 20:36) писал:

1. Чтобы просто убрать слово Мобифан, найдите блок в редакторе шаблонов->html, который начинается так
<h1 title="МобиФан">
и удалите там это слово.
2. В main.css найдите строку
.phone{font-size:17px; /*размер шрифта*/
color:red; /*ваш цвет*/ }
и добавьте там параметр font-weight: bold; как указано ниже
.phone{font-size:17px; /*размер шрифта*/
color:red; /*ваш цвет*/ ;font-weight: bold;}
C ICQ аналогично строки
.v-middle,
.valignMiddle { vertical-align:middle !important;}
на
.v-middle,
.valignMiddle { vertical-align:middle !important; font-weight: bold;}
чтобы изменить размер изменить параметр font-size, чтобы изменить цвет добавьте параметр color: цвет .
3. Укажите, пожалуйста, в каком конкретно поле?
4. Покажите на примере. чтобы мы правильно вас поняли.

Подскажите, а как мне убрать название магазина из кода <header role="banner">
      <div class="hgroup">
        <h1 title="{SETTINGS_STORE_NAME}"><a  href="http://{NET_DOMAIN}/" title="{SETTINGS_STORE_NAME}"><img src="{ASSETS_IMAGES_PATH}logo.png" alt="{SETTINGS_STORE_NAME}" /><br />{SETTINGS_STORE_NAME}</a></h1>

на ноутбуке его нет, но если с телефона открывать сайт, то кусок его все же появляется.

2) И еще нужно чуть покрупнее телефон сделать. Не смогла найти строчку .phone{font-size:17px;/*размер шрифта*/

#11 Taisia

Taisia

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

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

Отправлено 06 Сентябрь 2013 - 16:55

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

151952



#12 Гость_Наталья C._*

Гость_Наталья C._*
  • Гости

Отправлено 06 Сентябрь 2013 - 17:02

Просмотр сообщенияTaisia (06 Сентябрь 2013 - 16:55) писал:

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

151952


Ой, простите, забыла указать ((
SL-232611

#13 Taisia

Taisia

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

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

Отправлено 06 Сентябрь 2013 - 18:06

в строке


  <h1 title="{SETTINGS_STORE_NAME}"><a  href="http://{NET_DOMAIN}/" title="{SETTINGS_STORE_NAME}"><img src="{ASSETS_IMAGES_PATH}logo.png" alt="{SETTINGS_STORE_NAME}" /><br />{SETTINGS_STORE_NAME}</a></h1>


удалите выделенное жирным шрифтом

Что бы увеличить телефон в конец файла Style.css добавьте код

.phone {
	font-size: 25px;
}


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

#14 Гость_Наталья C._*

Гость_Наталья C._*
  • Гости

Отправлено 23 Сентябрь 2013 - 10:53

Добрый день! Подскажите, где я могу отредактировать фразу "Поиск по магазину.."?
SL-232611

#15 Koderhan

Koderhan

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

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

Отправлено 23 Сентябрь 2013 - 11:04

Просмотр сообщенияНаталья C. (23 Сентябрь 2013 - 10:53) писал:

Добрый день! Подскажите, где я могу отредактировать фразу "Поиск по магазину.."?
SL-232611
Эту фразу вы можете отредактировать в файле "HTML".
Код:
<input class="search" name="q" type="search" value="Поиск по магазину..." onfocus="if(this.value=='Поиск по магазину...'){this.value='';}" onblur="if(this.value==''){this.value='Поиск по магазину...';}">


#16 Гость_Наталья C._*

Гость_Наталья C._*
  • Гости

Отправлено 24 Сентябрь 2013 - 21:07

Добрый вечер!
Подскажите, как можно "превратить" мое черное поле с каталогом в широкое поле, разделенное на 3 части (у меня 3 категории в каталоге).
Причем при наведении на категорию цвет картинки должен меняться и появляться выступающий маленький прямоугольник (скриншот приложила). Сайт-образец

То есть область с каталогом должна быть у меня внизу страницы и каждый из 3-х прямоугольников будет ссылаться на определенное место на главной странице.

Мне нужно подготовить 3 картинки или 6 (чтобы 3 категории при наведении меняли цвет)?

И важно: эта область с каталогом должна быть только на главной странице.

Надеюсь, понятно написала )))

Заранее спасибо!
Аккаунт SL-232611

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

  • каталог внизу на странице.png


#17 Vaccina

Vaccina

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

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

Отправлено 25 Сентябрь 2013 - 02:13

Для начала вам необходимо реализовать визуальную составляющую. Для этого можно сделать следующее - в шаблоне "HTML" перед строкой

<footer>

вставьте

{% IF index_page %}
<nav id="bottomNav">
<div class="container">
  <div class="row">
   <div class="span4 active">
	<a class="a-title section-1" href="#section-1">section 1</a>
   </div>
   <div class="span4">
	<a class="a-title section-2" href="#section-2">section 2</a>
   </div>
   <div class="span4">
	<a class="a-title section-3" href="#section-3">section 3</a>
   </div>
  </div>
	</div>
	<div id="navArrow"></div>
</nav>
{% ENDIF %}

далее необходимо добавить код в файл стилей style.css

#bottomNav {
	background: #0EA5A0;
	border-top: 1px solid #098581;
	bottom: 0;
	box-shadow: -5px 0 15px 0 rgba(0, 0, 0, .3);
	height: 91px;
	left: 0;
	position: fixed;
	width: 100%;
	z-index: 10;
}
#navArrow {
	background: url("{ASSETS_IMAGES_PATH}arrow.png") no-repeat center center;
	bottom: 91px;
	height: 16px;
	left: 0;
	position: fixed;
	width: 64px;
	z-index: 2;
}
#bottomNav .span4:hover,
#bottomNav .span4:focus,
#bottomNav .span4.active {
	background-color: #1BBEB9;
}
#bottomNav .span4:first-child {
	background: none;
}
#bottomNav .span4 {
	background: url("{ASSETS_IMAGES_PATH}divider.png") no-repeat left center;
	margin-left: 0;
	padding-left: 18px;
}
#bottomNav .a-title.projection {
	background: url("{ASSETS_IMAGES_PATH}section-1.png") no-repeat 40px 60%;
}
#bottomNav .a-title {
	display: block;
	font: 18px/24px 'PTSansRegular',sans-serif;
	padding: 24px 15px 18px 95px;
	text-transform: uppercase;
	width: auto;
}
.a-title {
	color: #FFFFFF;
	display: inline-block;
	font: 18px/22px 'PTSansBold',sans-serif;
}
#bottomNav .row:before,
#bottomNav .row:after {
	content: "";
	display: table;
	line-height: 0;
}
#bottomNav .row:after {
	clear: both;
}
#bottomNav .row:before,
#bottomNav .row:after {
	content: "";
	display: table;
	line-height: 0;
}
#bottomNav .row {
	margin-left: -18px;
}
#bottomNav .span4 {
	width: 314px;
}
#bottomNav [class*="span"] {
	float: left;
	margin-left: 18px;
	min-height: 1px;
}

Далее необходимо загрузить изображения в раздел редактора тем. Изображение "arrow.png" это стрелка, изображение "divider.png" это разделитель блоков, изображение "section-1.png" это изображение первого блока.

#18 Гость_Наталья C._*

Гость_Наталья C._*
  • Гости

Отправлено 25 Сентябрь 2013 - 12:14

Просмотр сообщенияKoderhan (23 Сентябрь 2013 - 11:04) писал:

Эту фразу вы можете отредактировать в файле "HTML".
Код:
<input class="search" name="q" type="search" value="Поиск по магазину..." onfocus="if(this.value=='Поиск по магазину...'){this.value='';}" onblur="if(this.value==''){this.value='Поиск по магазину...';}">

Добрый день!
Как сделать так, чтобы при нажатии в ячейку поиска слово "поиск..." исчезало бы?
А то сейчас получается ввод фразы вместе с этим словом. Спасибо

#19 Koderhan

Koderhan

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

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

Отправлено 25 Сентябрь 2013 - 12:27

Просмотр сообщенияНаталья C. (25 Сентябрь 2013 - 12:14) писал:

Добрый день!
Как сделать так, чтобы при нажатии в ячейку поиска слово "поиск..." исчезало бы?
А то сейчас получается ввод фразы вместе с этим словом. Спасибо
При изменение атрибута value нужно изменить фразу и в дрругиз местах. Пример:
<input class="search" name="q" type="search" value="Поиск..." onfocus="if(this.value=='Поиск...'){this.value='';}" onblur="if(this.value==''){this.value='Поиск...';}">


#20 Гость_Наталья C._*

Гость_Наталья C._*
  • Гости

Отправлено 26 Сентябрь 2013 - 14:05

Просмотр сообщенияVaccina (25 Сентябрь 2013 - 02:13) писал:

Для начала вам необходимо реализовать визуальную составляющую. Для этого можно сделать следующее - в шаблоне "HTML" перед строкой

<footer>

вставьте

{% IF index_page %}
<nav id="bottomNav">
<div class="container">
<div class="row">
<div class="span4 active">
<a class="a-title section-1" href="#section-1">section 1</a>
</div>
<div class="span4">
<a class="a-title section-2" href="#section-2">section 2</a>
</div>
<div class="span4">
<a class="a-title section-3" href="#section-3">section 3</a>
</div>
</div>
</div>
<div id="navArrow"></div>
</nav>
{% ENDIF %}

далее необходимо добавить код в файл стилей style.css

#bottomNav {
background: #0EA5A0;
border-top: 1px solid #098581;
bottom: 0;
box-shadow: -5px 0 15px 0 rgba(0, 0, 0, .3);
height: 91px;
left: 0;
position: fixed;
width: 100%;
z-index: 10;
}
#navArrow {
background: url("{ASSETS_IMAGES_PATH}arrow.png") no-repeat center center;
bottom: 91px;
height: 16px;
left: 0;
position: fixed;
width: 64px;
z-index: 2;
}
#bottomNav .span4:hover,
#bottomNav .span4:focus,
#bottomNav .span4.active {
background-color: #1BBEB9;
}
#bottomNav .span4:first-child {
background: none;
}
#bottomNav .span4 {
background: url("{ASSETS_IMAGES_PATH}divider.png") no-repeat left center;
margin-left: 0;
padding-left: 18px;
}
#bottomNav .a-title.projection {
background: url("{ASSETS_IMAGES_PATH}section-1.png") no-repeat 40px 60%;
}
#bottomNav .a-title {
display: block;
font: 18px/24px 'PTSansRegular',sans-serif;
padding: 24px 15px 18px 95px;
text-transform: uppercase;
width: auto;
}
.a-title {
color: #FFFFFF;
display: inline-block;
font: 18px/22px 'PTSansBold',sans-serif;
}
#bottomNav .row:before,
#bottomNav .row:after {
content: "";
display: table;
line-height: 0;
}
#bottomNav .row:after {
clear: both;
}
#bottomNav .row:before,
#bottomNav .row:after {
content: "";
display: table;
line-height: 0;
}
#bottomNav .row {
margin-left: -18px;
}
#bottomNav .span4 {
width: 314px;
}
#bottomNav [class*="span"] {
float: left;
margin-left: 18px;
min-height: 1px;
}

Далее необходимо загрузить изображения в раздел редактора тем. Изображение "arrow.png" это стрелка, изображение "divider.png" это разделитель блоков, изображение "section-1.png" это изображение первого блока.

Спасибо за столь подробную инструкцию.
Коды вставила, первое изображение section-1 загрузила в файлы, но оно не отображается.
Подскажите, в чем может быть причина? И каким размером в пикселях делать изображения?
Я нашла в коде цифру 91 пиксель в высоту. А вот про ширину ничего не нашла. Поможете?

Заранее спасибо!




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

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