Cara Membuat Galeri Album Foto di WordPress Tanpa Plugin

Pada artikel ini, kami akan menunjukkan cara membuat galeri album foto di WordPress tanpa plugin.

Kita semua tahu bahwa dengan plugin di WordPress, tidak ada yang mustahil untuk dicapai.

Tetapi semakin banyak plugin yang Anda gunakan, semakin menurun kinerja situs web Anda.

Untuk situs web apa pun, galeri memainkan peran yang sangat penting.

Jika galeri Anda melibatkan pekerjaan dan filter yang rumit, kinerja situs web secara keseluruhan dapat dikalahkan.

Galeri album foto seharusnya memiliki beberapa foto yang berada di dalamnya.

Di sini kami membuat album bulanan sehingga setiap album memiliki gambar sampul dan ketika gambar sampul diklik, Anda akan dibawa ke dalam album untuk memeriksa setiap foto satu per satu.

Anda juga perlu tahu cara membuat galeri album foto di WordPress tanpa plugin untuk melakukan tugas rumit yang mengharuskan Anda membeli plugin premium jika ingin menggunakan plugin.

Selain itu, Anda dapat menggunakan salah satu perangkat lunak pengedit foto ini untuk mengedit foto yang akan dilampirkan ke galeri album foto Anda.

Langkah-langkah Membuat Galeri Album Foto Di WordPress Tanpa Plugin

Semua fitur yang diperlukan untuk mencapai tujuan dapat dilakukan menggunakan fungsionalitas bawaan WordPress. Pertimbangkan setiap album bulanan sebagai pos dengan satu halamannya sendiri. Pertimbangkan setiap gambar di dalam album sebagai lampiran dengan satu halaman sendiri.

Album akan membutuhkan thumbnail, dan fitur ini ada di WordPress. Jika situs web Anda adalah situs web fotografer, maka Anda dapat mengubah posting default Anda dengan album. Jika tidak, Anda harus membuat jenis posting khusus.

Buat Plugin Khusus Situs (bukan Readymade) dan Jenis Posting Kustom

Anda perlu membuat plugin khusus situs yang tidak bergantung pada tema Anda. Mereka berguna untuk membuat jenis posting khusus, menambahkan kode pendek, menampilkan thumbnail dan juga. Untuk membuat plugin khusus situs, Anda harus pergi ke direktori plugin menggunakan FTP.

Di bawah wp-content/plugins/ buat folder baru dan beri nama folder dengan nama yang sama dengan plugin yang ingin Anda buat. Masuk ke dalam folder dan buat file php dengan nama yang sama dengan folder. Rekatkan kode berikut di dalam file.

/*
Nama Plugin: Plugin Situs untuk website.com
Deskripsi: Perubahan kode khusus situs untuk website.com
*/
/* Mulai Menambahkan Fungsi Di Bawah Baris Ini */
/* Berhenti Menambahkan Fungsi Di Bawah Baris Ini */

Simpan file dan keluar. Kode yang disebutkan di atas tidak memiliki arti apa-apa, dan akan diganti ketika jenis posting khusus dibuat.

Hasilkan kode untuk jenis posting khusus dari Generator Kode Jenis Posting Kustom WordPress.

Menampilkan Ukuran Gambar Tambahan dan Bidang Tambahan–

Dari Dasbor Admin, buka Penampilan lalu ke Editor. Temukan file functions.php dan tambahkan kode berikut untuk mendaftarkan ukuran gambar tambahan untuk tampilan grid.

add_image_size( 'album-grid', 225, 150, benar );

Jika Anda ingin menambahkan bidang khusus tambahan ke Pengunggah Media seperti nama fotografer, halaman mereka, dan informasi lainnya saat Anda mengunggah gambar, Anda perlu menambahkan kode berikut di functions.php.

/**
 * Tambahkan Nama Fotografer dan bidang URL ke pengunggah media
 * @param $form_fields array, bidang yang akan disertakan dalam formulir lampiran
 * @param $post objek, catatan lampiran di database
 * @return $form_fields, bidang formulir yang dimodifikasi
 */

