WordPress'te Daha Az Bilinen 3 Görüntü Yönetimi İpuçları

WordPress'te Görüntü Yönetimine Yönelik En İyi Kılavuzdaki ikinci gönderiye hoş geldiniz. İlk yazı sağ ayakla başlamakla ilgiliydi. Bir JPG veya PNG resim formatının ne zaman kullanılacağını (kesin örneklerle de olsa) ve bir stok görüntüsünü düzgün bir şekilde yüklemek için birkaç ipucu öğrendik.

Bugünkü gönderide, WordPress sitenizdeki görüntü bakımı ve yönetiminin daha teknik yönlerinden bazılarına bakacağız.

• Site URL'sini değiştirdiğinizde veya sunucuları taşıdığınızda resimlerinize ne olur?
• Sitenizde birden fazla yazar varsa ve bazıları harici resimlere bağlantı veriyorsa ne olur? Bu görüntülerin sunucunuzda barındırılmasını nasıl sağlarsınız?
• Birisi resimlerinize hotlink eklediğinde ne olur? BTW, sıcak bağlantı nedir ?

Bunlar, bugünün gönderisinde cevaplayacağımız sorulardan bazıları. Yazı dizimizde her zaman olduğu gibi, neden ile başlıyoruz ve ardından nasıl kısmına geçiyoruz. Başlayalım!.

1. İpucu: Site URL Güncellemeleri ile Resim Yönetimi

Bu, WordPress kullanıcıları arasında gördüğümüz en yaygın hatalardan biridir.

WordPress Site URL'si ne zaman değişir?

Ancak önce, bir site URL'sinin ne zaman değişebileceğini anlamamız gerekir. Aşağıda en yaygın üç senaryo verilmiştir.

1. Yeni Bir Alan Adına Geçmek

Alan adını değiştirdiğinizde site URL'si güncellenir. Örneğin, Moz daha önce SEOMoz olarak biliniyordu. Yeni marka bilinci oluşturmalarıyla, seomoz.com'dan moz.com'a tüm mevcut görsel URL'lerini, PDF'leri, bağlı kuruluş bağlantılarını vb. güncellemeleri gerekiyordu.

2. WordPress Kurulum Dizinini Değiştirme

WordPress kurulumunuzun konumunu değiştirdiğinizde site URL'si de değişir. Aslında, bu orada en yaygın durumlardan biridir.

WordPress kendisini blog adlı yeni bir varsayılan dizine kurar. Birçok ilk kez WordPress kullanıcısı bilmeden WordPress'i example.com/blog'a yükler.

Sadece daha sonra WordPress'i kök etki alanına, yani example.com'a taşımak istediklerini anlamak için. (Daha sonraki aşamalarda içerik pazarlamasına dahil olan bir ürün veya hizmet şirketiyseniz, ilişki kurarsınız.)

WordPress kök dizine taşındığında, site URL'si example.com/blog'dan yalnızca example.com'a değişir . Herhangi bir resim, PDF (veya bu konudaki herhangi bir medya dosyası) şuna benzer:

• ESKİ: example.com/blog/ebook.pdf
• YENİ: example.com/ebook.pdf

3. Hazırlama ve Üretim (Canlı) Sunucular Arasında Geçiş

Bu, yüksek trafikli bloglarda veya herhangi bir hatanın dönüşümlerde düşüşe neden olduğu e-ticaret web sitelerinde yaygındır. WPEngine veya Flywheel gibi yönetilen bir ana bilgisayar kullanıyorsanız, bir hazırlama sunucusuna ve sunucudan geçiş yapmak çok basit hale getirilebilir. (Btw, biz WPExplorer olarak üç yıldır üst üste WPEngine kullanıyoruz ve hiçbir zaman kesinti ile karşılaşmadık!)

Sorun, birisi hazırlama sunucusunun URL'sini kullanarak bir resim yüklediğinde veya bir gönderiye bağlantı verdiğinde ortaya çıkar. Sitenizi canlı sunucuya geri aktardığınızda, hazırlama sunucusunun ortamına yüklenen bu görüntüler için hazırlama bağlantılarının bağlantıları kullanılır. Bu nedenle ideal olarak bundan kaçınılmalıdır. Ekibinizden birinin hazırlama ortamına içerik yüklemiş olabileceğini düşünüyorsanız, aşağıda paylaşmak üzere olduğumuz düzeltmeyi uygulayabilirsiniz.

