3 Tips Manajemen Gambar yang Kurang Dikenal di WordPress

  1. 1. Panduan Utama untuk Manajemen Gambar WordPress
  2. 2. Sedang Dibaca: 3 Tips Manajemen Gambar yang Kurang Dikenal di WordPress
  3. 3. Kesalahan SEO Gambar WordPress & Cara Memperbaikinya

Selamat datang di postingan kedua di Panduan Utama Manajemen Gambar di WordPress. Postingan pertama adalah tentang memulai dengan langkah yang benar. Kami mempelajari kapan harus menggunakan format gambar JPG atau PNG (walaupun dengan contoh yang ketat), dan beberapa tips tentang cara mengunggah gambar stok dengan benar.

Dalam postingan hari ini, kita akan melihat beberapa aspek teknis pemeliharaan dan pengelolaan gambar di situs WordPress Anda.

  • Apa yang terjadi pada gambar Anda ketika Anda mengubah URL situs atau memindahkan server?
  • Bagaimana jika Anda memiliki banyak penulis di situs Anda, dan beberapa di antaranya tertaut ke gambar eksternal? Bagaimana Anda mendapatkan gambar-gambar itu untuk dihosting di server Anda?
  • Apa yang terjadi jika seseorang menghubungkan gambar Anda dengan hotlink? Ngomong-ngomong apa itu hotlinking?

Ini adalah beberapa pertanyaan yang akan kami jawab di postingan hari ini. Seperti biasa pada rangkaian postingan kami, kami mulai dengan alasannya, lalu beralih ke caranya. Mari kita mulai!.

Tip #1: Manajemen Gambar dengan Pembaruan URL Situs

Ini adalah salah satu kesalahan paling umum yang kami lihat pada pengguna WordPress.

Kapan URL Situs WordPress berubah?

Namun pertama-tama, kita harus memahami kapan URL situs kemungkinan akan berubah. Berikut adalah tiga skenario yang paling umum.

1. Pindah ke Nama Domain Baru

URL situs diperbarui ketika Anda mengubah nama domain. Misalnya, Moz sebelumnya dikenal sebagai SEOMoz. Dengan branding baru mereka, mereka harus memperbarui semua URL gambar, PDF, tautan afiliasi, dll. yang ada dari seomoz.com ke moz.com

2. Mengubah Direktori Instalasi WordPress

URL situs juga berubah ketika Anda mengubah lokasi instalasi WordPress Anda. Faktanya, ini adalah salah satu kasus yang paling umum terjadi.

WordPress menginstal dirinya sendiri di direktori default baru yang disebut blog. Banyak pengguna WordPress pertama kali tanpa sadar akhirnya menginstal WordPress di example.com/blog.

Baru kemudian menyadari bahwa mereka ingin memindahkan WordPress ke domain root, yaitu example.com. (Jika Anda adalah perusahaan produk atau layanan, yang menyertakan pemasaran konten pada tahap selanjutnya, Anda pasti memahaminya.)

Setelah WordPress dipindahkan ke direktori akar, URL situs berubah dari example.com/blog menjadi example.com saja. Gambar, PDF (atau file media apa pun) akan terlihat seperti ini:

  • LAMA: example.com/blog/ebook.pdf
  • BARU: example.com/ebook.pdf

3. Peralihan antara Server Staging dan Produksi (Langsung).

Hal ini lazim terjadi di blog atau situs e-niaga dengan lalu lintas tinggi, di mana kesalahan apa pun akan menyebabkan penurunan konversi. Migrasi ke dan dari server pementasan dapat dilakukan dengan sangat sederhana jika Anda menggunakan host terkelola seperti WPEngine atau Flywheel. (Ngomong-ngomong, kami di WPExplorer telah menggunakan WPEngine selama tiga tahun berturut-turut dan tidak pernah mengalami downtime!)

Masalahnya terjadi ketika seseorang mengunggah gambar atau link ke beberapa postingan menggunakan URL server pementasan. Saat Anda mentransfer situs Anda kembali ke server langsung, tautan staging digunakan untuk gambar yang diunggah di lingkungan server staging. Oleh karena itu, idealnya hal ini harus dihindari. Jika Anda merasa seseorang dari tim Anda mungkin telah mengunggah konten di lingkungan pementasan, Anda dapat menerapkan perbaikan yang akan kami bagikan di bawah.

