Bootstrap ile Portföy WordPress Teması Nasıl Oluşturulur

Bootstrap ile bir portföy WordPress teması oluşturmak istiyorsanız aklınızda bulundurmanız gereken birkaç şey var. Öncelikle, tüm cihazlarda iyi görünmesi için temanızın duyarlı olduğundan emin olmanız gerekir. İkincisi, içeriğinizin düzgün bir şekilde düzenlenmesi için bir Bootstrap ızgara sistemi kullanmanız gerekir. Üçüncüsü, temanıza ekstra işlevsellik eklemek için Bootstrap bileşenlerini kullanmanız gerekir.

Popüler Bootstrap CSS çerçevesi ile duyarlı bir Bootstrap WordPress teması geliştirmek dahildir. Bootstrap başlangıç ​​şablonu kullanarak bir temanın ve blog beslemesinin nasıl oluşturulacağını gözden geçireceğiz. Bölüm 1'de, yazıp tamamlanır tamamlanmaz burada listeleyeceğim gelecek kurulumlar olacak. Mevcut boş stilinizde gerekli değişiklikleri Not Defteri'nde yapın (bunu kullanmanızı öneririm). Lütfen bir yorum başlığı ve CSS ekleyin. Functions.php düzenlenebilir. Lütfen aşağıdaki kodun bir kopyasını yapın, her satırı hızlıca gözden geçireceğim.

Bunu, dosyaları sıraya alarak ve ardından bir işlevi WP_enqueue_scripts'e bağlayarak gerçekleştiririz. bootstrapstarter_enqueue_scripts() kullanıldığında, yalnızca 'jquery'den oluşan bağımlılık dizisi tanımlanır. Bu komut dosyası, tüm kayıtlı komut dosyası tanıtıcılarının bir dizisine bağlıdır. Ana stil sayfamız öncelikle Bootstrap CSS dosyalarından oluştuğu için, $dependency dizimizde yalnızca bir tutamaç kullanırız: bootstrap (önceki satırda kaydetmiştik). Şablondan Bootstrap çıkarıldıktan sonra dosyalar dört ayrı dosyaya bölünür. Son dosya, en son gönderileri varsayılan kronolojik sırasına göre görüntüler. Döngü, başlığı, içeriği, yazar adını, tarihi vb. görüntüleyen bir WordPress aracıdır.

Bu, resmi Bootstrap web sitesinde bulunan blog şablonunu temel alan temel bir WordPress temasıdır. Gezinme, site üstbilgisi ve açıklaması, kenar çubuğu ve altbilgide entegre olmayanlar gibi statik HTML öğeleri hala vardır. Tarzınızı benzersiz kılmak istiyorsanız, yorum başlığından sonra CSS kodunun eklendiğinden emin olun.

WordPress ile Bootstrap Temalarını Kullanabilir miyim?

Mobil uyumlu ön uç web geliştirme, açık kaynaklı bir çerçeve olan Bootstrap kullanılarak gerçekleştirilebilir. Sonuç olarak, CSS ve JavaScript şablonlarını kullanarak duyarlı WordPress temaları oluşturmak için kullanılabilir.

WordPress'te Bootstrap ile çalışırken çok sayıda adım vardır. Bir tema oluşturmak ve kullanmak istiyorsanız bir WordPress barındırma hesabına ihtiyacınız olacak. WordPress'in bir bileşeni olan Bootstrap söz konusu olduğunda, tema, Bootstrap'in temel olarak kullanılmasının bir sonucudur. Her iki sistem de birçok teknik bilgiyi gizleyecek ve aynı zamanda kullanıcı dostu olacak şekilde tasarlanmıştır. Bir WordPress temasının sıfırdan oluşturulması zor olabilir. Varsayılan bir WordPress temasından birkaç dosya kopyalamak, Bootstrap tabanlı bir temayı denemenin en basit yoludur. Temamız WPBootstrap olarak anılacaktır ve dizin (küçük harflerle) olarak anılacaktır.

Bir WordPress temasına nasıl önyükleme ekleyebilirim? Bunu yapmanın birkaç yolu vardır. Header.php ve footer.php dosyalarına Bootstrap CSS ve JavaScript kitaplıkları eklemek istiyorsanız, bu kitaplıkları eklediğinizden emin olun. Screenshot.png isimli bir dosya oluşturarak temaya bir ön izleme görseli ekleyebilirsiniz. Bir WordPress teması oluşturmak çok iştir, bu yüzden dosyaları başka bir temadan kopyalamanızı öneririm. Bootstrap'in kendi kuralları ve uygulamaları olduğundan, bunları da öğrenmek önemlidir. Hem WordPress hem de Bootstrap güçlü topluluklara sahip olduğundan, sorunun cevabını almak için asla geç değildir.

Bootstrap, WordPress'ten Daha İyi mi?

