AJAX — это динамическая загрузка отдельной части содержания страницы сайта с помощью языка программирования JavaScript. На сайте эта часть будет отображается, но в исходном коде страницы — нет. При отключенной поддержке JavaScript в браузере эта часть тоже не будет отображаться.
Поисковые системы не смогут увидеть эту часть, выводимую через AJAX.
Рассмотрим два способа выведения контента через AJAX в Worpress.
Содержание
Способ 1
I. Создать в папке темы WordPress-темы сайта новый php-файл (пример: ajax_content.php) с таким кодом №1, содержимое которого и будет подгружаться:
|
1
2
3
4
5
6
7
8
9
10
|
<?php
/*
Template Name: AJAX список архивов
*/
?>
<a href=“http://site.com/page1.html” rel=“nofollow”>Ссылка или всё что угодно</a>
|
II. В админ-панели WordPress’а создать новую страницу с произвольным названием. Справа в блоке «Атрибуты страницы» выбрать шаблон «AJAX список архивов».
Нужно заметить, что страницу стоит закрыть в «noindex, nofollow» и если на сайте установлены плагины генерации карты сайта (например: XML-Sitemap, Dagon Design Sitemap Generator) — стоит в их настройках исключить данную страницу. ID страницы в WordPress’е видно в строке браузера, при редактировании страницы, например:
https://wpcraft.top/wp-admin/post.php?post=9478&action=edit.
III. В том месте файла sidebar.php, index.php, footer.php, где нужно вывести блок, вставить код:
|
1
2
3
4
5
|
<div id=“ajaxcontent”></div>
|
IV. Т. к. AJAX реализуется с помощью jQuery, и если jQuery не подключен к сайту, тогда в файле header.php перед <?php wp_head(); ?> нужно добавить следующее:
|
1
2
3
4
5
6
7
8
9
|
<?php
wp_deregister_script(‘jquery’);
wp_register_script(‘jquery’, (“http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js”), false, ‘1.7.2’);
wp_enqueue_script(‘jquery’);
?>
|
V. Последнее: добавить на сайт скрипт js-файла, который будет загружать требуемый контент.
a) Создать файл с расширением .js произвольного названия (к примеру, jscontent.js) c кодом:
|
1
2
3
4
5
6
7
8
9
|
(function($) {
$(function() {
$(“#ajaxcontent”).load(“http://домен/адрес-созданной-страницы/”);
})
})(jQuery)
|
b) Созданный js-файл положить в папку темы сайта. c) Подключить в header.php такой строкой перед тегом </head>:
|
1
2
3
4
5
|
<script src=“http://site.com/wp-content/themes/ТЕМА/jscontent.js”></script>
|
Способ 2
Второй вариант немного короче.
I. Создать в папке темы WordPress-темы php-файл (пример: ajax_content.php) с кодом:
|
1
2
3
4
5
6
|
<?php require_once(“../../../wp-load.php”); ?>
<a href=“http://site.com/page.html” rel=“nofollow”>Ссылка или всё что угодно</a>
|
II. В том месте, где необходимо вывести блок, вставить html-код:
|
1
2
3
4
5
|
<div id=“ajaxcontent”></div>
|
III. если jQuery не подключен к сайту, тогда в файле header.php перед
<?php wp_head(); ?> нужно добавить следующее:
|
1
2
3
4
5
6
7
8
9
|
<?php
wp_deregister_script(‘jquery’);
wp_register_script(‘jquery’, (“http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js”), false, ‘1.7.2’);
wp_enqueue_script(‘jquery’);
?>
|
IV. Последние операции: добавить на сайт скрипт js-файла, который будет загружать требуемый контент.
a) Создать файл с расширением .js произвольного названия (к примеру, jscontent.js) c кодом:
|
1
2
3
4
5
6
7
8
9
|
(function($) {
$(function() {
$(“#ajaxcontent”).load(“http://домен/адрес-созданной-страницы/”);
})
})(jQuery)
|
b) Созданный js-файл положить в папку темы сайта.
c) Подключить в header.php такой строкой перед тегом </head>:
|
1
2
3
4
5
|
<script src=“http://site.com/wp-content/themes/ТЕМА/jscontent.js”></script>
|
Способы выведения блоков через AJAX взяты у dimox.name, за что ему — спасибо.
(Пока оценок нет)
Загрузка...