Demikian pula, beberapa dari Anda mungkin bertanya – Apa salahnya menggunakan tautan dari server pementasan? Bukankah ini akan menghemat bandwidth dari situs saat ini/yang aktif?

Anda tidak salah jika berpikir demikian. Namun kenyataannya, hal ini jarang terjadi. Inilah alasannya:

  1. Server pementasan biasanya berjalan pada sumber daya yang lebih rendah. Anda akan berkompromi pada kecepatan situs yang akan berdampak negatif pada pengalaman pengguna.
  2. Dalam banyak kasus, tautan akar server pementasan/pengujian terus berubah – yang mungkin menyebabkan banyak tautan rusak. Bayangkan tutorial 3000 kata dengan tangkapan layar rusak di mana-mana. Bagaimana perasaan Anda?
  3. Ini juga akan berdampak negatif pada SEO gambar Anda. Ingat, penelusuran gambar di Google masih menjadi sumber lalu lintas organik. Jika gambar tersebut bukan milik domain Anda – Anda akan kehilangan lalu lintas organik gratis dan poin SEO!

Apa yang ingin kita selesaikan?

Sekarang setelah kita mengetahui kapan URL situs WordPress diubah, mari kita lihat contoh di mana terdapat potensi ruang kesalahan. Tautan yang dibuat secara otomatis (seperti tautan afiliasi) tidak menghadapi masalah. Namun, link yang ditempel secara manual di postingan dan halaman (seperti link internal, link gambar, dll.) harus diperbarui secara manual.

Kita semua menggunakan gambar di postingan dan halaman kita. Contoh umum dari tautan gambar adalah:

http://mywpsite.tld/wp-content/uploads/year/month/image-name.png

Saat URL situs situs WordPress Anda berubah, tautan sumber semua gambar harus juga berubah menjadi:

http://newwordpressdomain.tld/wp-content/year/month/image-name.png

Bukan hanya gambar, semua link (termasuk link antar postingan, file media, PDF, dll) harus diperbarui.

Oke, sepertinya kita sudah membahas masalah ini secara mendalam. Sekarang mari kita lihat cara memperbaiki masalah ini untuk selamanya. Seperti biasa, kami memiliki plugin WordPress untuk diselamatkan!

URL Pembaruan Velvet Blues

  • Pertama, unduh dan instal URL Pembaruan Velvet Blues
  • Setelah aktivasi, buka halaman Alat Dasbor WordPress > Perbarui URL untuk mengonfigurasi pengaturan plugin.

Penggantian URL di WordPress – Atas perkenan plugin Velvet Blues Update URLs

Ingat bagaimana kami menggunakan fitur Temukan dan Ganti di Microsoft Word? Ya, pada dasarnya inilah yang dilakukan plugin! Ia menemukan URL lama di halaman atau konten postingan dan mengganti dengan URL baru. Dengan cara ini, tautan gambar diperbarui di semua postingan Anda.

Selain itu, Anda dapat memperluas fungsionalitas plugin untuk menemukan/mengganti URL di tautan situs, kutipan, lampiran, bidang khusus, dan kotak meta.

Berikut adalah beberapa contoh URL lama di situs Anda:

  • Jika Anda berpindah dari server pementasan, URL Lama akan terlihat seperti: namahost.com
  • Jika Anda mengubah/memperbarui nama domain, cukup gunakan nama situs baru Anda.
  • Jika Anda menggunakan 'https' sebagai protokol, ganti 'http' dengan 'https'.

Dalam contoh kami, kami telah mengganti URL lama dari http://seomoz.com menjadi https://moz.com. Setelah Anda memasukkan URL lama dan baru, cukup klik Perbarui URL SEKARANG. Plugin akan memindai semua posting dan halaman Anda dan menerapkan keajaiban temukan dan ganti. Semua URL Anda akan diperbarui ke nilai URL baru