Yeni başlayan biriyseniz veya çok fazla deneyiminiz yoksa, öğrenmesi ve kullanması diğer platformlardan daha kolay olduğu için Bootstrap kullanmanızı tavsiye ederim. Web sitesi tasarım becerilerinizi geliştirmek istiyorsanız, WordPress iyi bir seçenektir.

Bir web sitesi oluştururken Bootstrap ve WordPress arasında seçim yapmakta zorlanabilirsiniz. Bu bloga tıklayarak Bootstrap ve WordPress arasındaki farkları öğrenebilir ve kısa bir karşılaştırma yapabilirsiniz. Bu listeye baktığınızda, web siteniz için en iyi platformu seçmeniz gerektiğini göreceksiniz. Bootstrap siteleri , WordPress sitelerinden daha az bellek kullanır. Mobil cihazlarda Bootstrap ile web siteleri kurmak mümkündür. Bir WordPress web sitesi, ister PC, ister tablet veya dizüstü bilgisayarda olsun, her boyuttaki ekrana daha uygundur. Bootstrap'ta siteniz veya sayfalarınız için sayfa içi SEO yapabilmek için iyi bir kodlayıcı olmalısınız.

Bootstrap: WordPress Geliştirme İçin Harika Bir Başlangıç ​​Noktası

Önyükleme çerçevesi, WordPress geliştirmeye başlamak için harika bir yerdir, ancak herhangi bir özel gereksinime uyacak şekilde özelleştirilebilir. Koda ihtiyaç duyduğunuzda erişebilirsiniz ve bu kod ücretsiz olarak kullanılabilir ve açık kaynaklıdır. Ayrıca, bu uygulama tüm beceri seviyelerindeki insanlar için tasarlandığından, hızlı bir şekilde başlayabilirsiniz. Ön uç bir çerçeve olan WordPress'in aksine, Bootstrap, statik web sitelerinin tasarımı ve kullanıcı arayüzü için kullanılabilir. Ancak mevcut temada herhangi bir özellik olmadığı için kendi temanızı oluşturmanız gerekecek. Bootstrap, profesyonel web geliştiricileri tarafından yaygın olarak kullanıldığından, ihtiyaçlarınızı karşılayacağından emin olabilirsiniz.

Sıfırdan Önyüklemeden WordPress Teması Oluşturun

Bootstrap kullanarak sıfırdan bir WordPress teması oluşturmak nispeten basit bir işlemdir. Öncelikle, temanız için /wp-content/themes/ dizini içinde bir klasör oluşturmanız gerekecek. Ardından, tema klasörünüzde bir index.php dosyası ve bir style.css dosyası oluşturmanız gerekecek. Ardından HTML, CSS ve PHP kodunuzu bu dosyalara eklemeye başlayabilirsiniz. Son olarak, WordPress yönetici panelinde temanızı etkinleştirmeniz gerekecek.

Bir PHP sınıfı olan NavWalker, WordPress gezinme menüsünün daha verimli çalışmasını sağlar. Aşağıdaki kodda inc/bs5-navwalker.php dosyası kullanılırken NavWalker görüntülenir. Get_search_form(), WordPress için bir arama formu oluşturan bir işlevdir. Aşağıdaki kod WordPress temasının search.php dosyasına eklenmelidir. Görünmeyen URL'lerde kullanmak istediğiniz özel kodu görüntülemek için yeni bir 404.php dosyası oluşturun. Tema Ekran Görüntüsü (Küçük Resim), Tema klasörüne yüklenmelidir.

WordPress Alt Temasına Bootstrap Nasıl Dahil Edilir?

Bir WordPress alt teması oluşturuyorsanız, önyükleme dosyalarını temanızın klasörüne eklemeniz gerekir. Önyükleme dosyalarını eklemek için bir CDN (İçerik Dağıtım Ağı) kullanabilir veya dosyaları indirip temanızın klasörüne ekleyebilirsiniz. Bir CDN kullanıyorsanız, alt temanızın header.php dosyasına önyükleme CSS ve JavaScript dosyalarını eklemeniz gerekir. Bootstrap web sitesinde önyükleme dosyaları için CDN bağlantılarını bulabilirsiniz. Önyükleme dosyalarını temanızın klasörüne ekliyorsanız, alt temanızın functions.php dosyasındaki CSS ve JavaScript dosyalarını kuyruğa almanız gerekir. Bunun nasıl yapılacağı hakkında daha fazla bilgiyi WordPress Kodeksinde bulabilirsiniz.

Bootstrap'i WordPress temalarına üç şekilde dahil edebilirsiniz. İlk yöntem, Functions.html dosyanıza Bootstrap CDN eklemektir. Bootstrap dosyalarını doğrudan temaya paketlemeyi içeren Yöntem 2 de mümkündür. WordPress temalarına CSS ve Javascript dosyalarının nasıl dahil edileceğine dair daha fazla bilgiyi WordPress belgelerinde bulabilirsiniz.