Customize confirmation page в Gravity Forms

В последно време работим върху проект на WordPress, в който имаме няколко вида форми за попълване на различни по вид данни. Проекта представлява брокерски сайт за недвижими имоти и една от формите в него е стъпкова, в която се избира дали ще купуваш или продаваш имот.

За създаването на формата използвахме Gravity Forms, който е страхотен плъгин и върши много неща лесно, бързо и удобно. Но за него ще говорим друг път.

Във една от формите в проекта в  първа стъпка се избира една от две опции(buy/sell) в drop-down меню и според направеният избор, формата се разклонява в две посоки: съответно в buying или selling път.

При успешно попълване на формите се стига до две различни Confirmation страници – съответно за buying и за selling. Тук обаче възникна нашият проблем. Плъгинът дава възможност за избор на три вида Confirmation Message: дали ще се използва redirect към друга страница, text, който може да бъде стилизиран според предпочитанията и изискванията или нова страница с параметри в URL адреса ѝ. Плъгинът дава изключително много възможности, но за съжаление не предлага различни типове Confirmation Message за отделните пътища – т.е. няма възможност да се избере отделен confirm за различните пътища на формата. А в нашият случай ни трябваха два различни изгледа на confirm съобщението според избраният път.

Тук ще се опитам да опиша с прости думи как Марио Пешев реши проблема . Правим копие на цялата страница или на мястото, където ще се визуализират резултатите от успешно преминалото попълване на формите и след направата на проверка кой път е избран визуализираме потвърждението за успешно попълване на формата във вида, в който ни трябва. След попълването на формата, тя препраща потребителят към това копие на страница, което отговаря на избраната опция в първа стъпка на формата(buying or selling) с помощта на параметри, с които формата допълва URL адреса на страница. С проверка дали има параметри в URL-а и ако да какви се избира коя страница да се визуализира. В нашият случай текстът за потвърждение е един и същ, но имаме различни картинки, buying image 4/4 или selling image 5/5, отговарящи на един от двата вида пътя.

Ето какво се попълва във редактора на формата:

След попълване на формата  URL адреса се получават следните параметри:


some_url/confirm-form?buy_or_sell=BUYING

или


some_url/confirm-form?buy_or_sell=SELLING

а кодът трябва да бъде нещо подобно на това:

<?php $quoted_page = get_page_by_path( 'selling-buying' ); ?>
<?php if( $quoted_page ): ?>
	<?php
	if( isset( $_GET['buy_or_sell'] ) ) {
		$image_src = "";
		$form_comer = $_GET['buy_or_sell'];
		if( $form_comer == 'BUYING...' ) {
			$image_src = "path_to_img";
		} else if( $form_comer == 'SELLING...' ) {
			$image_src = "path_to_img";
		} else {
			wp_die(); exit;
		}
	}
	?>

<img id="confirm_image" src="<?php echo $image_src?>"></img>

<?php endif; ?>

С това решение успяхме да се справим с възникналият проблем пред нас и мисля, че се получи добре.

Още веднъж искам да спомена, че плъгинът е страхотен и предлага много опции пред потребителят, но трябва да се вземе в предвид, че дизайнът на сайта трябва да бъде съобразен с Gravity Forms и неговите особености.

 

0 thoughts on “Customize confirmation page в Gravity Forms

  1. Марио Пешев

    Добре си описал кейса. Трябва да направиш още 2-3 поста за възможностите на Gravity и колко е важно да не се опитва човек да прави извънземен дизайн, за да не свърши с 700 реда custom CSS и 200 custom JS по тази причина 🙂

    Reply
  2. metodiew Post author

    Да, определено има възможност за няколко поста с описание на Gravity Forms-а, защото е доста мощен плъгин.

    А това с дизайните за уеб е доста болна тема, която ти изпита на гърба си доста сериозно в последно време. 😀

    Reply

Leave a Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.