Perhatian: Memindai dan mengganti beberapa postingan dan halaman dapat menghabiskan banyak sumber daya, terutama jika blog WordPress Anda memiliki ratusan postingan. Jika Anda memilih semua opsi pemindaian (tautan situs, kutipan, dll.), penggunaan sumber daya akan meningkat secara signifikan. Terlalu banyak pembaruan URL di seluruh situs dapat menyebabkan akun hosting Anda ditangguhkan sementara karena penggunaan sumber daya yang berlebihan. Masalah ini paling umum terjadi pada penyedia hosting bersama. Oleh karena itu saya menyarankan agar Anda sedikit berhati-hati saat menjalankan plugin.

Tip #2: Mengimpor Gambar Eksternal di WordPress

Gambar eksternal adalah gambar yang tidak dihosting di server Anda. Dalam tutorial ini, kita akan mempelajari cara mengimpor semua gambar eksternal dengan cepat dan efisien ke situs WordPress Anda.

Agar lebih jelas, mari kita asumsikan bahwa kita menggunakan gambar tersebut dengan lisensi yang sesuai (jika tidak, kita mungkin akan terlibat dalam perdebatan yang berbeda!).

Singkatnya, berikut dua alasan mengapa kita tidak boleh menggunakan gambar eksternal di situs WordPress kita:

  • Mereka menghabiskan bandwidth orang lain, dan ini tidak adil.
  • Ini merugikan skor SEO gambar kami.

Yuk simak postingan berikut ini. Cukup sulit untuk memahami apakah postingan tersebut menggunakan gambar eksternal atau tidak menggunakan Editor Visual.

Editor Visual WordPress

Kecuali, tentu saja, kita berpindah ke Tampilan teks pada editor WordPress.

Tampilan teks Editor WordPress, menampilkan kode sumber HTML dari konten postingan.

Kami melihat bahwa gambar tersebut sebenarnya dihosting di imgur.com – situs web hosting gambar populer. Untuk memperbaikinya, kita perlu:

  • Unduh gambarnya
  • Unggah ke WordPress
  • Perbarui tautan di pos

Dapatkah Anda membayangkan mengulangi semua langkah ini untuk setiap gambar di semua postingan? Hanya menemukan semua gambar eksternal yang membutuhkan waktu berhari-hari! Jadi pasti ada solusinya kan? Atau aku mengungkit hal ini hanya untuk mengecewakanmu?

Tentu saja tidak! Ada solusinya. Dan seperti biasa, ini adalah plugin WordPress gratis yang luar biasa.

Cara Mengimpor Gambar Eksternal di WordPress

Salah satu hal pertama yang saya sukai tentang plugin ini adalah namanya. Jelas, tajam, dan langsung pada sasaran. Untuk memulainya, unduh dan instal plugin Impor Gambar Eksternal. Aktifkan plugin dan buka Dasbor WordPress > Media > Impor Gambar

Anda akan melihat panel opsi seperti ini:

Opsi plugin Impor Gambar Eksternal WordPress

Jika Anda perhatikan di pojok kanan bawah, Anda akan melihat bahwa plugin telah mengidentifikasi postingan yang berisi gambar eksternal.

Dalam contoh kami, kami menjalankan plugin ini di lingkungan pementasan, itulah sebabnya kami hanya memiliki satu postingan, dengan satu gambar eksternal.

Yang perlu Anda lakukan sekarang adalah mengeklik Impor Gambar Sekarang untuk memulai prosesnya. Setelah selesai, Anda akan melihat pesan konfirmasi serupa mengenai total gambar yang diimpor.

Secara opsional, Anda juga dapat memilih untuk mengecualikan gambar berdasarkan nama domain. Ini berguna jika Anda memiliki tautan unduh gambar khusus (dari situs hosting gambar eksternal berbayar seperti Photobucket) yang tidak ingin Anda ganti.

Setelah impor gambar selesai, jika kita memeriksa galeri media, kita akan melihat semua gambar yang diimpor.

Gambar secara otomatis diimpor dan disimpan di Perpustakaan Media WordPress.

Oke jadi gambarnya diimpor ke WordPress Media Gallery. Bagaimana dengan konten postingannya? Apakah mereka masih menunjuk ke URL gambar lama? Sama sekali tidak!

