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


Вопросы =?=


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

#41 sibulba

sibulba

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

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

Отправлено 14 Март 2014 - 23:38

.

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

  • Untitled-2.png


#42 sibulba

sibulba

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

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

Отправлено 16 Март 2014 - 23:15

ап

#43 Alexey11

Alexey11

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

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

Отправлено 17 Март 2014 - 08:19

Если выставлять так блоки с текстом, то только абсолютным позиционированием.
То-есть сначала вставляем картинку в данный блок, потом пишем все тексты и позиционируем их по пикселям относительно цифр.

Для начала установите данную картинку. для этого найдите данный блок кода:

{% IF index_page %}
<div id="secondblock">
<div class="container" id="secondblock_page">
<p id="secondblock_text">Как мы работаем:</p>
</div>
</div>
{% ENDIF %}

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


{% IF index_page %}
<div id="secondblock">
<div class="container" id="secondblock_page">
<p id="secondblock_text">Как мы работаем:</p>


<img src="{ASSETS_IMAGES_PATH}hww_article.png?9413" width="600" style="
display: block;
margin: 0 auto;
">

</div>
</div>
{% ENDIF %}



#44 sibulba

sibulba

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

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

Отправлено 20 Март 2014 - 23:14

.

#45 Vaccina

Vaccina

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

  • Модераторы
  • 23 788 сообщений

Отправлено 21 Март 2014 - 03:54

у вас кнопки с цифрами вставлены одной картинкой, для начала необходимо увеличить блок у нее:
#secondblock_page {
	height: 100px;
	width: 940px;
}
замените на:
#secondblock_page {
	height: 120px;
	width: 940px;
}
далее увеличим общее поле для текста:
#secondblock {
	background-color: #0099CC;
	height: 120px;
	width: auto;
}
замените на:
#secondblock {
	background-color: #0099CC;
	height: 160px;
	width: auto;
}
далее в HTML после:
<div id="secondblock_page" class="container">
		<img width="950" style="display: block; padding-top: 10px; margin: 0 auto;" src="hww_article.png">
</div>
вставьте:
<div class="secondblock_page_txt">
<span>Выбираете товар</span>
<span>Оставляете заказ</span>
<span>Менеджер подтверждает заказ</span>
<span>Доставка заказа</span>
</div>
далее пишем стили для него:
.secondblock_page_txt {
	margin: 0 auto;
	width: 950px;	  /* Размер должен быть равен размеру картинки */
}
.secondblock_page_txt span {
	color: #FFFFFF;
	display: inline-block;
	height: 35px;
	overflow: hidden;
	padding: 0 20px;
	text-align: center;
	width: 150px;
}


#46 sibulba

sibulba

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

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

Отправлено 21 Март 2014 - 10:16

.

#47 sibulba

sibulba

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

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

Отправлено 21 Март 2014 - 22:19

.

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

  • Untitled-3.png


#48 Сake

Сake

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

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

Отправлено 22 Март 2014 - 00:20

Из вашего текста сообщения не совсем понятно что именно у вас не получатся. Стилизация или функционирование формы? Сама по себе форма реализуется по типу обратного звонка http://forum.storela..._60#entry100503

#49 sibulba

sibulba

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

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

Отправлено 22 Март 2014 - 09:17

.

#50 sibulba

sibulba

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

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

Отправлено 24 Март 2014 - 20:27

Ап

#51 Сake

Сake

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

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

Отправлено 25 Март 2014 - 04:05

Цитата

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

Email адрес является обязательным и изменить его на номер телефона не получиться, так как на сервере происходит проверка данного поля. В данном случае можно просто скрыть поле задав ему стиль display:none или атрибут type="text" заменить на type="hidden", а значение в атрибуте value задать произвольное - корректное. В форме обратной связи (он же образный звонок и т.д) можно добавить дополнительное поле вида

<input id="feedback_phone" type="text"  name="form[phone]"  value="{FORM_PHONE}" maxlength="255" class="required phone input-text"/>

Цитата

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

В данном случае необходим обработчик javascript - события отправки формы. Обработчик может выглядеть следующим образом

$(function() {
  $('.callback').submit(function() {
	$.post($(this).attr('action'), $(this).serializeArray(), function() {
	 $('.callback-success').show();
	});
	return(false);
  });
});

в данном случае callback это класс формы (тега <form class="callback">), а класс callback-success это класс поля сообщения отображаемого после отправки формы (<span class="callback-success" style="display: none;">).

#52 sibulba

sibulba

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

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

Отправлено 25 Март 2014 - 10:19

.

#53 Сake

Сake

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

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

Отправлено 26 Март 2014 - 00:37

В вашем шаблоне "HTML" код формы выглядит следующим образом

<form method="post" action="{FEEDBACK_URL}" class="feedbackForm" enctype="multipart/form-data">
				{% IFNOT FORM_SEND_OK %}
				  <div class="fieldset">
								<input type="hidden" name="hash" value="{HASH}" />
								<input type="hidden" name="form[{ANTISPAM_FORM_FIELD_NAME_FEEDBACK_MESSAGE}]" value="Подписка" />
								<span class="insert-antispam"></span>
								<ul class="form-list">
								  <li class="fields">
									<div class="customer-name">
									  <div class="field name-firstname">
										<div class="input-box">
										  <input type="text" id="feedback_name" name="form[{ANTISPAM_FORM_FIELD_NAME_FEEDBACK_NAME}]" value="{FORM_FEEDBACK_NAME}" maxlength="50" class="light required" placeholder="Ваше Имя" />
										</div>
									  <div class="field name-lastname">
										<div class="input-box">
										  <input type="text" id="feedback_email" name="form[{ANTISPAM_FORM_FIELD_NAME_FEEDBACK_EMAIL}]" value="{FORM_FEEDBACK_EMAIL}" maxlength="255" class="required email light" placeholder="Ваш e-mail" />
										</div>
									  <div class="field name-lastname">
										 <div class="input-box">
										  <input id="feedback_phone" type="text" name="form[phone]" value="{FORM_PHONE}" maxlength="255" class="required phone input-text" placeholder="Ваш телефон" />																</div>
										 </div>
									  </div>
								  </li>
								</ul>
				  </div>
				{% ENDIF %}
				<div class="buttons-set">
				  <input type="submit" title="Сделать заказ" class="exclusive" value="СДЕЛАТЬ ЗАКАЗ" />
				  </p>
				</div>
  </form>

