Özel CSS ile temanızı nasıl ayarlayabilirsiniz?
Sitenizin tasarımı üzerinde tam bir kontrol mi istiyorsunuz? WordPress için kullanımı kolay birçok ayar aracı olmasına rağmen, küçük bir CSS size gerçekten yardımcı olabilir. Örneğin, yazı başlığı yazı tipinin boyutunu artırmak veya bağlantınızın rengini değiştirmek isteyebilirsiniz. Çok basit bir şey için tamamen yeni bir eklenti kurmak aşırı görünüyor. CSS çözümdür. Birkaç sıra CSS ile küçük kuvvet ayarlarını hızlı bir şekilde işleyebilirsiniz. Ve bu bir kod olmasına rağmen, JavaScript veya PHP gibi bir programlama dili kadar karmaşık değildir. Burada ve orada küçük bir CSS yazdıysanız, bu kılavuzdan birçok fayda elde edersiniz, ancak yeni başlayanlar bile burada bazı pratik ipuçları bulabilir.
SHHH! Müşteri rekabet eden bir temaysanız sonuna kadar okuyun. Sizin için bir freebie bonusu var (yeni başlayanlar için çok yararlı).
İçindekiler tablosunu gizle
CSS’ye kısa bir giriş
WordPress sitenize CSS nasıl eklenir
En iyi yol
CSS Seçmenleri Nasıl Bulunur
WP Pro CSS seçmenlerini nasıl bulabilir
Mülk ve CSS değeri
CSS ön yazma kullanıcılarımız için ücretsiz
Çözüm
CSS’ye Kısa Bir Giriş CSS’ye alışkınsanız, sizi uzun bir resimle rahatsız etmek istemiyorum. CSS ile hiç çalışmadıysanız veya CSS’nin ne olduğundan bile emin değilseniz, lütfen önce bu konuyla ilgili makalemize bakın:
CSS nedir ve WordPress’i nasıl etkiler? CSS’nin siteyi organize etmek için neden kullanıldığının temellerini ve nasıl uygulandığını içerecektir. WordPress sitenize CSS nasıl eklenir WordPress kullanıcıları tarafından sadece CSS kullanan büyük bir hata vardır: Tema dosyasını ayarlarlar. Örneğin, Challenger temasını kullanan biri, CSS düzenlemesini doğrudan görünümden erişilen style.css dosyasına yerleştirebilir. WordPress Menüsü Artık Style.css dosyasını düzenleyerek burada sorunu düzenlememeniz için uyarıda bulunmayan bir bildirim içeriyor. Challenger’ı yeni sürüme güncellerseniz tüm değişikliği kaybedeceksiniz mi? İnanın bana, bunu yapması uzun süren kod değişikliklerini kaybetmek çok hayal kırıklığı yaratabilir.
Bu genellikle özelleştiricinin son kısmıdır Bu bölümü açarsanız, kodunuzu ekleyebileceğiniz metin alanını görürsünüz. WordPress burada birkaç ipucu içerecektir, ancak silmek için kapak bağlantısını tıklayabilir ve yalnızca kod girişini görüntüleyebilirsiniz.
Çok daha üretken bir süreç sunmama izin verin. WP Pro CSS seçmenlerini nasıl bulur CSS yazarken, önce hangi öğe tarayıcısını düzenlemek istediğinizi söylemek için seçmenlere ihtiyacınız var. Temanızdaki stil sayfasını kontrol edebilmenize rağmen, web tarayıcı geliştiricinizi bulmak için çok daha kolaydır. Aşağıda bir örnek şu: Bu, açık geliştirme aracındaki her öğenin sınıfını ve kimliğini görebileceğiniz açık bir geliştirme cihazına sahip bir krom ekran görüntüsüdür. Daha sonra kendi özel seçmenlerinizi yazmak için mevcut sınıf ve kimlik kombinasyonunu kullanabilirsiniz.
Bu öğreticide bu süreçten daha derin bir ayrıntıya girdim: CSS seçmenlerinin WordPress sitesinde nasıl bulunur bir tarayıcı geliştiricisine nasıl erişeceğinizi, HTML’nin nasıl gezineceğini ve ihtiyacınız olan CSS seçmenlerini nasıl bulacağınızı öğreneceksiniz. Mülkiyet ve CSS değeri Artık istediğiniz seçmenleri almak için daha hızlı bir yolunuz var ve kodu ayarlamadaki ek CSS bölümüne nasıl ekleyeceğinizi biliyorsunuz, kalan tek kişi değiştirmek istediğiniz mülkü seçmektir. Örneğin, Challenger’daki site başlığını hedeflemek ve daha büyük bir yazı tipi yapmak istiyorsanız, yazı tipi boyutu özelliği ile yapabilirsiniz. CSS ifadeleri şöyle görünebilir:
. Başlık sitesi {
} CSS’ye aşina değilseniz, CSS özelliklerinin bu listesinin çok yararlı olduğunu göreceksiniz. Düzenlemek istediğiniz herhangi bir kalite (arka plan rengi, yazı tipi boyutu, sınırlar vb.) İçin bu listeyi arayabilirsiniz. CSS ön yazma başlangıç kullanıcılarımız veya Master CSS için ücretsizdir, hoşuna gideceğinizi düşündüğüm bir şey var … Temalarımızdan birini kullanırsanız, yaptığımız ön yazma CSS görüntülerini seveceksiniz. Örneğin, CSS Tracks Snippet koleksiyonu, sitenizi ayarlamak için ek CSS bölümüne kopyalayıp yapıştırabileceğiniz bir düzine snippet’e sahiptir: Bu, daha önce hiç CSS yazmamış olsanız bile sitenizi CSS ile ayarlamayı çok kolaylaştırır. İstediğiniz herhangi bir fragmanı kopyalayıp ekleyin ve ardından değeri istediğiniz her şeye değiştirmeniz. Temanız için CSS görüntülerini bulmak için destek merkezini ziyaret edin ve kullandığınız temayı seçin. Ardından, yan çubuğun altındaki CSS görüntüleri düğmesini tıklayın:
Hangi tema için bir sonraki sayfada önceden yazılmış birçok görüntü bulacaksınız. Sonuç Tüm kullanıcıların Master CSS olmak için temalarla rekabet etmesini beklemiyorum ve hala WordPress’in temellerine hakim olan biri için, bu öğreticinin ne kadar korkutucu olduğunu anlıyorum.
