Divi Blog Gönderi formatına özel bir şablon ve tasarım nasıl eklenir (Bölüm 1/3)
Divi Blog Gönderi formatına özel stil ekleyeceğinizle ilgili dizimizde 3’ün 1. gününe hoş geldiniz. Varsayılan olarak Divi, altı blog yayın formatı ile birlikte gelir: standart, video, ses, alıntı, galeri ve bağlantılar. Bu seride size PHP ve CSS olarak nasıl ayarlayacağınızı öğretiyoruz.
Önümüzdeki 3 gün boyunca, tüm Divi blog yayın formatlarını ayarlamanız için size rehberlik edeceğim: standartlar, teklifler, bağlantılar, videolar, ses ve galeri. Tüm bunları düzenlemek (aklımda tasarım için) tek bir.php şablon dosyasını düzenlemeyi gerektirir. Bunu doğru bir şekilde yapmak için, değiştirilmiş tek bir.php şablon dosyası içerecek bir Divi alt teması oluşturmalıyız. Ve bunu yapmadan önce, bir masaüstünü kullanarak yerel bir WordPress kurulumu oluşturmalıyız. Bu, doğrudan web sitesinde hiçbir şey riske atmadan oynamamız için güvenli bir geliştirme alanı sağlayacaktır.
Bu yazının başlığı ile önerildiği gibi, her şeyi baştan sona tartışmak için üç güne ihtiyacımız var. Bugün, bir masaüstünü kullanarak yerel bir WordPress kurulumunun nasıl oluşturulacağını göstereceğim ve değiştirilen bir blog yayınının biçimini karşılamak için kullanacağımız bir alt tema oluşturacağım. Bu serinin burada yayınlanan çoğu öğreticiden daha “gelişmiş” olduğunu varsayacağım. Bununla birlikte, yeni başlayan biriyseniz, bu dizi aslında geliştirme becerilerini geliştirmeniz ve güvenli, ücretsiz ve rehberli bir gönderi dizisinde yeni bir şeyler geliştirmeniz için harika bir fırsattır.
Başlayalım! Buraya ne geleceğine dair bir bakışta, bu dizide başaracağımız tasarıma bir bakış. Onlara temel oluşturduktan sonra, bugünkü gönderiye girdikten sonra, single.php dosyasını (tüm blog yazısı formatlarımız için şablon) nasıl düzenleyeceğinizi ve ardından her format için şablonu CSS ile nasıl düzenleyeceğinizi göstereceğim. Bu eğlenceli bir yolculuk olacak! Geliştirme varlıklarınızı hazırlamak, önümüzdeki 2 gün boyunca yaptığım bugünün öğreticileri ve öğreticileriyle birlikte takip etmeniz gereken şeydir: Atomlar, yüce, parantez veya not defteri ++ gibi kod editörleri (ne istersen)
Desktopserver kullanarak yerel WordPress kurulumu (zaten sahip olmadığınız sürece)
Yapacağımız divi çocukların teması!
Bu diziyi takip edecekseniz, bunu sadece test ve geliştirme için hazırlanan WordPress kurulumunda yapmanızı şiddetle tavsiye ederim. İstediğim son şey, insanların doğrudan web sitelerini denemeleri ve bir şeyi bozması.
WordPress yerel geliştirme kurulumunu nasıl ayarlayacağınızdan emin değilseniz, DesktopServer’ın ücretsiz sürümünü kullanmanızı öneririm. Hazır olmalısınız ve sadece birkaç dakika içinde yerel bir WordPress kurulumuyla yürümelidir (aşırı değil). Bilgisayarınızda bir masaüste bir masaTOPSERVER hazırlamak, bir masaTOPSERVER ile başlamak için bazı adımlardır. Web sitelerini ziyaret edin ve sağ sütundaki “Ücretsiz – Sepete Ekle” düğmesini tıklayarak ücretsiz sürümü indirin.
Ödeme sayfasında kişisel bilgilerinizi doldurun, gereksinimlerini kabul edin ve Satın Al’ı tıklayın. Satın Alma Onayı sayfasında, işletim sisteminiz için doğru indirmeyi seçin. Mac veya Windows’un en son sürümünü yüklemenizi öneririm. İndirme Zip’inizi açın ve uygulamayı bilgisayarınıza çalıştırın. Artık “XAmpplite” adlı bir klasörde bir masaüstünde bir masaüstü uygulaması bulabilirsiniz. Bir masaüstü yükleni yükledikten sonra, yerel WordPress kurulumunuzu hazırlayarak başlamanıza yardımcı olmak için talimatlarını okuyun. Divi Çocuk Teması Bu Seri için Bir Divi Çocuk Teması oluşturmak için WordPress Tema Dosyaya erişmeniz gerekir. Bir DesktOpServer yüklerken varsayılanı izlerseniz, tema dosyanız “Web Sitesi” etiketli klasörde belge klasörünüzde olmalıdır. Tema klasörünü bulun ve “Çocuklar” adlı yeni bir klasör ekleyin.
Şimdi Style.css dosyanızı çocuğunuzun tema klasörüne ekleyeceksiniz. Bu, çocuğunuzun temasını oluşturacak 3 dosyanın ilkidir. Metin düzenleyicinizi açın ve belgenin en üstünde aşağıdaki CSS başlığı ile yeni bir dosya oluşturun. /*
Tema Adı: Divi Child URI teması:Açıklama: Divi Çocuk Teması
Yazar:
Yazar Uri:
Şablon: Divi
Sürüm: 1.0.0
Lisans:
Lisans Uri:
Etiketler:
Metin alanı:
*/
Sitenize uygun olarak Children’ın tema CSS başlığına başka bilgiler ekleyebilirsiniz.
Yeni dosyanızı “style.css” adıyla ve uzantısı ile kaydedin. Ve Child Tema Klasörüne ekleyin:
Çocuğunuzun tema klasörüne eklemeniz gereken bir sonraki dosya, functions.php dosyasıdır. Metin düzenleyicinize geri dönün ve başka bir yeni dosya oluşturun ve belgenin en üstüne aşağıdaki PHP kodunu ekleyin: <? PHP
İşlev my_theme_enqueue_styles () {$ parent_; wp_enqueue_style ($ parent_style, get_template_directory_uri (). ‘/style.css’);
wp_enqueue_style (‘çocuk tarzı’,
get_stylesheet_directory_uri (). ‘/style.css’,
dizi ($ parent_style),
wp_get_theme ()-> get (‘sürüm’)
);
}
Add_action (‘wp_enqueue_scripts’, ‘my_theme_enqueue_styles’);
?>
Dosyaları doğru ad ve uzantılı “function.php” ile kaydedin ve çocuğunuzun klasörüne ekleyin:
Çocuğunuzun teması için ihtiyacınız olan son dosya single.php divi dosyasıdır. Style.css çocuğunuza yeni bir CSS eklemenin yanı sıra, çeşitli yayın türleri için düzeni düzenlemek için single.php divi dosyasının bir kopyasını kullanacağız. Single.php dosyasını bulmak için Divi (üst) tema klasörünü açın.
Single.php dosyalarını kopyalayın ve çocuğunuzun tema klasörüne sadık kalın: Şimdi single.php dosyasında ayarlamalar yapmaya hazırız. Single.php şablon dosyasını ayarlamaya başlamadan önce yeni çocuk temanızın temasını etkinleştirin, yeni alt temanızı etkinleştirin ve etkinleştirin. WordPress kontrol panelinden, görünüm → temaları açın ve Divi Child adlı yeni çocuk temanızdaki Etkinleştir düğmesini seçin. Şimdilik bu kadar! Bunun çok ilginç olmadığını biliyorum, ama umarım hala benimle olacaksın. Projeniz için doğru temeli koymak önemlidir ve bu yazı başlamak için iyi bir yerdir. Yarın ne var? Şimdi yerel WordPress kurulumu ve çocuğunuzun teması etkinleştirildiğinde, bu serinin bir sonraki bölümüne hazırsınız. Yarın size blog yayın formatınız için gerçekten benzersiz bir düzen oluşturmak için single.php divi dosyalarını nasıl düzenleyeceğinizi göstereceğim.
