Прочитал в одной из статей — как подгружать методом ajax целые куски кода, в том числе и php. Сам метод действительно оказался прост. В данной статье опишем ситуации где этот метод можно применять.
Метод подгрузки
Еще раз привожу метод подгрузки отдельных блоков:
1. Создаем php-файл с выводом требуемого кода, вверху прописываем следующее:
<?php require_once("../../../wp-load.php"); ?>
2. Прописываем скрипт, чтобы при определенном событии в определенный контейнер (#container) подгружался код из файла созданного в шаге 1 (file.php).
$(document).ready(function() {
$("#container").load("/wp-content/themes/template-name/file.php");
});
Альтернативный способ: создать необходимый для подгрузки файл php в виде шаблона и назначить его какой-либо странице и в этом случае в скрипте при вызове функции нужно указать путь на страницу:
$(document).ready(function() {
$("#container").load("/page-file/");
});
Собственно все. Очень просто, но дает такой потенциал возможностей!
Области применения
Полный каталог (в основе это решение), если мы часть категорий держим в спойлере, то при нажатии кнопки мы можем и получать эти категории:
$(document).ready(function() {
$('.spoiler-title').click(function(){
$(".full-catalog").load("/wp-content/themes/magazin/full-catalog.php");
});
});
Или подгружать содержимое одного из табов:
$(document).ready(function() {
$('#li-hit').click(function(){
$("#tab-hit").load("/wp-content/themes/magazin-3.0/hits.php");
});
});
Еще одним востребованным местом применения будут лэндинги. Можно подгружать «на лету» целый блоки. Будем использовать решение viewportChecker.
1. У необходимого блока прописываем require_once(«../../../wp-load.php»);
2. В том месте где он вызывался прописываем div с идентификатором, вместо непосредственного вызова get_template_part( ‘promo’ );
3. Прописываем скрипт:
$(document).ready(function() {
jQuery("#promo").viewportChecker({
callbackFunction: function(elem, action){
$("#promo").load("/wp-content/themes/meinland/promo.php");
}
});
});