Plugin ini juga mengganti link file gambar dengan URL baru, yaitu link domain Anda!

Setelah diimpor, tautan gambar juga diperbarui.

Dampak Kinerja: Mirip dengan masalah konsumsi sumber daya yang kita bahas di plugin pembaruan URL, mengimpor gambar eksternal di WordPress juga menghabiskan sebagian besar sumber daya server. Untungnya, pengembang telah mengambil tindakan untuk mengontrol penggunaan server. Plugin memindai maksimal 50 postingan per panggilan (yaitu saat Anda mengunjungi atau menyegarkan halaman pengaturan plugin). Ini juga membatasi jumlah maksimum gambar hingga 20 per panggilan impor.

Tip #3: Cara Mencegah Hotlinking Gambar di WordPress

Sederhananya, hotlinking berarti berkeliling kota menggunakan pemesanan Uber orang lain. Pikirkan tentang itu. Anda memesan Uber untuk perjalanan Anda dan orang asing entah bagaimana berhasil mencuri pemesanan Anda dan menggunakannya sesuai keinginan mereka. Anda membayar untuk perjalanan mereka. Sekarang bayangkan jika siapa saja dapat menerima pemesanan Uber Anda – menggunakannya sesuka mereka – berapa lama mereka menginginkannya – dan Anda tidak dapat berbuat apa-apa.

Ya, hotlinking gambar agak mirip. Orang-orang mengambil gambar Anda dan menggunakannya di situs mereka. Mereka mendapatkan ketenaran dan Anda akhirnya membayar tagihan mereka. Dan tidak ada yang dapat Anda lakukan untuk mengatasinya.

Tunggu! Baris terakhir tidak benar. Anda dapat melakukan sesuatu untuk mengatasinya. Bagaimanapun, ini adalah WordPress! Anda mungkin berpikir “Ah Sourav akan memperkenalkan plugin lain”. Bazzinga! saya tidak.

1. Konfigurasikan Server Web Anda untuk Pencegahan Hotlink (Apache atau NGINX)

Server web Anda cukup untuk mencegah orang lain melakukan hotlking pada gambar Anda. Dua server web yang paling umum adalah Apache dan NIGNX. Jika Anda menggunakan Apache sebagai server web, Anda dapat mencegah hotlinking gambar di WordPress dengan menambahkan beberapa baris kode di file .htaccess Anda. Pada tahun 2013, saya menulis tutorial singkat tentang ini – ini masih berlaku sampai sekarang.

Namun, jika Anda menggunakan NGINX sebagai server barat Anda, tambahkan cuplikan kode berikut ke file konfigurasi NGINX Anda.

location ~ .(gif|png|jpe?g)$ {
      valid_referers none blocked .yourwebsite.com;
      if ($invalid_referer) {
         return   403;
     }
 }

Ganti situswebanda.com dengan nama domain Anda yang sebenarnya.

Singkatnya, cuplikan kode ini mencegah file GIF, PNG, dan JPG/JPEG di-hotlink. File-file tersebut hanya dapat diakses oleh domain Anda dan tidak oleh orang lain. Jika seseorang mencoba melakukan hotlink ke 3 format file ini, mereka akan mendapatkan kesalahan 403.

Berikut penjelasan singkat baris demi baris dari kode yang dipotong.

  1. Baris 1 mendefinisikan format gambar. Anda juga dapat menambahkan format video seperti mp4 di sini.
  2. Baris 2 memberi tahu NGINX bahwa permintaan dari domain Anda harus diizinkan. Jika ada domain lain yang memintanya, blokir permintaan tersebut.
  3. Baris 3 memberi tahu NGINX apa yang harus dilakukan jika permintaan berasal dari domain yang tidak diizinkan
  4. Baris 4 memberitahu NGINX untuk memunculkan error HTTP 403 Forbidden, jika kondisi pada baris #3 terpenuhi.
  5. Baris 5 dan 6 menutup kode dengan benar agar dapat dieksekusi!

Demikian pula, jika Anda ingin mencegah seluruh direktori di-hotlink, ada juga cuplikan kode untuk itu.

