Taildwind CSS ile WordPress teması = Honeywind
Blogum 21.07.2021 tarihi itibarı ile yeni görünümüne kavuştu. Yeni temam ‘Honeywind’ tamamen el emeği göz nuru oluşturduğum bir tema. Böylece hem WordPress ekosisteminde çok yaygın olmayan ‘Tailwind Css‘ tabanlı bir temaya sahip oldum, hem de uzun yıllar sonra bir WordPress temasını sıfırdan oluşturarak WordPress tema geliştirme konusundaki pası üzerimden atmış oldum. 🙂
11.05.2022 Düzeltme: Blogu Headless WordPress yapısına geçirip ön yüzü Next.Js’e çevirdiğim için bu yazıdaki tema artık aktif değildir.
Honeywind’de neler var?
- Yazılar ana sayfa, kategori ve aşriv sayfalarında “masonry” ızgara düzeni olarak bilinen düzende gösteriliyor. Bunun için diğer masonry kütüphanelerinin aksine hafif ve inanılmaz hızlı bricks.js kütüphanesini kullandım.
- Temayı hem açık, hem de koyu renk olarak tasarladım. Sayfanın sağ üst köşesinde bir tema değiştirme düğmesi göreceksiniz. Klasik bir ‘checkbox’ elemanına biraz css ve javascript ekleyerek bu işlevi kazandırdım.
- Yazıların altında ve kart görünümlerine eklediğim like özelliği de tamamen temaya bütünleşik, harici bir eklentiye ihtiyaç duyulmuyor.
- Anasayfa, kategori ve arşiv sayfaları Jetpack’i infinite-scroll özelliğine uygun şekilde tasarlandı. Jetpack etkin olmadığında bu özellik yerine klasik önceki-sonraki sayfa bağlantıları gösteriliyor.
- Yapışkan başlık bölümü temanın içine gömülü, ayrıca bir eklenti kullanmak gerekmiyor.
- Yan menüde ilgili yazılar ve son yazıları özel stillerde göstermek için iki bileşen oluşturdum.
- Yazıların kart görünümleri ve tekil içerk görünümünde listelenen çoğu bölüm tema ayarlarından açılıp kapatılabiliyor.
Tema şu an için alpha aşamasında, önce kendi sitemde deneyip hataları düzelttikten sonra kaynak kodunu da açmayı düşünüyorum. Ayrıca şimdilik ‘manuel’ yöntemlerle çözdüğüm bir kaç özelliği de eklemeyi düşünüyorum.
Hazır tema kullanmayı bırakıp, A’dan Z’ye her şeyine hakim olduğum bir tema kullanmaya başladığım için çok mutluyum. Sitede gördüğünüz herhangi bir özellikle ilgili PHP, CSS ve JS desteğine ihtiyacınız olursa lütfen bana ulaşın.
