Главная   /   Блог   /   WordPress   /  

Шпаргалка по интеграции на Wordpress

Шпаргалка по интеграции на Wordpress

Эта шпаргалка без заморочек для тех, кто уже знает как интегрировать HTML шаблон на систему управления WordPress. Здесь нет пошаговой инструкции и объяснения кода. Эта страница создана для себя, чтобы каждый раз не копировать один и тот же код при натяжке верстки. Страница будет дополняться.

Стартовый пустой шаблон Wordpress для натяжки верстки

Скачать - прямая ссылка
underscores.me - также можно скачать здесь, задав своё имя шаблона

  • Удаляем все стили из файла style.css шаблона
  • Переносим все файлы и папки верстки в папку шаблона

Подключение своих стилей и скриптов в файле functions.php в Wordpress


function load_style_script()
{
	wp_enqueue_style('qam-css', get_template_directory_uri() .  '/css/main.min.css');

	/*-------------------------------------------------*/
	
	wp_deregister_script('jquery-core');
	wp_deregister_script('jquery');
	wp_register_script('jquery-core', get_template_directory_uri() . '/js/jquery.js', false, null, true);
	wp_register_script('jquery', false, array('jquery-core'), null, true);
	wp_enqueue_script('jquery');

	wp_enqueue_script('qam-js', get_template_directory_uri() . '/js/app.min.js', array('jquery'), true);

}
add_action('wp_enqueue_scripts', 'load_style_script');

            

Создание шаблона страницы Wordpress 


<?php
/*
Template Name: Моя страница шаблона
*/
get_header();
?>

Контент

<?php
get_footer();
            

Получаем URL до родительского шаблона

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

<?php echo get_template_directory_uri(); ?>

Пример:

<img src="<?php echo get_template_directory_uri(); ?>/images/dist/logo.svg" alt="">


Регистрация меню Wordpress

В файле functions.php прописываем следующее:

add_action( 'after_setup_theme', function(){ 
register_nav_menus( [ 
'header_menu' => 'Меню в шапке',
'footer_menu' => 'Меню в подвале' ] );
 } );

Чтобы удалить контейнер у всех навигационных меню сразу, используем следующий код:

add_filter( 'wp_nav_menu_args', 'my_wp_nav_menu_args' );
function my_wp_nav_menu_args( $args = '' ){ 
$args['container'] = false; return $args; 
}

Выводим меню в шаблоне:

<?php wp_nav_menu( [
'theme_location'  => 'header_menu'
] ); ?>


Как вставить шорткод внутри html документа Wordpress


<?php echo do_shortcode('[ваш шорткод]'); ?>


Блог разработчика