Створення сторінки «Про команді розробників» у WordPress

Майже кожна тема (theme), яку я розробляв для WordPress, вимагає наявності вікна з інформацією про команду розробників. Навскидку, я зробив близько 50 різних тем. Я подумав, що безліч інших WordPress-розробників також створюють теми.

З цієї причини, я хочу поділитися підходом, який я застосовую при створенні сторінки «Про команді розробників» в WordPress.

Ті, хто просто хоче отримати кінцевий результат, можуть натиснути кнопку нижче.

Переглянути приклад

Завантажити

Створення і управління сторінкою з інформацією про розробників WordPress вимагає використання наступних засобів:

• Власний тип запису, відмінний від стандартних (наприклад, team);
• Власна таксономія для фільтрації (наприклад, department);
• Метабокси (metabox) для управління кастомних (створеними вами) полями (custom fields) введення даних (наприклад, position, email, телефон і social media links).

Використовуючи ці інструменти, в даній статті ми пройдемо через всі етапи процесу створення шаблонів (template) сторінки «Про команді розробників» для нашої WordPress теми.

Для початку

Перед тим, як ми почнемо, я хочу прояснити деякі речі. Наведена вище посилання, містить приклади для даної статті, в яких я застосував об’єктно-ориентрованный підхід і зберіг весь код в окремому php-файл, який можна включати в файл functions.php своїх тем.

Для ясності, я буду описувати весь процес по кроках, і буду показувати, які зміни треба вносити в файл functions.php.

Створення власного типу запису і таксономії

Насамперед, нам необхідно зареєструвати новий тип запису (наприклад, team). Також, можете зареєструвати власний тип таксономії (наприклад, department), якщо необхідна фільтрація або категоризація.

Даний тип запису буде додавати нове меню Team Profiles в адміністративну панель WordPress, відокремлюючи всі записи, що стосуються команди розробників від стандартних записів та сторінок (Posts та Pages), для спрощення управління ними.

Таксономія буде додавати створену нами категорію до записів типу «team», дозволяючи фільтрувати та впорядковувати всю команду. Це дуже корисно, коли у вас в команді більше 10 осіб. Також, це зручно для впорядкування учасників команди за місцезнаходженням або відділу.

Створення типу запису

/**
* Реєстрація типу запису `team`
*/
function team_post_type() {
// масив міток для полів і кнопок
$labels = array(
‘name’ => _x(«Team», «post type general name»),
‘singular_name’ => _x(«Team», «post type singular name»),
‘menu_name’ => ‘Team Profiles’,
‘add_new’ => _x(«Add New», «team item»),
‘add_new_item’ => __(«Add New Profile»),
‘edit_item’ => __(«Edit Profile»),
‘new_item’ => __(«New Profile»),
‘view_item’ => __(«View Profile»),
‘search_items’ => __(«Search Profiles»),
‘not_found’ => __(«No Profiles Found»),
‘not_found_in_trash’ => __(«No Profiles Found in Trash»),
‘parent_item_colon’ =>»
);
// Реєстрація типу запису
register_post_type(‘team’ , array(
‘labels’ => $labels,
‘public’ => true,
‘has_archive’ => false,
‘menu_icon’ => get_stylesheet_directory_uri() . ‘/lib/TeamProfiles/team-icon.png’,
‘rewrite’ => false,
‘supports’ => array(‘title’, ‘editor’, ‘thumbnail’)
) );
}
add_action( ‘init’, ‘team_post_type’, 0 );

Створення таксономії (опціонально)

/**
* Реєстрація таксономії `department`
*/
function team_taxonomy() {
// масив міток для полів і кнопок
$singular = ‘Department’;
$plural = ‘Departments’;
$labels = array(
‘name’ => _x( $plural, «taxonomy general name»),
‘singular_name’ => _x( $singular, «taxonomy singular name»),
‘search_items’ => __(«Search $singular»),
‘all_items’ => __(«All $singular»),
‘parent_item’ => __(«Parent $singular»),
‘parent_item_colon’ => __(«Parent $singular:»),
‘edit_item’ => __(«Edit $singular»),
‘update_item’ => __(«Update $singular»),
‘add_new_item’ => __(«Add New $singular»),
‘new_item_name’ => __(«New $singular Name»),
);
// Реєстрація та прикріплення таксономії до типу запису ‘team’
register_taxonomy( strtolower($singular), ‘team’, array(
‘public’ => true,
‘show_ui’ => true,
‘show_in_nav_menus’ => true,
‘hierarchical’ => true,
‘query_var’ => true,
‘rewrite’ => false,
‘labels’ => $labels
) );
}
add_action( ‘init’, ‘team_taxonomy’, 0 );

У цьому прикладі ми використовуємо таксономію department не для всіх елементів. Я включив це в статтю тому, що корисно розуміти, як це можна використовувати для фільтрації членів команди.

Метабокс для кастомних полів

Тепер у нас є новий пункт меню в WordPress — «Профілі учасників команди» — і нам потрібно визначитися з даними, які ми хочемо зберігати записи про кожного учасника команди. Виходячи з мого досвіду, пропоную використовувати наступні поля:

• Розташування (відділ);
• Електронна пошта;
• Телефон;
• Сторінка в Twitter;
• Сторінка в LinkedIn.

Щоб керувати даними полями, потрібно створити кнопки «Додати запис» (Add New) і «Редагувати» (Edit), які дозволять адміністраторам сайту і авторам інтуїтивно просто додавати і оновлювати цю інформацію.

Для створення кастомних метабоксов з полями я використовую плагін Advanced Custom Fields (ACF).

Щоб створити цей метабокс, вам знадобиться встановлений плагін ACF, який дозволяє створювати власні поля через пункт меню Custom Fields, розташований зліва на панелі адміністрування. На зображенні нижче можна бачити поля, які я використовував для прикладу, викладеного в цій статті.

Якщо ви такий же лінивий (а точніше економить час), як я, можете скористатися імпортом XML-файлу, щоб автоматизувати процес створення полів. Ось покрокова інструкція:

Готово!

Плагін ACF зберігає дані всередині записів, тому можна використати стандартний інструмент WordPress для імпорту XML. Дуже розумний хід з боку плагін, Elliot Condon.

Замітка

В моєму PHP-класі я додав адміністративне повідомлення, яке пропонує встановити плагін ACF, якщо він ще не встановлений. Це корисно, щоб нагадати вам про необхідність використання даного плагіна для правильної роботи.

Кастомный шаблон

На даний момент ми маємо налагоджену систему управління, але нам також необхідно вивести інформацію на сайт. Щоб це зробити, я створюю кастомный шаблон теми (наприклад, template-team.php), який змінює вигляд певної сторінки WordPress. Щоб дізнатися про це більш детально ознайомитись з офіційною документацією WordPress.org з питання кастомних полів.

Висновок записів про розробників на екран

Щоб виводити записи про нашій команді всередині кастомного шаблону, ми використовуємо наступний код:

‘team’,
‘posts_per_page’ => -1, // Необмежена кількість записів
‘orderby’ => ‘title’, // Впорядковуємо за алфавітом
) );
if ( $team_posts ):
?>

Про команді розробників

«Окремі люди можуть зробити багато чого, але команда — ще більше!»

ID) ) {
$src = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), ‘team-thumb’ );
$thumb_src = $src[0];
}
?>