WordPress Eğitimi: HTML’den WordPress teması nasıl yapılır (Bölüm 2)

Bu öğreticinin ilk bölümünde, HTML şablonlarını WordPress temalarına değiştirmenin temellerini tartışıyoruz. Biraz meraklıysanız, HTML şablonlarını PHP dosyalarına ayırma, yeniden bir araya getirme, WordPress temalarını yönetme ve adlandırma hakkında birkaç şey öğreniriz. Gerçekten, çok şey öğrendik ve bu ikinci yemeğin tadını çıkarmak için ilk öğreticimizde tartıştığımız kavramları tanımak isteyeceksiniz. Bugünün gönderisinde daha yüksek şeyler alacağız. Tam çalışan bir WordPress teması oluşturabilmeniz için birkaç alanı daha tartışacağız. Yani, daha fazla uzatmadan, işte burada.
Görüntü Dosyalarını ve JavaScript’i Yapılandırma Orijinal HTML şablonunuzda (index.html) bir görüntü varsa, şablonu bir PHP dosyasına kestikten sonra görüntünün görüntülenmeyi bıraktığını görebilirsiniz. Hiç endişelenme, bu PHP. Örneğin, başlıkta böyle bir logonuz varsa …

… küçük bir kodla oynamanız gerekiyor. Açıklayacağım kod yakında tarayıcının resim klasörünüzde logonuzu (veya diğer resimler) bulmasına yardımcı olacak, bu da (veya yapması gereken) temanızın ana dizininin alt klasörü. Bu nedenle, logonuzu başlık bölümünde görüntülemek için Header.php dosyasını açın ve yukarıdaki kodu aşağıdaki kodla değiştirin:
<img alt = "your_logo_alt_text" src = "<? php echo get_template_directory_uri ();Logonuzu resim klasörüne eklerseniz, kod logoyu alacaktır.Farka dikkat ediyor musunuz?Açıkçası, bu kod indirimi yalnızca logonuzu geliştirecektir.Diğer resimleri geliştirmek için kodu aynı şekilde yeniden yazmanız gerekir.Kolay şeyler.JavaScript'e dönelim.HTML web siteniz JavaScript kullanıyorsa, JS adlı bir klasör oluşturun ve komut dosyasını oraya yerleştirin.Aşağıdaki kodu kullanarak onu header.php dosyasında arayabilirsiniz:
<script type = "text/javascript" src = "/js/example.js”> Yukarıdaki kod örnek. Bölümü JavaScript dosyanızın adıyla değiştirmeyi unutmayın. Tabii ki başkaları için bir tema oluşturursanız, JS dosyanızı wp_enqueue_scripts ile yüklemeniz gerekir. Daha fazla bilgi ve ipuçları için AJ’nin WordPress temasına JavaScript ekleme hakkındaki yayınına bakın. Bu öğreticinin ilk bölümünde şablon dosyası, dizin.php, header.php, sidebar.php ve footer.php adlı dört temel şablon dosyasından bahsediyoruz. Şablon dosyaları web sitenizin web’de nasıl görüntüleneceğini kontrol eder. Şablonlar MySQL WordPress veritabanınızdan bilgi alır ve web tarayıcısında görüntülenen HTML koduna çevirir. Başka bir deyişle, şablon dosyası bir WordPress tema bloğudur. Şablonu daha iyi anlamak için şablon hiyerarşisi olarak bilinen kavramı inceleyelim. Analojiyi kullanacağız. Ziyaretçiler http://www.yoursite.com/blog/category/your-category/ gibi kategori bağlantısını (yani kategoriye bağlantı) tıklarsa, WordPress doğru dosyayı (ve içeriği) üretmek için bir şablon hiyerarşisi kullanır. aşağıda açıklandı:
İlk olarak, WordPress kategori kimliğiyle eşleşen şablon dosyalarını arayacak
Kategori kimliği, örneğin 2, WordPress Category-2.php adlı bir şablon dosyası arar.
Category-2.php mevcut değilse, WordPress Category.php gibi genel bir kategori şablon dosyası kullanır
Bu şablon dosyası da mevcut değilse, WordPress archive.phpjika jenerik arşiv şablonları gibi jenerik arşiv şablonlarını arayacaktır, WordPress ana şablon dosyasına geri dönecektir.
WordPress şablonu böyle çalışır ve WordPress temasını ihtiyaçlarınıza göre ayarlamak için bu dosyaları kullanabilirsiniz. Diğer şablon dosyaları şunları içerir:

