Eklentilere özel CSS stilleri eklemenin güvenli yolu
Bu sana hiç oldu mu? Eklentiyi yüklersiniz. Bu, aradığınız doğru işleve sahiptir. Ama … bu doğru görünmüyor. Tüm ayarları değiştirdikten sonra bile, temanızın stiliyle hala eşleşmez. Yani, ne kadar iyi çalıştığına bakılmaksızın, biraz mutsuzsunuz veya onu yana atarsınız ve başka bir şey kullanırsınız. Eğer öyleyse, eklentinizi düzenlemek için özel bir CSS kullanarak her iki dünyadan da en iyi şekilde yararlanabilirsiniz. Özel CSS stili, geliştirici eklenti ayarlarına kuvvet seçeneğini oluşturmamış olsa da, eklentinin görüntülenmesini değiştirmenizi sağlar.
Bu yazı size böyle bir stili nasıl doğru ekleyeceğinizi göstermekle ilgilidir, bu nedenle temanızı güncellemeniz veya değiştirseniz bile her zaman güvende tutacaksınız. CSS Force Custom = Özel bir CSS eklenti kuvvetinin görünümü üzerinde daha fazla kontrol, eklentinizin görünümünü geliştiricinin eklenti seçeneğine eklediklerinin bir dışında manipüle etmenizi sağlar. Şu anda, birçok premium eklenti ayrıntılı stil seçenekleri içerir, ancak bu durumda ücretsiz eklentiler her zaman kapsamlı değildir (eğer dahil ederlerse). Oradaki en popüler eklentilerden birini alın: Form 7 ile iletişime geçin. Bu, yapılandırmanın çok az yolunu sunar. Ancak, özel bir CSS kullanarak, form ekranının her yönünü tam olarak değiştirebilirsiniz.
Ayrıca, ayrıntılı seçeneklere sahip eklentiler bile her zaman değiştirmeniz gereken her stil öğesini değiştirme yeteneği vermez. Bu nedenle, küçük bir CSS inceleyerek ve temanıza CSS’nin güvenli bir şekilde nasıl ekleneceğini nasıl ekleyerek, eklentinizin okuyucunuza nasıl görüntülendiğine dair tamamen yeni bir güç seviyesi elde edersiniz. CSS eklenti stilini eklemek istemediğiniz doğru şekilde özel CSS eklemek neden önemlidir. Nick’in çocuk temaları hakkındaki yazısında belirtildiği gibi, WordPress’e CSS eklemenin doğru yolu ve yanlış yolu var. CSS stilini doğru şekilde eklediğinizde, temayı güncelleseniz bile stil her zaman güvenli olacaktır. ve tasarımınızı değiştirmeye karar verirseniz, kopyalamayı ve yeni bir temaya ekleyebileceksiniz. Bunun yerine, bunu eklemek doğru olmayacaktır, tema veya tema geçişi nedeniyle stilinizi kaybetme riski taşır. Şimdi, Divi ve diğer WordPress temaları için CSS eklenti stilini nasıl doğru ekleyeceğimi tartışacağım. CSS eklenti stilini Divi’ye güvenli bir şekilde eklemek için Divi’ye CSS eklenti stilini eklediğinde, önce Divi menünüzde “Tema Seçeneği” sekmesini açmanız gerekir:
Ardından, “Genel” sekmesinde (varsayılan sekme yüklenecek), sayfanın altına doğru kaydırmanız gerekir. Orada, “CSS Kustom” adlı bir kutu bulacaksınız:
Çocuğunuzun temasını ayarladığınızı varsayarsak, görünüm açarak WordPress kontrol panelinizden değiştirebilirsiniz> Düzenleyici: Doğru alt temayı düzenlediğinizden emin olun. Varsayılan olarak Style.css’e gitmelidir. Değilse, tek yapmanız gereken seçeneği tıklamaktır. Ardından, sadece özel CSS eklentinizi tam olarak yukarıdaki Divi kılavuzunda tartıştığım gibi eklemeniz gerekir. İlk olarak, satır boyunca bir kod yorumu yapın: / * Eklenti CSS Styles Buradan Başlayın * / Sonra, tüm özel CSS stillerinizi bu satırın altına ekleyin: Bir çocuk teması üzerinde çalıştığınız için, güncellemeniz bile her zaman güvenli olacaktır. temanız. Ve açıkça yorum yaptığınız için, yeni bir temaya veya farklı WordPress kurulumuna kolayca kopyalayabilirsiniz.
Gerçek Dünya Örnekleri: Gerçekten eve getirmek için İletişim Formu 7, gerçek dünyanın örneklerine bakalım. Yukarıda belirtilen Kontak Form 7 için formu ayarlamak istediğinizi varsayalım. Eklentiyi yüklersiniz ve şuna benzeyen bir form alırsınız:
Şimdi, saha alanına siyah bir sınır ekleyerek biraz renklendirmek istiyorsunuz. Çocuğunuzun tema stili sayfasını açabilir ve bu kodu oluşturduğunuz kod yorumunun altına ekleyebilirsiniz (Talimatlar – Bu yazı, iletişim formlarını yönetmek için iyi bir kaynaktır): .wpcf7 girişi [type = “metin”], .wpcf7 girişi [type = “e -posta”],.wpcf7 Textarea {
Sınır: 1 piksel katı #000000;
}
CSS’niz şöyle görünecek:
Stil sayfasını sakladıktan ve iletişim formunuzu yeniledikten sonra şunu göreceksiniz:
Yeni Siyah sınırına dikkat ediyor musunuz? Sadece bu! Divi kullanıyorsanız, kodunuz sadece farklı konumlarda aynı görünecektir:
Tabii ki, bu biraz deneysel bir düşünce çünkü Divi ile bir iletişim formu eklentisine gerçekten ihtiyacınız yok. Ancak, aynı fikir özel bir CSS stili eklemek için ihtiyacınız olan eklenti ile çalışacaktır! WordPress’e özel bir CSS eklenti kuvveti eklemek oldukça basit bir işlemdir. En zor kısım, hangi CSS kodunu eklemeniz gerektiğini bilmektir. Bir gecede bir CSS uzmanı olmayacaksınız, ancak temel CSS’yi incelemeye başlamak için iyi bir yer W3Schools. Ve hangi eklenti öğelerini hedeflemeniz gerektiğini bulmanın iyi bir yolu Google Muayene Elemanı aracıdır. Sadece unutmayın – her zaman özel CSS eklentinizi yorumlarla işaretlenmiş ayrı bir alana kaydedin. Bu şekilde, her zaman bulabilirsiniz. Divi olmayan bir tema kullanıyorsanız, tüm özel stillerinizi çocuğun temasında sakladığınızdan emin olun. Paylaşım için özel bir eklenti CSS tarzı ipucunuz var mı? Aşağıdaki yorumlarda onları duymak istiyorum! Makale Küçük Resmi Dreamup / Shutterstock.com