Benzer bir notta, bazılarınız şu soruyu sorabilir: Hazırlama sunucusundan gelen bağlantıları kullanmanın zararı nedir? Mevcut/canlı siteden bant genişliği tasarrufu sağlamaz mı?

Böyle düşünmekte haksız değilsin. Ancak gerçekte, bu nadiren gerçekleşir. İşte nedeni:

1. Bir hazırlama sunucusu genellikle daha düşük kaynaklarda çalışır. Kullanıcı deneyimini olumsuz yönde etkileyecek site hızından ödün vermiş olursunuz.
2. Çoğu durumda, hazırlama/test sunucusunun kök bağlantısı değişmeye devam eder – bu da bir sürü bozuk bağlantıya yol açabilir. Her yerde kırık ekran görüntüleri olan 3000 kelimelik bir eğitim hayal edin. Bu seni nasıl hissettirdi?
3. Bu aynı zamanda görüntü SEO'nuzu da olumsuz etkiler. Google'da görsel aramanın hala bir organik trafik kaynağı olduğunu unutmayın. Resim alan adınıza ait değilse, ücretsiz organik trafik ve SEO puanlarını kaybedersiniz!

Neyi çözmeye çalışıyoruz?

Artık bir WordPress site URL'sinin ne zaman değiştirildiğini bildiğimize göre, potansiyel hata payının olduğu bir örnek görelim . Otomatik olarak oluşturulan bağlantılar (bağlı kuruluş bağlantıları gibi) hiçbir sorunla karşılaşmaz. Ancak, gönderilere ve sayfalara manuel olarak yapıştırılan linklerin (iç linkler, resim linkleri vb.) manuel olarak güncellenmesi gerekir.

Hepimiz yazılarımızda ve sayfalarımızda görsel kullanıyoruz. Tipik bir resim bağlantısı örneği:

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

Ne zaman WordPress sitesi değişikliklerin site URL, tüm görüntülerin kaynağı bağlantıları da değiştirmek gerekir:

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

