Однією з функцій ядра, що подається WordPress розширеної конфігурації, є Мета Box API. Вона дозволяють легко додавати до контенту додаткові дані. Наприклад, через панель Мітки можна задати теги для вашого поста.
У цій статті я розповім, як створити базовий SEO плагін, який додає мета-опис, а також Open Graph теги тайтлов і описів в елемент head сторінки WordPress. При цьому ви також дізнаєтеся, як створювати користувальницькі мета-бокси, як перевіряти надані користувачами дані, як зберігати дані для запису або сторінки і як витягати збережені дані.
Я не буду детально пояснювати, що робить кожен фрагмент коду, використаний у цій статті, тому передбачається, що ви маєте базові знання з мета-боксів, а також по роботі функцій PHP. Якщо ви ще не володієте такими базовими знаннями, то можете почати з вивчення статті Як створювати користувальницькі мета-бокси WordPress.
Створення Meta Box
По-перше, ми повинні вирішити, де буде виводитися вікно мета-боксу.
У нашому плагіні мета-бокс буде виводитися в панелях post page. Для цього створюється функція, що містить змінну, в якій зберігається масив значень, де буде виводитися мета-бокс, і цикл foreach, який буде обробляти кожен елемент масиву, і виводити мета-бокс у тих, панелях, для яких це задано, використовуючи функцію add_meta_box.
І, нарешті, функція підключається до дії add_meta_boxes:
function tes_mb_create() {
/**
* @array $screens записує назви панелей, в яких буде виводитися мета-бокс
* @values запису, сторінки, панелі інструментів, посилання, вкладення, custom_post_type
*/
$screens = array( ‘post’, ‘page’ );
foreach ( $screens as $screen ) {
add_meta_box(
‘tes-meta’,
‘Search Engine Listing’,
‘tes_mb_function’,
$screen,
‘normal’,
‘high’
);
}
}
add_action( ‘add_meta_boxes’, ‘tes_mb_create’ );
Альтернативно можна додати подвійну функцію add_meta_box, щоб включити мета-бокс і запис, і сторінку наступним чином:
function tes_mb_create() {
add_meta_box(
‘tes-meta’,
‘Search Engine Listing’,
‘tes_mb_function’,
‘post’,
‘normal’,
‘high’
);
add_meta_box(
‘tes-meta’,
‘Search Engine Listing’,
‘tes_mb_function’,
‘page’,
‘normal’,
‘high’
);
}
add_action(‘add_meta_boxes’, ‘tes_mb_create’);
З наведеного вище коду випливає, що функція зворотного виклику, яка постачає HTML-код вводиться в панелі, наводиться як tes_mb_function – третій аргумент, який надається функції add_meta_box.
У нашому плагіні ми задаємо код тільки для двох полів форми, в яких обробляються дані тайтла і опису:
function tes_mb_function($post) {
/ /отримання значень мета-даних, якщо вони існують
$tes_meta_title = get_post_meta( $post->ID, ‘_tes_meta_title’, true );
$tes_meta_description = get_post_meta( $post->ID, ‘_tes_meta_description’, true );
// Додавання поля приватного випадку, щоб ми могли перевірити його пізніше при валідації
wp_nonce_field( ‘tes_inner_custom_box’, ‘tes_inner_custom_box_nonce’ );
echo’
Title Tag: | |
Meta Description: | ‘. esc_attr($tes_meta_description) . ‘ |
‘;
}
Ось що робить код tes_mb_function:
- отримує та зберігає значення мета-даних в змінну, тільки якщо вони існують. Це робиться для того, щоб заповнити поля відповідними значеннями, коли вони представлені у базі даних;
- додає поле приватного випадку, щоб ми могли перевірити його пізніше, під час валідації, перед тим, як дані додаються в поля форми, будуть збережені в базі даних;
- повторює / виводить HTML-форму, що складається з елемента поля для введення тексту і текстової зони для захоплення даних тегів тайтла і опису.
На даний момент, у вас вже повинен з’явитися мета-бокс в панелях редагування записів та сторінок:
Збереження даних Meta Box
Meta Box не є повноцінним, поки він не може записати дані в базу даних. Ім’я функції для обробки збереження даних буде tes_mb_save_data. Її код виглядає наступним чином:
function tes_mb_save_data($post_id) {
/*
* Ми повинні переконатися, що дані виходять з нашої панелі і від авторизованого
належним чином джерела,
* тому що save_post може бути викликаний у будь-який час.
*/
// Перевіряємо, чи заданий приватний випадок.
if ( ! isset( $_POST[‘tes_inner_custom_box_nonce’] ) )
return $post_id;
$nonce = $_POST[‘tes_inner_custom_box_nonce’];
// Перевіряємо валідність окремого випадку.
if ( ! wp_verify_nonce( $nonce, ‘tes_inner_custom_box’ ) )
return $post_id;
// Якщо використовується автозбереження, наша форма не повинна містити
запит на підтвердження, і ми не хочемо робити більше нічого.
if ( defined( ‘DOING_AUTOSAVE’) && DOING_AUTOSAVE )
return $post_id;
// Перевірка прав доступу користувача.
if ( ‘page’ == $_POST[‘post_type’] ) {
if ( ! current_user_can( ‘edit_page’, $post_id ) )
return $post_id;
} else {
if ( ! current_user_can( ‘edit_post’, $post_id ) )
return $post_id;
}
/* OK, дані не містять загроз і можуть бути збережені. */
// Якщо існують старі записи, витягаємо їх
$old_title = get_post_meta( $post_id, ‘_tes_meta_title’, true );
$old_description = get_post_meta( $post_id, ‘_tes_meta_description’, true );
// Проводимо перевірку безпеки введених користувачем даних.
$title = sanitize_text_field( $_POST[‘tes_meta_title’] );
$description = sanitize_text_field( $_POST[‘tes_meta_description’] );
// Оновлюємо мета-поля в базі даних.
update_post_meta( $post_id, ‘_tes_meta_title’, $title, $old_title );
update_post_meta( $post_id, ‘_tes_meta_description’, $description, $old_description );
}
add_action( ‘save_post’, ‘tes_mb_save_data’ );Давайте детальніше розглянемо цей код:
- по-перше, ми перевіряємо, що дані виходять з нашої панелі і від авторизованого відповідним чином джерела, тому що save_post можуть викликатися в будь який інший час, а також переконуємося, що приватний випадок, встановлений раніше в tes_mb_function, дійсний;
- потім, якщо запис вже існує в базі даних, ми витягуємо її і зберігаємо в змінних $old_title і $old_description. Це робиться тому, що функція update_post_meta, яка зберігає дані в базу даних, необов’язково вимагає старе значення, щоб перевірити його перед внесенням в рядок мета-бокс бази даних нового значення;
- після цього представлені дані перевіряються на безпеку функцією WordPress sanitize_text_field, яка конвертує HTML-код в його подання, очищає всі теги, видаляє розриви рядків, відступи і зайві прогалини, очищає октеты;
- мета дані додаються в базу даних з допомогою функції update_post_meta;
- і нарешті, tes_mb_save_data підключається до дії save_post, щоб зберегти дані мета-боксу, коли повідомлення або сторінка оновлюється.
Використання збережених даних
Не забувайте, що дані зберігаються, щоб використовуватися для додавання в Open Graph теги тайтла і опису, а також в мета-тег опису в елемент head кожної сторінки.
Для цього ми створимо функцію tes_mb_display, яка буде містити теги, і після цього підключимо її до дії wp_head:
function tes_mb_display() {
global $post;
// отримуємо значення мета-даних, якщо вони існують
$tes_meta_title = get_post_meta( $post->ID, ‘_tes_meta_title’, true );
$tes_meta_description = get_post_meta( $post->ID, ‘_tes_meta_description’, true );
echo’
‘;
}
add_action( ‘wp_head’, ‘tes_mb_display’ );- Для виявлення ID повідомлення, ми захоплюємо посилання на пост, глобально використовуючи об’єкт $post;
- Потім мета дані витягуються з бази даних і зберігаються у змінні $tes_meta_title і $tes_meta_description відповідно;
- Після цього ми визначаємо мета-тег, щоб вставити його в елемент head шаблону;
- Нарешті, ми підключаємо функцію до wp_head.
Коли ви додали і зберегли тайтл і опис запису або сторінки, можна перевірити, що джерело сторінки містить Open Graph теги тайтла і опису, а також мета-опис.
Для цього використовується пошукова система:
Висновок
У цій статті ми розглянули створення базового SEO-плагін, який додає мета-опис і Open Graph теги, використовуються пошуковими системами соціальних мереж розділу заголовка WordPress.
Ви дізналися, як створити мета-бокси, поля їх форм, перевіряти на безпеку дані перед збереженням у базу даних і отримувати збережені дані для подальшого використання.
Додаткове завдання, щоб дізнатися більше про цьому процесі: розширити плагін та додати мета-поле ключових слів у форму мета-боксу, а також включити їх в теги, які додаються в заголовок WordPress.
Переклад статті «Using WordPress Meta Boxes to Build a Basic SEO Plugin» був підготовлений дружною командою проекту Сайтостроение від А до Я.