Как создать галерею фотоальбома в WordPress без плагина

В этой статье мы покажем вам, как создать галерею фотоальбомов в WordPress без плагина.

Все мы знаем, что с помощью плагинов в WordPress невозможно ничего добиться.

Но чем больше плагинов вы используете, тем больше снижается производительность вашего сайта.

Для любого сайта галерея играет очень важную роль.

Если ваша галерея включает в себя сложные работы и фильтры, производительность всего веб-сайта может пострадать.

Галерея фотоальбома должна содержать несколько фотографий.

Здесь мы создаем ежемесячный альбом, чтобы у каждого альбома была обложка, и при нажатии на обложку вы попадете внутрь альбома, чтобы проверить каждую фотографию по отдельности.

Вам также необходимо знать, как создать галерею фотоальбомов в WordPress без плагина , чтобы выполнять сложные задачи, для которых вам нужно было купить плагин премиум-класса, если вы хотите использовать плагин.

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

Шаги по созданию галереи фотоальбомов в WordPress без плагина

Все функции, необходимые для достижения цели, можно реализовать с помощью встроенных функций WordPress. Рассматривайте каждый ежемесячный альбом как пост с отдельной отдельной страницей. Рассматривайте каждое изображение внутри альбомов как вложение с собственной отдельной страницей.

Для альбомов потребуется миниатюра, и эта функция встроена в WordPress. Если ваш веб-сайт является веб-сайтом фотографа, вы можете превратить свои публикации по умолчанию в альбом. В противном случае вам нужно создать собственный тип записи.

Создайте плагин для конкретного сайта (не готовый) и пользовательский тип сообщения

Вам нужно создать плагин для конкретного сайта, который не зависит от вашей темы. Они полезны для создания пользовательских типов сообщений, добавления шорткодов, отображения миниатюр и тому подобного. Чтобы создать плагин для конкретного сайта, вам нужно перейти в каталог плагинов с помощью FTP.

В разделе wp-content/plugins/ создайте новую папку и назовите ее тем же именем, что и плагин, который вы хотите создать. Зайдите в папку и создайте файл php с тем же именем, что и папка. Вставьте следующий код внутрь файла.

/*
Название плагина: Плагин сайта для website.com
Описание: изменения кода сайта для веб-сайта.com.
*/
/* Начать добавление функций ниже этой строки */
/* Остановить добавление функций ниже этой строки */

Сохраните файл и выйдите. Вышеупомянутый код не имеет никакого значения и будет заменен при создании пользовательского типа записи.

Сгенерируйте код для пользовательского типа записи с помощью генератора кода пользовательского типа записи WordPress.

Отображение дополнительных размеров изображений и дополнительных полей–

На панели администратора перейдите в раздел «Внешний вид», а затем в «Редактор». Найдите файл functions.php и добавьте следующий код для регистрации дополнительного размера изображения для отображения сетки.

add_image_size('альбом-сетка', 225, 150, правда);

Если вы хотите добавить дополнительные настраиваемые поля в Media Uploader, такие как имя фотографа, его страницы и другую информацию при загрузке изображения, вам необходимо добавить следующий код в файл functions.php.

/**
 * Добавьте поля имени фотографа и URL-адреса в загрузчик медиафайлов.
 * Массив @param $form_fields, поля для включения в форму вложения
 * Объект @param $post, запись вложения в базе данных
 * @return $form_fields, модифицированные поля формы
 */

функция be_attachment_field_credit($form_fields, $post) {
    $form_fields['имя-фотографа'] = массив(
        'label' = 'Имя фотографа',
        'ввод' = 'текст',
        'value' = get_post_meta($post-ID, 'be_photographer_name', true),
        'helps' = 'Если предоставлено, будет отображаться авторство фотографии',
    );
    $form_fields['be-photographer-url'] = массив(
        'label' = 'URL-адрес фотографа',
        'ввод' = 'текст',
        'value' =get_post_meta($post-ID, 'be_photographer_url', true),
        'helps' = 'Добавить URL-адрес фотографа',
    );
    вернуть $form_fields;
}
add_filter('attachment_fields_to_edit', 'be_attachment_field_credit', 10, 2 );