Yalnızca resimler değil, tüm bağlantılar (postalar arası bağlantılar, medya dosyaları, PDF'ler vb. dahil) güncellenmelidir.

Tamam, görünüşe göre konuyu derinlemesine tartıştık. Şimdi sorunu bir kez ve herkes için nasıl çözeceğimize bakalım. Her zaman olduğu gibi kurtarmamız gereken bir WordPress eklentimiz var!

Velvet Blues Güncelleme URL'leri

• Öncelikle, Velvet Blues Güncelleme URL'lerini indirin ve yükleyin
• Etkinleştirmenin ardından, eklenti ayarlarını yapılandırmak için WordPress Pano Araçları > URL'leri Güncelle sayfasına gidin.

Microsoft Word Bul ve Değiştir özelliğini nasıl kullandığımızı hatırlıyor musunuz? Eh, bu aslında eklentinin yaptığı şey! Bu sayfa veya post içeriğinde eski URL'leri bulur ve yeni URL'ler ile değiştirir. Bu şekilde, resim bağlantıları tüm gönderilerinizde güncellenir.

Ayrıca, site bağlantılarında, alıntılarda, eklerde, özel alanlarda ve meta kutularda URL'leri bulmak/değiştirmek için eklentinin işlevselliğini genişletebilirsiniz.

Aşağıda sitenizdeki eski URL'ler için birkaç örnek verilmiştir:

• Bir hazırlama sunucusundan taşınıyor olsaydınız, Eski URL şöyle olurdu: hostname.com
• Alan adını değiştiriyorsanız/güncelliyorsanız, yeni site adınızı kullanmanız yeterlidir.
• Protokol olarak 'https' kullandıysanız, 'http'yi 'https' ile değiştirin.

Örneğimizde, http://seomoz.com olan eski URL'yi https://moz.com olarak değiştirdik . Eski ve yeni URL'yi girdikten sonra, URL'leri ŞİMDİ Güncelle seçeneğine tıklamanız yeterlidir. Eklenti, tüm gönderilerinizi ve sayfalarınızı tarayacak ve bul ve değiştir sihrini uygulayacaktır. Tüm URL'leriniz Yeni URL değerine güncellenecek

Dikkatli Kelime: Birden çok gönderiyi ve sayfayı taramak ve değiştirmek, özellikle WordPress blogunuzda yüzlerce gönderi varsa, kaynak yoğun olabilir. Tüm tarama seçeneklerini (site bağlantıları, alıntılar vb.) seçtiyseniz, kaynak kullanımı önemli ölçüde ölçeklenir. Site genelindeki birçok URL güncellemesi, aşırı kaynak kullanımı nedeniyle barındırma hesabınızın geçici olarak askıya alınmasına neden olabilir. Bu sorun en çok paylaşılan barındırma sağlayıcılarında yaygın olacaktır. Bu nedenle eklentiyi çalıştırırken biraz dikkatli olmanızı tavsiye ederim.

2. İpucu: WordPress'te Dış Görüntüleri İçe Aktarma

Dış görüntüler, sunucunuzda barındırılmayanlardır. Bu eğitimde, tüm harici görüntüleri kendi WordPress sitenize nasıl hızlı ve verimli bir şekilde içe aktaracağınızı öğreneceğiz.

Netlik için, görüntüleri uygun lisanslarla kullandığımızı varsayalım (aksi takdirde tamamen farklı bir tartışmaya girebiliriz!).

Hızlı bir şekilde özetlemek gerekirse, WordPress sitemizde harici görselleri kullanmamamız için iki neden:

• Diğer insanların bant genişliğini tüketiyorlar ki bu gerçekten adil değil.
• Görsel SEO puanlarımızı incitti.

Aşağıdaki yazıya bir göz atalım. Görsel Düzenleyiciyi kullanarak gönderinin harici bir resim kullanıp kullanmadığını anlamak oldukça zordur.

Elbette, WordPress düzenleyicisinin Metin görünümüne geçmedikçe.

Bu görselin aslında popüler bir görsel barındırma sitesi olan imgur.com'da barındırıldığını görüyoruz. Bunu düzeltmek için yapmamız gerekenler:

• Resmi indir
• WordPress'e yükleyin
• Yazıdaki bağlantıyı güncelleyin

Tüm gönderiler için her resim için tüm bu adımları tekrarlamayı hayal edebiliyor musunuz? Yalnızca tüm harici görüntüleri bulmak günler sürer! Yani bir çözüm olmalı, değil mi? Yoksa bunu seni hayal kırıklığına uğratmak için mi açıyorum?

Tabii ki değil! Bir çözüm var. Ve her zaman olduğu gibi harika bir ücretsiz WordPress eklentisi.

WordPress'te Dış Görüntüler Nasıl İçe Aktarılır

Bu eklenti hakkında sevdiğim ilk şeylerden biri onun adı. Açık, net ve konuya yönelik. Başlamak için, Dış Görüntüleri İçe Aktar eklentisini indirin ve yükleyin. Eklentiyi etkinleştirin ve WordPress Kontrol Paneli > Medya > Resimleri İçe Aktar'a gidin

Bunun gibi bir seçenek paneli görmelisiniz:

Sağ alt köşede fark ederseniz, eklentinin harici görsel içeren gönderileri zaten tanımladığını göreceksiniz.

Örneğimizde, bu eklentiyi bir hazırlama ortamında çalıştırdık, bu yüzden bir harici görüntü ile sadece bir gönderiye sahibiz.

Şimdi tek yapmanız gereken işlemi başlatmak için Resimleri Şimdi İçe Aktar'a tıklamak. Tamamlandığında, içe aktarılan toplam görüntülerin benzer bir onay mesajını görmelisiniz.

İsteğe bağlı olarak, resimleri alan adına göre hariç tutmayı da seçebilirsiniz. Değiştirmek istemediğiniz özel resim indirme bağlantılarınız varsa (Photobucket gibi ücretli harici resim barındırma sitelerinden) bu yararlıdır.

Görüntü içe aktarma işlemi tamamlandıktan sonra, medya galerisini kontrol edersek, içe aktarılan tüm görüntüleri görürüz.

Tamam, resimler WordPress Medya Galerisi'ne aktarılıyor. Peki ya yazı içeriği? Hala eski resim URL'sini gösteriyorlar mı? Kesinlikle hayır!

Eklenti ayrıca resim dosyasının bağlantısını yeni URL, yani alan adınızın bağlantısı ile değiştirir!

Performans Etkisi: URL güncelleme eklentisinde tartıştığımız kaynak tüketimi sorunlarına benzer şekilde, WordPress'te harici görüntüleri içe aktarmak da sunucu kaynaklarının adil payını tüketir. Neyse ki geliştirici, sunucu kullanımını kontrol etmek için önlemler aldı. Eklenti, arama başına en fazla 50 gönderiyi tarar (yani, eklentinin ayarlar sayfasını ziyaret ettiğinizde veya yenilediğinizde). Ayrıca, içe aktarma çağrısı başına maksimum görüntü sayısını 20 ile sınırlar.

3. İpucu: WordPress'te Görüntü Bağlantısı Nasıl Engellenir

Basitçe söylemek gerekirse, hotlinking, başka birinin Uber rezervasyonuyla şehri dolaşmak anlamına gelir. Bunu düşün. İşe gidip gelmek için bir Uber rezervasyonu yaparsınız ve bir yabancı bir şekilde rezervasyonunuzu çalmayı ve istediği gibi kullanmayı başarır. Yolculukları için para ödüyorsun. Şimdi, birinin Uber rezervasyonunuzu alabildiğini – dilediği gibi kullanabildiğini – ne kadar süre isterlerse – hayal edin ve bu konuda hiçbir şey yapamazsınız.

Eh, görüntü hotlinking biraz benzer. İnsanlar fotoğraflarınızı çeker ve sitelerinde kullanır. Şöhret kazanırlar ve sonunda faturalarını ödersiniz. Ve bu konuda yapabileceğin hiçbir şey yok.

Devam etmek! Son satır doğru değil. Bu konuda bir şeyler yapabilirsiniz . Sonuçta, bu WordPress! Muhtemelen “Ah Sourav başka bir eklenti tanıtacak” diye düşünüyorsunuz. Bazzinga! Değilim.

1. Web Sunucunuzu Hotlink Önleme (Apache veya NGINX) için yapılandırın

Web sunucunuz başkalarının resimlerinizi beğenmemesi için yeterlidir. En yaygın iki web sunucusu Apache ve NIGNX'tir. Web sunucunuz olarak Apache kullanıyorsanız, .htaccess dosyanıza birkaç satır kod ekleyerek WordPress'te görüntü bağlantılarını önleyebilirsiniz. 2013'te bununla ilgili kısa bir eğitim yazmıştım – bugün hala geçerli.

Ancak, wes sunucunuz olarak NGINX kullanıyorsanız, NGINX yapılandırma dosyanıza aşağıdaki kod parçasını ekleyin.

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

yourwebsite.com'u gerçek alan adınızla değiştirin.

Özetle, bu kod parçacığı GIF, PNG ve JPG/JPEG dosyalarının hotlink'e bağlanmasını önler. Bu dosyalara yalnızca sizin alanınız erişebilir, başka kimse erişemez. Birisi bu 3 dosya formatına bağlantı kurmaya çalışırsa, 403 hatası alır.

İşte alınan kodun satır satır hızlı bir açıklaması.

1. Satır 1, görüntü biçimlerini tanımlar. Buraya mp4 gibi video formatlarını da ekleyebilirsiniz.
2. Satır 2, NGINX'e alanınızdan gelen isteklere izin verilmesi gerektiğini söyler. Başka bir etki alanı isterse, isteği engelleyin.
3. 3. satır, izin verilmeyen bir alan adından bir istek gelirse NGINX'e ne yapması gerektiğini söyler
4. 4. satır, 3. satırdaki koşul karşılanırsa NGINX'e bir HTTP 403 Yasak hatası atmasını söyler.
5. 5. ve 6. satırlar kodu düzgün bir şekilde kapatır, böylece yürütülür!

Benzer şekilde, tüm bir dizinin hotlink'e bağlanmasını önlemek istiyorsanız, bunun için de bir kod parçacığı vardır.

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

/uploads/'ı, bağlantı kurulmasını önlemek istediğiniz diziyle değiştirin. Örneğimizde, varsayılan WordPress yükleme dizinini seçtik. Çoğumuz gibiyseniz, tüm resimlerinizi, PDF'lerinizi ve diğer medya dosyalarınızı varsayılan WordPress yükleyicisini kullanarak yüklersiniz, bu da dosyaları /uploads/ klasörüne yerleştirir. Böylece, ana klasörü koruyarak tüm yüklemelerin hotlink'e bağlanmasını önlüyoruz.

2. WordPress'te Görüntü Bağlantısını Önlemek için bir CDN kullanın

Şaşırmış? Ben de ilk okuduğumda öyleydim. Hepimiz CloudFlare'i en iyi ücretsiz CDN'lerden biri olarak duyduk. Ücretsiz hotlink koruması da sunduklarını biliyor muydunuz?

Hotlink korumasını etkinleştirmek için CloudFlare hesap panonuza gidin ve ardından Scrape Shield'e gidin. Düğmeyi AÇIK konumuna getirin ve hazırsınız.

Cloudflare kullanıyorsanız, hesabınızdaki Scrape Shield altında hotlink korumasını kolayca etkinleştirebilirsiniz. Cloudflare tam bir proxy hizmeti olduğundan, kaynak sunucunuzda hotlink korumasını etkinleştirme konusunda endişelenmenize gerek yoktur.

StackPath CDN veya KeyCDN gibi premium bir CDN hizmeti kullanıyorsanız, tek yapmanız gereken bölge yönlendiricileri için uygun kurallar oluşturmak ve bunları uygulamaktır. KeyCDN'nin bu konuda harika bir öğreticisi var, okumaya değer.

3. Bir Eklenti Kullanın: Hepsi Bir Arada WP Güvenlik ve Güvenlik Duvarı Eklentisi

.htaccess koduna karışmamayı tercih ediyorsanız ve işlerinizi halledebilecek bir eklentinin olmasını diliyorsanız, şanslısınız.

Hepsi Bir Arada WP Güvenlik ve Güvenlik Duvarı eklentisine göz atın. Yarım milyondan fazla aktif kurulumla bu eklenti, tonlarca temel WordPress güvenlik özelliğine sahiptir.

İşte Image Hotlinking Prevention özelliğini etkinleştirmek için yapmanız gerekenler.

• Eklentiyi indirin ve kurun.
• Etkinleştirin ve WordPress Dashboard > WP Security > Güvenlik Duvarı'na gidin ve Hotlinks Engelle'ye tıklayın.
• Alttaki küçük onay kutusunu işaretleyin ve Ayarları Kaydet'e tıklayın.

Ve bu kadar. Görüntü hotlinking bundan böyle engellendi.

Çözüm

Bu gönderiyi tamamlamak için, şu ana kadar öğrendiklerimizi hızlıca gözden geçirelim.

1. Nasıl güncellenir, bunun yerine eski URL'leri yenileriyle değiştirin. Çözüm, Velvet Blues Güncelleme URL'leri adlı şık bir eklentidir.
2. Ardından, harici görüntüleri WordPress'e nasıl aktaracağımızı öğrendik. Birçok blogcu, hayatlarında en az bir kez bunu yaptı! Yine çözüm, Dış Görüntüleri İçe Aktar adlı bir eklentideydi.
3. Yukarıdaki iki senaryoda bahsedilen eklentilerin her ikisi de kendileriyle ilişkili bir performans etkisine sahiptir. Bu eklentiyi dikkatli bir şekilde çalıştırmamız gerekir.
4. Son olarak, görüntü bağlantısının ne olduğuna baktık ve bunu önlemenin iki yolunu gördük. Biri .htaccess eklentisine birkaç satır kod eklemek, ikincisi ise bir güvenlik eklentisi kullanmaktı.

Soru – bu ipuçları hakkındaki düşünceleriniz nelerdir? Yararlı bir şey buldunuz mu? Sunacak daha iyi bir şeyin var mı? Ayrıca şu ana kadar diziyi nasıl buldunuz? Aşağıdaki yorumlarda bize bildirin ve dizinin bir sonraki bölümü için bizi izlemeye devam edin.