вам необходимо заменить данный код формы на код

<form method="post" action="{FEEDBACK_URL}" class="feedbackForm callback" enctype="multipart/form-data">
	<div class="callback-success" style="display: none;"></div>
	<div class="fieldset">
  <input type="hidden" name="form[{ANTISPAM_FORM_FIELD_NAME_FEEDBACK_EMAIL}]" value="null@null.nl" />
		<input type="hidden" name="hash" value="{HASH}" />
		<input type="hidden" name="form[{ANTISPAM_FORM_FIELD_NAME_FEEDBACK_MESSAGE}]" value="Подписка" />
		<span class="insert-antispam"></span>
		<ul class="form-list">
			<li class="fields">
				<div class="field name-firstname">
					<div class="input-box">
						<input type="text" id="feedback_name" name="form[{ANTISPAM_FORM_FIELD_NAME_FEEDBACK_NAME}]" value="{FORM_FEEDBACK_NAME}" maxlength="50" class="light required" placeholder="Ваше Имя" />
					</div>
	</div>
				<div class="field name-lastname">
					<div class="input-box">
						<input id="feedback_phone" type="text" name="form[phone]" value="{FORM_PHONE}" maxlength="255" class="required phone input-text" placeholder="Ваш телефон" />															   
	 </div>
				</div>
			</li>
		</ul>
	</div>
	<div class="buttons-set">
		<input type="submit" title="Сделать заказ" class="exclusive" value="СДЕЛАТЬ ЗАКАЗ" />		   
	</div>
</form>

После замены кода можно будет уже добавить необходимые стили и код javascript.

#54 sibulba

sibulba

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

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

Отправлено 26 Март 2014 - 09:31

.

#55 Alexey11

Alexey11

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

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

Отправлено 26 Март 2014 - 13:35

Просмотр сообщенияsibulba (26 Март 2014 - 09:31) писал:

и еще
подскажите в какие блоки нужно прописывать стили? форма большая не могу разобраться

Чтобы быстро найти стили, которые нужно изменить можно воспользоваться "Просмотром кода элемента" браузера Crome:

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

  • xczzzzasd.png


#56 Wader

Wader

    Новичок

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

Отправлено 26 Март 2014 - 16:44

Всем привет. Хочу непного видоизменить изображения header_page.png и header_page_without_logo.png (находятся в сайт - редактирование шаблонов - изображения). Подскажите как это правильно сделать. =)

#57 Alexey11

Alexey11

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

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

Отправлено 26 Март 2014 - 16:46

Просмотр сообщенияWader (26 Март 2014 - 16:44) писал:

Всем привет. Хочу непного видоизменить изображения header_page.png и header_page_without_logo.png (находятся в сайт - редактирование шаблонов - изображения). Подскажите как это правильно сделать. =)
Для этого вам нужно скачать их к себе на компьютер, далее изменить их в любом графическом редакторе на ваше усмотрение. Далее Загрузить эти картинки к себе на сайт с теми-же названиями,а старые удалить.

#58 sibulba

sibulba

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

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

Отправлено 27 Март 2014 - 01:04

.

#59 Сake

Сake

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

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

Отправлено 27 Март 2014 - 01:58

Просмотр сообщенияsibulba (26 Март 2014 - 09:31) писал:

правки внес. все равно не отправляется)
что нужно поправить в main js ?

Найдите в вашем файле main.js следующий код

$(function() {
  if($('.insert-antispam').length) {
				 $.get('/feedback', function(html) {
				   $(html).find('#inject-antispam').children().appendTo($('.insert-antispam'));
				 });
  }
$('.exclusive.submit-form').click(function(){
   var form = $(this).closest('form');
   $.post(form.attr('action'), form.serializeArray(), function() {
								 $('.submit-form').html('<h5 class="msg">Спасибо за заказ!</h5>');
				});
				return(false);
});
});

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

$(function() {
  if($('.insert-antispam').length) {
		$.get('/feedback', function(html) {
				$(html).find('#inject-antispam').children().appendTo($('.insert-antispam'));
				$('#feedback_name').attr('name', $(html).find('#feedback_name').attr('name'));
				$('#feedback_email').attr('name', $(html).find('#feedback_email').attr('name'));
				$('#feedback_message').attr('name', $(html).find('#feedback_message').attr('name'));
				var hidden = /ElementById\("(.*)"\).*ibute\(.*, "(.*)"\)/.exec(html);
				$('#'+hidden[1]).val(hidden[2]);
		});
  }
$('.exclusive.submit-form').click(function(){
   var form = $(this).closest('form');
   $.post(form.attr('action'), form.serializeArray(), function() {
								 $('.submit-form').html('<h5 class="msg">Спасибо за заказ!</h5>');
				});
				return(false);
});
});


#60 sibulba

sibulba

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

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

Отправлено 27 Март 2014 - 18:20

супер работает. сообщение приходит как нужно НО при нажатии на кнопку происходит перекидывание на страницу feedback
как этого избежать и оставить клиента на главной странице?

за что отвечает эта строка?
    <div class="callback-success" style="display: none;"></div>




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

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