Введення в шорткод WordPress

Введення в шорткод WordPress

Вітаю! З вами Павло. І перше, що мені хотілося б зробити — це вибачитися за те, що пишу не так часто, як хотілося б. На жаль (а може й ні), останнім часом дуже багато роботи, і писати нові статті просто не встигаю. Але поки WordPress залишається популярним — статті виходитимуть, принаймні раз на тиждень.

Отже, я вирішив опублікувати серію статей, присвячених шорткодам. Тема дуже популярна, і я впевнений, що в кожному блозі про WP знайдеться подібна стаття. Але починати писати більш “просунуті” речі без бази та термінології буде неправильно. Тому цю першу статтю я присвячую основам та простим прикладам. А в наступних ми спробуємо поєднати шорткод із модулем із попередніх тем.

Шорткод (як я його розумію) — це користувацький BB тег, який можна вставити в статтю, сторінку або код сайту, і який буде замінено на потрібну інформацію програмно.

Можливо я неточно формулюю визначення, але бачу це саме так. Нижче я поясню, чому саме.

Приклади шорткодів:
[my-short-code] — “порожній” шорткод
[sh color="red"] — шорткод з параметром
[some_text size="20px" style="bold"]текст шорткоду[/some_text] — шорткод із параметрами та вмістом

В принципі, це всі можливі варіанти.

Ідей для використання безліч. Перше, що спадає на думку — вставка рекламних блоків (але це у наступних статтях). А зараз розглянемо прості приклади з “Hello World”.

Приклад перший. Замість шорткоду маємо виводити привітання на початку кожної статті. З параметром id ми обираємо одне з наперед заданих привітань.

Шорткод: [hello id="x"], де x — номер.

Код додаємо в functions.php теми:

function wp2fl_hello($attr)
{

	$ar = array(
'Привіт, з Вами ...', 
'Доброго дня, з Вами знову ...', 
'Вітаю, на зв'язку...', 
'Радий бачити Вас в черговий раз на своєму сайті...', 
'І знову я...', 
'І т.д. в.п.',
	);

	return isset($ar[$attr['id']]) ? $ar[$attr['id']] : array_shift($ar);
}
add_shortcode('hello', 'wp2fl_hello');

add_shortcode — хук, який додає шорткод. Функція отримує атрибути та (опціонально) контент.

Щоб перевірити, вставляємо [hello id="2"] у текст і дивимось результат.

Приклад другий. Вивід випадкового зображення за допомогою шорткоду [rand-img].

Код:

function wp2fl_rand_img()
{
	$ar = array(
		'/_images/1.jpg',
		'/_images/2.jpg',
		'/_images/3.jpg',
		'/_images/4.jpg',
		'/_images/5.jpg',
	);

	$i = rand(0, sizeof($ar)-1);
	if(isset($ar[$i]))
	{
		return '<img src="'.$ar[$i].'">';
	}
	return '';
}
add_shortcode('rand-img', 'wp2fl_rand_img');

Приклад третій. Шорткод для стилізації тексту — виділення червоним жирним шрифтом:

function wp2fl_style($attr, $content)
{
	return '<span style="color:red; font-weight:bold">'.$content.'</span>';
}
add_shortcode('style', 'wp2fl_style');

Перевірка — аналогічно: вставляємо шорткод у статтю, оновлюємо сторінку й дивимось результат.

Ось і все.

У наступній статті ми розглянемо, як за допомогою шорткоду зчитати RSS стрічку з іншого сайту й відобразити її у себе.

Пости на схожі теми

З вашим WordPress сайтом проблеми? потрібний додатковий функціонал? нестандартний плагін чи згорнути нову сторінку?
Тоді напишіть мені через форму зворотного зв'язку, і я намагатимусь вам допомогти.

Напишіть коментар

Ваша e-mail адреса не оприлюднюватиметься. Обов’язкові поля позначені *