Додаємо шорткод до Contact form 7

за Ніколаєнко Максим · Опубліковано Квітень 15, 2017 · Оновлено Серпень 4, 2019

Ця стаття призначена для розширення знань розробників сайтів. Ми поговоримо про те, як у плагін Contact Form 7 ми можемо додати свій власний шорткод.

Для тих, хто не знає плагіна Contact Form 7

CF7 це відмінний конструктор форм на WordPress, дуже гнучкий і чудово може інтегрувати будь-яку верстку.

Ви напевно знаєте, що поля для цього плагіна формуються на основі шорткодів., але інколи стандартного набору не вистачає і нам необхідно створити свій власний. Шорткод плагіна CF7 дуже схожі на стандартні WordPress, але якщо ви спробуєте створити стандартний, то на даний момент у вас нічого не вийде, так як плагін пускає тільки свої шорткоди.

Приклад створення шорткоду:

Зі своєї недавньої практики я вирішив взяти для вас приклад. Ми спробуємо створити спеціальний код для виведення поточного року та кілька років до цього. Будь-який інший шорткод можна зробити за прикладом нижче.

add_action( 'wpcf7_init', 'custom_add_shortcode_yesr' );
 
function custom_add_shortcode_yesr() {
    wpcf7_add_shortcode( 'selectyear', 'custom_clock_shortcode_handler' );
}
 
function custom_clock_shortcode_handler( $tag ) {
	$res = "<select class='estimate__select' name='year' id='year' required>";
		$currnt_year = date("Y"); ;
		for ($i=1930; $i < $currnt_year+1; $i++) {
			$res .= "<option value='$i' selected='selected'>$i</option>";
		}
	$res .= "</select>";
    return $res; 
}

add_action( 'wpcf7_init', 'custom_add_shortcode_yesr' );

function custom_add_shortcode_yesr() {

wpcf7_add_shortcode( 'selectyear', 'custom_clock_shortcode_handler' );

}

function custom_clock_shortcode_handler( $tag ) {

$res = "<select class='estimate__select' name='year' id='year' required>";

$currnt_year = date("Y"); ;

for ($i=1930; $i < $currnt_year+1; $i++) {

$res .= "<option value='$i' selected='selected'>$i</option>";

}

$res .= "</select>";

return $res;

}

Для перевірки вставте код у файл function.php і спробуйте створити нову форму і додати до неї шорткод [вибрати рік]. Якщо все зроблено правильно, то у вас з'явиться список з вибором року. Думаю ті, хто дійшли до створення свого шорткоду, не потребують роз'яснення всього лістингу, додам лише невелику ремарку з приводу хука та функції wpcf7_add_shortcode().

wpcf7_add_shortcode – це функція для реєстрації типів форм-тегів. Для використання цієї функції вам необхідно використовувати спеціальний хук виклику wpcf7_heat.

Якщо ви бажаєте вибрані дані вставити в лист, то в шорткод для цих даних потрібно вставляти назву атрибута name з поля. У нашому випадку це буде [ рік ].