function be_attachment_field_credit( $form_fields, $post ) {
    $form_fields['be-photographer-name'] = array(
        'label' = 'Nama Fotografer',
        'masukan' = 'teks',
        'nilai' = get_post_meta( $post-ID, 'be_photographer_name', true ),
        'helps' ='Jika tersedia, kredit foto akan ditampilkan',
    );
    $form_fields['be-photographer-url'] = array(
        'label' ='URL Fotografer',
        'masukan' ='teks',
        'nilai' =get_post_meta( $post-ID, 'be_photographer_url', true ),
        'membantu' = 'Tambahkan URL Fotografer',
    );
    kembalikan $form_fields;
}
add_filter( 'attachment_fields_to_edit', 'be_attachment_field_credit', 10, 2 );

/**
 * Simpan nilai Nama Fotografer dan URL di pengunggah media
 * @param $post array, data posting untuk database
 * @param $attachment array, bidang lampiran dari formulir $_POST
 * @return $post array, modifikasi data postingan
 */
function 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'] ) );
    kembalikan $pos;
}
add_filter( 'attachment_fields_to_save', 'be_attachment_field_credit_save', 10, 2 );

Seperti yang Anda lihat, itu akan menambahkan dua bidang teks di Pengunggah Media yaitu Nama Fotografer dan URL Fotografer.

Membuat Halaman Untuk Menampilkan Semua Album

Sekarang, saatnya untuk membuat beberapa album (jenis posting khusus) dan menambahkan foto ke dalamnya. Gambar unggulan akan menjadi gambar sampul album. Konten yang Anda tambahkan ke area konten postingan akan menjadi deskripsi album.

Halaman Template Untuk Album

Buat file dan beri nama archive-albums.php. Salin kode header, footer, sidebar, dan elemen UI lainnya dan tempel di dalamnya. Tempel kode berikut di dalamnya untuk menampilkan semua album dalam satu halaman.

<li class="album-grid">a href=" title=""</a></li>
post_type == 'album' $post-post_status == 'publish' ) {
        $attachments = get_posts( array(
            'post_type' ='lampiran',
            'postingan_per_halaman' =-1,
            'post_parent' =$post-ID,
            'kecualikan' =get_post_thumbnail_id()
        ) );
        jika ( $lampiran ) {
            foreach ( $attachments sebagai $attachment ) {
                $class = "post-attachment mime-" . sanitize_title( $attachment-post_mime_type );
                $title = wp_get_attachment_link( $attachment-ID, 'album-grid', true );
                echo '<li class="' . $class . ' album-grid">' . $judul . '</li>';
            }           
        }
    }

Tempatkan kode berikut di file CSS utama tema Anda sehingga gambar sampul ditampilkan dalam kotak.

.album-grid{lebar: 225 piksel; tinggi: 150 piksel; mengapung: kiri; gaya daftar: tidak ada; list-style-type: tidak ada; margin: 0 18px 30px 0px;}

Halaman Template Untuk Setiap Gambar

Buat file dan beri nama single-attachments.php. Salin semua kode dari single.php tema yang dibuat sebelumnya. Anda dapat menemukannya di bawah Editor dari menu Appearance. Kemudian temukan kode loop di single-attachments.php Anda dan ganti bagian itu dengan yang berikut ini.

if ( have_posts() ) : while ( have_posts() ): the_post();

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

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

<h1>the_title();</h1>
<div class="photometa"><span class="photographername"> echo $fotografer; </span> // <a href=" echo $photographerurl " target="_blank" class="photographerurl" rel="noopener noreferrer"> echo $photographerurl </a></div>
                        <div class="entry-attachment">
 if ( wp_attachment_is_image( $post-id ) ) : $att_image = wp_get_attachment_image_src( $post-id, "penuh"); 
                        <p class="attachment"><a>id); " judul=" 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>
 kalau tidak :
                        <a>ID) " title=" echo wp_specialchars( get_the_title($post-ID), 1 )" rel="attachment"echo basename($post-guid) </a>
 berakhir jika; 
                        </div>
 sementara; 
 berakhir jika;