Gönderilerinizde ve sayfalarınızda kullanmak için görüntü çekimlerinin bir kütüphanesi nasıl yapılır
Birçok WordPress web sitesi, yayınlarında ve sayfalarında bir yerde özel kodlar veya işlevler kullanır. Platform bu kodu eklemeyi kolaylaştırır, ancak snippet’leri sitenizdeki yeniden kullanacaksanız, ihtiyacınız olduğunda kodu manuel olarak eklemek zor olabilir. Kod snippet’inizi her zaman ellerinizle eklemek yerine, bir eklenti kullanarak ayarlamak ve saklamak daha mantıklıdır. Bu makalede, kod fragmanınızı düzenli tutmanın avantajları hakkında konuşacağız, ardından Snippet Genişletilmiş Kod eklentisini iki adımda kullanarak nasıl yapacağınızı göstereceğiz. Hadi çalışalım!
Neden Kod Salyangozunuzu ayarlamalısınız?
Birçok WordPress kullanıcısı yayınlarına ve sayfalarına özel kod görüntüleri ekler. Niş ve boyutunuz dışında, sitenize küçük bir kod eklemeniz gereken birçok durum vardır. Örneğin, her ikisi de çalışmadan önce web sitenize birkaç JavaScript satırı eklemenizi gerektiren Google Adsense veya Facebook Pixel’i ele alalım. Birçok WordPress eklentisi de kısa kodlar kullanmanızı gerektirir, bu nedenle web sitenize özel kodlar ekleme olasılığı yüksektir.
Bunu göz önünde bulundurarak, sitenizde kullandığınız tüm kod parçalarını saklamanın yollarını bulmak iyi bir fikirdir. Sebep bu:
Gerektiğinde kodunuza başvurabilirsiniz. Bazen, dosyanıza hangi özel kod satırlarını eklediğinizi unutabilirsiniz, bu nedenle snippet’lerinizi kütüphaneyi kullanarak ayarlamak iyidir. Kod snippet’ini daha kolay kullanabilirsiniz. Aynı kodu birkaç kez kullanmanız gerekiyorsa, daha sonra kullanım için kaydetmek mantıklıdır.
Elbette bilgisayarınızda veya bulutta sıradan metin dosyalarını kullanarak kod parçacıklarını kaydedebilirsiniz. Ancak, doğru WordPress eklentisini kullanmak, sitenizde saklamak için size daha uygun bir yol verebilir. Bu şekilde, kullandığınız her web sitesine hangi koda eklediğinizi bileceksiniz.
Kod Uzatma Uzatma eklentisinin tanıtılması
Snippets Genişletilmiş Kod eklentisi, WordPress’te basit bir kod kitaplığı ayarlamanızı sağlayan çekici bir araçtır. Bu, özel bir kodu kaydetmenize, istediğiniz adı kullanarak tanımlamanıza, ardından birkaç tıklamayla yayınlarınızdan ve sayfalarınızdan birine eklemenizi sağlar. Ayrıca, bu eklenti, basit bir JavaScript veya CSS olduğu sürece kod örnek efektinizin önizlemesini görmenizi sağlar. Ayrıca PHP’yi destekler, ancak görüntüler genellikle aracın işlevselliği kullanılarak düzgün görüntülenmez. Eklenti bir bütün olarak Divi Builder ile iyi işlev görürken, çözüm gerektiren bir sorun vardır. Varsayılan olarak, bu araç, yayınınıza veya sayfanıza herhangi bir kütüphane görüntüsü eklemenizi sağlayan düzenleyiciye yeni bir düğme ekler. Ancak, Divi oluşturucuya geçerken düğme kayboldu. Gelişme basit ve bir dakika içinde daha fazla keşfedeceğiz. Ana Özellikler: Tüm özel kod snippet’lerinizi kontrol panelinizdeki merkezli kitaplığa kaydedin.
Her snippet’in benzersiz bir ad kullanarak tanımlanması.
Kütüphanenizdeki her öğe için kullanımı kolay kısa bir kod ayarlayın.
Kod’a dokunmak zorunda kalmadan WordPress düzenleyicisinde yeni bir seçenek kullanarak yayınınıza ve sayfanıza görüntüler ekleyin.
Fiyat: Ücretsiz | Daha fazla bilgi
Gönderinizde ve sayfalarınızda (2 adımda) kullanılacak örnekleri gönderme kütüphanesi nasıl başlamadan önce, eklentiyi yüklemeli ve etkinleştirmelisiniz. Hazır olduktan sonra, bir numaraya atlayın! Adım #1: Kütüphanenize yeni bir snippet ekleyin Bir eklenti yükledikten sonra, WordPress gösterge panelinizde snippet adlı yeni bir sekme göreceksiniz. Seçenekleri tıklayın ve arayın Snippets ekleyin. Bir sonraki ekranda, kodunuzu kitaplığında tanımlamak için bir ad ayarlayabilir ve kodun yürütülebilmesi için gereken herhangi bir medya dosyasını yükleyebilirsiniz:
Unutmayın – medya kütüphanenizde olduğu sürece, bu sayfadan gerekli ortamı yüklemeseniz bile kod yine de çalışacaktır. Bu özellik yalnızca sayfanın altındaki Test düğmesini kullanarak kod efekizin önizlemesini görebilmeniz için mevcuttur.
Ardından, CSS, JavaScript, PHP ve JQuery kodlarını yazdığınız düzenleyiciyi de göreceksiniz. Ancak, her dil için özel bir etiketle sarılması gerekir. Referanslar için bazı hızlı örnekler: & lt; stil & css bu etiketler arasında gidiyor. ? & gt; & quot; & quot; text/javascript & quot; & gt; Aynı şey bu etiket türünü kullanan JavaScript için de geçerlidir. & lt;/script & gt;
& lt; Script türü = & quot; text/javascript & quot; & gt; jQuery (işlev ($) {
$ (belge) .Ready (function () {
// jQuery en karmaşık etiketleri kullanır – tam olarak gösterildiği gibi ayarlanmaları gerekir ve herhangi bir kod bu bölüme girmelidir.
});
});
& lt;/script & gt;
Yeni snippet’ler eklediğinizde tüm bu etiketlere editör altına başvurabilirsiniz ve her dilin farklı bir dil gerektirdiğini hatırladığınız sürece, bunu hatırlamanıza gerek yoktur. Ayrıca, her etiketi kullanarak aynı snippet’te birkaç dil kullanabilirsiniz.
Kodunuzu yazmayı veya eklemeyi bitirdikten sonra, sayfanın altındaki Örnek Kaydet düğmesini kullanın; WordPress Gösterge Tablonuzdaki Snippet sekmesinde görünecektir:
Şimdi, geriye kalan tek şey WordPress ve Divi Builder editörünü kullanarak yeni snippet’lerinizi test etmek. Adım #2: Snippet’inizi Divi Gönder ve Sayfanıza yerleştirin Divi Builder kullanmıyorsanız, yayınlarınızdan veya sayfalarınızdan birini sıradan bir WordPress düzenleyicisi kullanarak açabilirsiniz. Üstte yeni snippet ekleme düğmesini göreceksiniz:
Buna tıklamak, kütüphanenizdeki tüm öğeleri görüntüleyen kaplamayı getirecek ve hangisini istediğiniz birini seçebilirsiniz: Şimdi eklenti düzenleyiciye bir kod ekleyecek ve bu kadar basit – hazırsınız. Ancak, Divi Builder kullanıyorsanız, bu seçeneğe erişemezsiniz. Bu sorunun üstesinden gelmenin en kolay yolu, pano görüntüleri sekmenizi yeni bir pencerede açmak ve eklemek istediğiniz kod için uygun kısa bir kodu kopyalamaktır. Var olduktan sonra, Divi Builder’a dönün ve üzerinde çalıştığınız sayfaya kod modülünü ekleyin:
Girdikten sonra kısa kodunuzu içerik alanına yapıştırın ve değişikliklerinizi kaydedin:
Makale Küçük Resim Andrii Bezvershenko / Shutterstock.com.