# 104: Parçacıklar Alanı Oluşturma, Bölüm 1 (HTML ve CSS) - CSS Hileleri

Anonim

Parçacıklar alanının ana sayfası için artık çalışabileceğimiz bir Photoshop tasarımımız var. Öncekinden çok daha fazla göz atılabilir, ancak daha önce sahip olduğu gökkuşağı ruhunu koruyor. Şimdi bunu WordPress şablonlarımızda gerçekten oluşturmaya başlayabiliriz. Tüm HTML, PHP ve CSS'yi Yazarken ve MATERYALİ BİLİYORSUNUZ!

Birinci adım, statik tasarımımızda gitmeye hazır olduğumuz özel başlığımızın üzerinden geçiyor. Bu, doğru sarmalayıcı öğelerine sahip olmak için küçük bir HTML'nin etrafını değiştirmek anlamına gelir. Ayrıca, bu alana özgü CSS'yi yüklemek için başlıktaki koşullu mantığın yerinde olduğundan emin olmak anlamına da gelir. Bu her zaman, herhangi bir web sitesinde CSS dosyaları ve JavaScript dosyaları için sahip olduğum 1, 2 veya 3 kuralını düşünmeme neden oluyor. CSS-Tricks, global stillere sahip olduğumuz ve sitenin kendine özgü oldukça stil sahibi olduğu her özel bölüm için bir CSS'ye sahip olduğumuz "2" web sitesinin mükemmel bir örneğidir. Bu parçacık düzeni kesinlikle benzersizdir.

Bu sayfadaki ihtiyacımız olan tüm çıktıyı elde etmek için, tekrar bir sürü wp_list_pages () çağrısı kullanıyoruz. Bunun nasıl sorunlu olabileceğinden bahsediyoruz çünkü bu çok yoğun bir çağrı ve geçmişte Almanak alanını yarattığımızda bununla ilgili sorunlar yaşadık. Bununla birlikte, bellek kullanımımızı artırdığımız ve önbelleğe alma kullandığımız için bu çok önemli değil.

Ekran video kaydını, ihtiyacımız olan her şeyi sayfaya yazdırarak ve çok basit bir ızgara kurulumuyla sonlandırıyoruz. Şimdi onu modelimiz gibi göstermeye devam edebilir ve nihayetinde etkileşimleri ekleyebiliriz.