location /uploads/ {
      valid_referers none blocked .yourwebsite.com;
      if ($invalid_referer) {
         return   403;
     }
 }

Ganti /uploads/ dengan direktori yang ingin Anda cegah agar tidak di-hotlink. Dalam contoh kami, kami telah memilih direktori uploads WordPress default. Jika Anda seperti kebanyakan dari kita, Anda akan mengunggah semua gambar, PDF, dan file media lainnya menggunakan pengunggah default WordPress, yang kemudian akan menempatkan file di dalam folder /uploads/. Oleh karena itu, dengan melindungi folder master, kami mencegah semua upload agar tidak di-hotlink.

2. Gunakan CDN untuk Mencegah Hotlinking Gambar di WordPress

Terkejut? Begitu pula saya ketika pertama kali membacanya. Kita semua mendengar tentang CloudFlare sebagai salah satu CDN gratis terbaik yang pernah ada. Tahukah Anda bahwa mereka juga menawarkan perlindungan hotlink gratis?

Untuk mengaktifkan perlindungan hotlink, cukup buka dasbor akun CloudFlare Anda, diikuti oleh Scrape Shield. Alihkan tombol ke AKTIF dan Anda sudah siap.

Jika Anda menggunakan Cloudflare, Anda dapat dengan mudah mengaktifkan perlindungan hotlink di bawah Scrape Shield di akun Anda. Karena Cloudflare adalah layanan proxy sepenuhnya, Anda tidak perlu khawatir untuk mengaktifkan perlindungan hotlink di server asal Anda.

Jika Anda menggunakan layanan CDN premium seperti StackPath CDN atau KeyCDN, yang Anda perlukan hanyalah membuat aturan yang sesuai untuk perujuk zona dan menerapkannya. KeyCDN memiliki tutorial yang bagus tentang ini, ada baiknya untuk membacanya.

3. Gunakan Plugin: Plugin Keamanan & Firewall WP All In One

Jika Anda memilih untuk tidak menggunakan kode .htaccess dan berharap tersedia plugin yang dapat menangani bisnis – ya, Anda beruntung.

Lihat plugin Keamanan & Firewall WP All In One. Dengan lebih dari setengah juta instalasi aktif, plugin ini memiliki banyak fitur keamanan WordPress yang penting.

Inilah yang harus Anda lakukan untuk mengaktifkan fitur Image Hotlinking Prevention.

Cara Mencegah Hotlinking Gambar di WordPress menggunakan Plugin Keamanan All in One WordPress

  • Unduh dan instal pluginnya.
  • Aktifkan, lalu buka Dasbor WordPress > Keamanan WP > Firewall dan klik Cegah Hotlink
  • Centang kotak kecil di bagian bawah dan klik Simpan Pengaturan.

Dan itu saja. Hotlinking gambar dicegah mulai sekarang.

Kesimpulan

Untuk mengakhiri postingan ini, mari kita bahas dengan cepat apa yang telah kita pelajari sejauh ini.

  1. Cara updatenya, lebih baik ganti URL lama dengan yang baru. Solusinya adalah plugin bagus yang disebut URL Pembaruan Velvet Blues.
  2. Selanjutnya, kita mempelajari cara mengimpor gambar eksternal ke WordPress. Banyak rekan blogger yang melakukan ini setidaknya sekali seumur hidup! Sekali lagi, solusinya ada pada plugin bernama Impor Gambar Eksternal.
  3. Kedua plugin yang disebutkan dalam dua skenario di atas memiliki dampak kinerja yang terkait dengannya. Kita perlu menjalankan plugin ini dengan hati-hati.
  4. Terakhir, kita membahas apa itu hotlinking gambar dan melihat dua cara untuk mencegahnya. Salah satunya adalah dengan menambahkan beberapa baris kode ke plugin .htaccess dan yang kedua adalah dengan menggunakan plugin keamanan.

Pertanyaan – apa pendapat Anda tentang tips ini? Menemukan sesuatu yang berguna? Punya sesuatu yang lebih baik untuk ditawarkan? Juga, bagaimana Anda menyukai serial ini sejauh ini? Beri tahu kami di kolom komentar di bawah, dan nantikan bagian selanjutnya dari seri ini.