Делаем свой шорткод — add_shortcode()

Часто при разработке сайта клиенты меня просят сделать какой либо шорткод, для вывода определенной информации, слайдера, баннеров и т.п

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

Начало работы

К примеру у нас задача 1: Создать шорткод для вывода блоков (note,important,tip,warning и help) в любом месте контента (the_content)

Для начала нам нужно создать функцию шорткода и зарегистрировать сам шорткод

<?php 
/*Создаем функцию*/
function theme_text_message ($atts, $content) { 
// Массив значений по умолчанию 
$atts = shortcode_atts( array( 'type' => 'blockquote',
	), $atts );
	// Возвращаем контент в нужном нам формате
	return "
	
<div class='message {$atts['type']}'>
		
<div class='message_text'>{$content}</div>

	</div>

	";
}
/*Регистрируем шорткод*/
add_shortcode ('text_message', 'theme_text_message');
?>

Это конечно упрощенный и быстрый вариант но теперь его уже можно использовать в редакторе wordpress —

Мы сделали нужный нам функционал вывода но без стилей, конечно можно их прописать и в style.css своей темы но я иду другим путем, вставляю в файл functions.php функцию проверки наличия шорткода в контенте и если он есть то подключаю стили

add_action( 'wp_print_styles', 'custom_shortcode_css');

function custom_shortcode_css() {
global $post;
// проверяем наличие шорткода
if( has_shortcode( $post->post_content, 'text_message') ) { ?>
<style>
.message{
position: relative;
padding: 20px;
color: #fff;
}
.message.blockquote{
background: blue;
}
.message.warning{
background: red;
} /* Ну и в том же духе */
</style>
<? }
}

Вместо <style> лучше на мой взгляд подключение файла стилей —

wp_enqueue_style( 'message_style', get_template_directory_uri() . '/css/message.css' );

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