Вставить контактную форму в jquery.prettyPhoto.js
 

Всем привет!
Хотел вставить контактную форму в файл js, сама форма вставляется кодом - <?php echo do_shortcode('[contact-form-7 id="2" title="cf"]'); ?>
Когда вставляешь код, перестает работать плагин, который открывает лайтбокс. Подскажите пожалуйста как правильно вставлять php код в js файл?

Вот кусок кода куда нужно вставить форму

'<div class="pp_pic_holder"> <div class="ppt">&nbsp;</div> <div class="pp_content_container"> <a class="pp_close" href="#">CloseprettyPhoto</a> <div class="pp_content"> <div class="pp_loaderIcon"></div> <div class="pp_fade"> <a href="#" class="pp_expand" title="Expand the image">Expand</a> <div class="pp_hoverContainer"> <a class="pp_next" href="#">next</a> <a class="pp_previous" href="#">previous</a> </div> <div id="pp_full_res"></div> <div class="pp_details"> <div class="pp_nav"> <a href="#" class="pp_arrow_previous">Previous</a> <p class="currentTextHolder">0/0</p> <a href="#" class="pp_arrow_next">Next</a> </div> <p class="pp_description"></p> </div> </div> </div> </div> </div> <div class="pp_overlay"></div>',gallery_markup:'<div class="pp_gallery"> 								<a href="#" class="pp_arrow_previous">Previous</a> 								<div> 									<ul> 										{gallery} 									</ul> 								</div> 								<a href="#" class="pp_arrow_next">Next</a> 							</div>'

Проверить что возвращает функция do_shortcode, то есть итоговый код приведенный после вставки. Возможно что кавычки не экранируются.

PS. Сразу, чтобы не томить - вы собираетесь изменить непосредственно код плагина, пусть все удачно вставлено, с чего вы решили что ваша форма будет удачно отображена в слайдере?.
В слайдер можно вставлять любой контент, но через iframe или div, которые описываются все теми же ссылками как и фото, код плагина для этого изменять не требуется. В документации же есть описание.

не получается посмотреть, т.к. не включается плагин, при нажатии на кнопку

Да я и ждать не стал, написал постскриптум.

вставить то можно, только я хотел сделать каталог товаров и каждый раз вставлять контактную форму как то не особо, а так бы она была там по дефолду
и еще один момент, таким же методом я вставил еще в хедер кнопку - Оставить заявку, когда нажимаешь, всплывает окно, там форма, когда нажимаешь на кнопку отправки, перезагружается страница, когда опять нажимаешь на - Оставить заявку видно, что сообщение отправлено
Как можно сделать, что бы страница не перезагружалась при нажатии на отправку?
ну и первый вопрос тоже актуален

Простой вставкой формы в код плагина не обойтись, не будет она работать, собственно сам плагин и не работает уже, конечно, с учетом того, что вставлено корректно. С учетом того, что плагин может загружать любой контент, что мешает в этот контент помещать фото товара с формой?

Чтобы не перегружалась страница - Ajax.

Хотел сразу делать, что бы руками вставлять в контент и товар и форму связи, но, какая то интересная тема у меня попалась, ну или же "косяк" Visual Composer'а скорее всего, когда вставляешь шорт код формы, он и отображается шоркодом, а не форму грузит, потому и решил вставить напрямую шорткод формы в плагин.

А что имели ввиду под ajax'ом? как реализовать не подскажите?

Даже не представляю себе как это будет выглядеть в контексте каталога товаров, не утомительно будет?
Есть скрипты, есть шаблонизаторы различные, собственно и свой легкий сугубо под эту задачу написать несложно, это их забота, руками то чего?
Останется по запросу клиента отдать контент - картинку запрашиваемого товара, форму, и исполнить песню по заявке, если надо, согласно переменных в шаблоне.
Есть ведь слайдеры куда более серьезные по сравнению prettyPhoto по части возможностей вывода различного контента да еще и с обратной связью, то бишь сервером.

Ajax

ничего утомительного в этом не вижу, как на меня, то и проще

<a href="#1" rel="prettyPhoto">1</a>
<div id="1" class="hide">
<p>
Text		
</p>
</div>

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

Написать не сложно... - ) не программист я и тяжко мне в этом случае(

А какие есть еще плагины? интересуют такие что бы в лайт боксе открывались и можно было вставить любой контент и желательно что бы вставлялись не шоркодами, а то тема моя не воспримет их

Ну что такое ajax, то я знаю) пришлось столкнутся, а вот как его докрутить в форму, то что то представления даже нет

:)

Товары, это идентификаторы в базе, и картинки их, и их контент, все это связано идентификатором. Форма же одна на всех, но если это форма обратной связи, и пусть она каким-то боком сообщает, что интерес именно по товару А, значит и форму нужно связать с товаром, чтобы при отправке ее сервер знал о чем речь. Или не так?

А если так, то это делается не руками, а как раз серверным языком - отдается контент запрашиваемого слайдером товара, по ID которое передал клиент. Сервер получает данные о товаре из базы, подключает шаблон:

<a href="#d<?=$id?>" rel="prettyPhoto"><?=$name?></a>
<div id="d<?=$id?>" class="hide">
<p><?=$content?></p>
</div>
<?=include 'path/form.php'?>

В файле шаблона формы есть скрытое поле в которое также подставляется $id - идентификатор товара в базе. Когда ковыряются руками, велика вероятность ошибок и конфликтов.

Насчет плагинов - спросить у Гугла, у кого же еще, например здесь посмотреть, и еще много всяких ресурсов со списками на плагины.

Ajax, коли используется JQ, посмотреть тут, там и описание, и примеры есть. Попробуйте, не будет получаться - код в студию, помогут.

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

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

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

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

открыл я страницу с ajax'ом и ничего не понял( куда его вставлять...
вот код формы, это уже после открытия ее в лайтбоксе

<div role="form" class="wpcf7" id="wpcf7-f2155-o1" lang="ru-RU" dir="ltr">
<div class="screen-reader-response"></div>
<form action="/#wpcf7-f2155-o1" method="post" class="wpcf7-form" novalidate="novalidate">
<div style="display: none;">
<input type="hidden" name="_wpcf7" value="2155">
<input type="hidden" name="_wpcf7_version" value="4.3.1">
<input type="hidden" name="_wpcf7_locale" value="ru_RU">
<input type="hidden" name="_wpcf7_unit_tag" value="wpcf7-f2155-o1">
<input type="hidden" name="_wpnonce" value="ffde2afac6">
</div>

<p><span class="wpcf7-form-control-wrap your-name"><input type="text" name="your-name" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" aria-required="true" aria-invalid="false" placeholder="Имя"></span>

<span class="wpcf7-form-control-wrap tel-251"><input type="tel" name="tel-251" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-tel wpcf7-validates-as-required wpcf7-validates-as-tel" aria-required="true" aria-invalid="false" placeholder="Телефон"></span>

<input type="submit" value="Заказать" class="wpcf7-form-control wpcf7-submit"><img class="ajax-loader" src="/ajax-loader.gif" alt="Отправка..." style="visibility: hidden;"></p>

<div class="wpcf7-response-output wpcf7-display-none"></div></form></div>

а в таком виде в хедере вставил

<div class="apptl">
		<a href="#app" rel="prettyPhoto">Оставить заявку</a>
		<div id="app" class="hide">
			<?php echo do_shortcode('[contact-form-7 id="2155" title="cf1_copy"]'); ?>
		</div>
	</div>

Запись в базе да - каждая сущность в базе, это уникальная запись о ней, и кроме этого, с этой записью могут быть связаны другие записи. Именно так и делается, и не важно Пресс у вас или иной движок.

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

То есть по вашему получается так - back-end разработчик пишет там что-то, не важно что, в общем ради любви к программированию, а front-end сам по себе, тоже что-то там кодит в свое удовольствие. А потом все это чудесным образом раз и срослось, так?

К примеру я разрабатываю серверную часть, а значит я с вас как верстальщика сниму три шкуры, если ваши самописки не будут "контачить" с серверной частью так, как это определено приложением. :) Только так и никак иначе. Это с каких пор верстальщик определяет:

<input type="hidden" name="_wpcf7" value="2155">
<input type="hidden" name="_wpcf7_version" value="4.3.1">
.....

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

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


а это

<input type="hidden" name="_wpcf7" value="2155">
<input type="hidden" name="_wpcf7_version" value="4.3.1">

плагин уже сам наставил, я туда не лез)

Именно так, только не лезут для этого в базу, а обращаются к ней посредством тех же скриптов, с тем же самым интерфейсом на html, редактируя данные в базе, или изменяя некие конфигурационные данные.

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

Не файлы меняются, а значения, которые подставляются в шаблоны, ваша задача как верстальщика только "облагородить" его, а какие имена будут у полей формы я могу или сообщить верстальщику, или они тоже будут определяться динамически, все зависит от сервера, он определяет правила, а не верстальщик. А то что в этой форме вам дали определенные данные, это понятно уже по именам полей и их значениям, просто это для пояснения вопроса.

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

А вот шкуру, я имел собственную шкуру верстальщика, а не картинку рисованную. :)

только что пробовал гуглить проблему мою, эта тема уже в топе))))))
на счет представления, как будет работать, прямо в яблочко... тяжко для меня это все, а про шкуру я понял, перевел просто)

так что поможете разобраться с проблемой? а то вроде как получилось решить, но мучатся мне еще и мучатся как мне кажется... (

Как вывести в слайдере формы? Есть в нем два способа для этого, они описаны на сайте разработчика. Или как отправить форму ajax методом?

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

спасибо за поддержку разговора))) и так, на будущее, что по чем? за доделки-переделки? я так понимаю заинтересованность же есть)?



p.s. сделал еще проще, сменил плагин на Easy FancyBox, а там все на много проще организовать