/**
 * Сохранение значений имени фотографа и URL-адреса в загрузчике медиа
 * Массив @param $post, данные сообщения для базы данных
 * Массив @param $attachment, поля вложений из формы $_POST
 * @return массив $post, измененные данные сообщения
 */
функция be_attachment_field_credit_save($post, $attachment) {
    if(isset($attachment['be-photographer-name'] ))
        update_post_meta($post['ID'], 'be_photographer_name', $attachment['be-photographer-name'] );
    if(isset($attachment['be-photographer-url'] ))
update_post_meta($post['ID'], 'be_photographer_url', esc_url($attachment['be-photographer-url'] ) );
    вернуть $пост;
}
add_filter('attachment_fields_to_save', 'be_attachment_field_credit_save', 10, 2 );

Как видите, он добавит два текстовых поля в Media Uploader, а именно имя фотографа и URL-адрес фотографа.

Создание страниц для отображения всех альбомов

Теперь пришло время создать несколько альбомов (пользовательские типы сообщений) и добавить в них фотографии. Это изображение станет обложкой альбома. Контент, который вы добавите в область контента поста, станет описанием альбома.

Шаблон страницы для альбомов

Создайте файл и назовите его archive-albums.php. Скопируйте код заголовка, нижнего колонтитула, боковой панели и других элементов пользовательского интерфейса и вставьте его. Вставьте в него следующий код, чтобы отобразить все альбомы на одной странице.

<li class="album-grid">a href=" title=""</a></li>
post_type == 'альбомы' $post-post_status == 'опубликовать' ) {
        $ вложения = get_posts (массив (
            'post_type' = 'вложение',
            'сообщений_на_странице' =-1,
            'post_parent' = $идентификатор сообщения,
            'исключить' = get_post_thumbnail_id()
        ));
        если ( $ вложения ) {
            foreach ( $ вложения как $ вложение ) {
                $class = "мим после вложения-" . sanitize_title($attachment-post_mime_type);
                $title = wp_get_attachment_link($attachment-ID, 'альбом-сетка', true);
                echo '<li class="' . $class . ' альбомная сетка">' . $название . '</li>';
            }           
        }
    }

Поместите следующий код в основной файл CSS вашей темы, чтобы изображения обложки отображались в виде сетки.

.album-grid {ширина: 225 пикселей; высота: 150 пикселей; плыть налево; стиль списка: нет; тип стиля списка: нет; поле: 0 18px 30px 0px;}

Страница шаблона для каждого изображения

Создайте файл и назовите его single-attachments.php. Скопируйте весь код из готового файла single.php темы. Вы можете найти его в разделе «Редактор» в меню «Внешний вид». Затем найдите код цикла в файле single-attachments.php и замените этот раздел следующим.

если ( have_posts() ) : в то время как ( have_posts() ): the_post();

$photographer = get_post_meta($post-ID, 'be_photographer_name', true);

$photographerurl = get_post_meta($post-ID, 'be_photographer_url', true);

<h1>the_title();</h1>
<div class="photometa"><span class="photographername"> echo $photographer; </span> // <a href=" echo $photographerurl " target="_blank" class="photographerurl" rel="noopener noreferrer"> echo $photographerurl </a></div>
                        <div class="запись-вложение">
 если (wp_attachment_is_image($post-id)) : $att_image = wp_get_attachment_image_src($post-id, "полный"); 
                        <p class="attachment"><a>id); " title=" the_title(); " rel="attachment"<img src=" echo $att_image[0];" width=" echo $att_image[1];" height="echo $att_image[2];" class="attachment-medium">post_excerpt ;" /</a>
                        </p>
 еще :
                        <a>ID) " title=" echo wp_specialchars( get_the_title($post-ID), 1 )" rel="attachment"echo basename($post-guid) </a>
 конец; 
                        </div>
 конец; 
 конец;