> En son statik sayfaları veya yayınları açık olarak ayarlamak için kullanılır

single.php

‘nin ön sayfası bir posta sayfası oluşturmak için kullanılır Post-Type} .php Özel gönderim türlerini oluşturmak için kullanılır, örneğin gönderi türü bir ürünse, WordPress tek bir ürün kullanır. statik bir sayfa oluşturmak için kullanılan> page.php Arşiv Endeksi

yazar.php

Yazar yapmak için kullanılır

tr> date.php Bir tarih oluştur search.php

td> 404.php Hizmet hatası sayfalarını oluşturmak için kullanılır ER 404

Bu sadece kısa bir listedir, hala başka birçok WordPress şablonu vardır. Şablon konusu büyük bir konudur ve şablon dosyasıyla nasıl oynayacağınızı öğrenmenin en iyi yolu WordPress'teki kapsamlı tema geliştirme kütüphanesini okumaktır. Veya şablonun daha kısa bir bölümünü WordPress kodeksinde okuyabilirsiniz.
Şablon etiketi, şablon dosyasını yeni tanıttığımızı, şablon etiketi hakkında bir veya iki şeyden bahsedecek kadar adil olduğunu ve WordPress temasında oynadıkları rolü görüyor. WordPress.org'a göre, "... Etiket şablonları blog şablonunuzda bilgileri dinamik olarak görüntülemek veya blogunuzu ayarlamak, sizin gibi bireysel ve çekici hale getirmek için araçlar sağlamak için kullanılır." Önceki öğreticimizde, get_header, get_sidebar, get_footer ve bloginfo gibi bir dizi şablon etiketi buldunuz. Aşağıdaki bölümde, yeni oluşturduğumuz WordPress temasına bazı şablon etiketleri ekleyeceğiz. Header.php dosyanıza bir Doctype Beyannamesi eklediğinizi varsayıyorum. Değilse, bu koddur: bildirim belgesi HTML kodunuza anlam verir. Bununla birlikte, açılış html etiketini değiştirelim. Lang özniteliğini şöyle ekleyeceğiz: <html xmlns = "http://www.w3.org/1999/xhtml" Yukarıdaki kod aşağıdakileri üretecektir: <html xmlns = "http://www.w3.org/1999/xhtml" lang = "tr ve tarayıcı kodunuzu anlayacaktır. Bir blog için bir tema oluşturursanız, kafanıza pingback URL ve RSS yemine bir bağlantı kurmak önemlidir. Header.php, aşağıdaki kodu ekleyin:
<link title = " <link href = "<? php bloginfo ('pingback_url'); pingback_url ')? Header.php dosyanızı kaydetmeden önce aşağıdaki kodu ekleyin: Yukarıdaki WP_HEAD etiketi, eklentinizin ihtiyaç duyduğu stil sayfasını ve JavaScript dosyasını çekecektir. Bu kodun küçük kısmını görmezden gelirseniz, eklentiniz istendiği gibi çalışmayabilir. Bununla birlikte, kullandığımız WordPress temasına sayfa başlığını ekleyelim - yine - Tag BlogInfo. Header.php dosyanızda aşağıdaki kodu ekleyin: İlk etiket WP_TITLE sayfanızın veya yayınınızın başlığını ekleyecek ve BlogInfo'nun ('Name') ikinci etiketi blogunuzun adını ekleyecektir. Şimdi WordPress temanızın bir sayfa başlığı var, temamız için bir ekran görüntüsü yapmaya ne dersiniz, temayı yeniden paketleyin ve dinleniyoruz?