Astra ve Jetengine ile dinamik bir web sitesi oluşturmak
Statik bir sitenin geçmişten bir şey haline geldiği ve sonsuza dek değiştirmek için kolayca geliştirilen dinamik bir site haline geldiği anlaşılıyor. Ancak farklı statik site jeneratörlerinin ve özel çerçevelerin ortaya çıkmasıyla, hangi sitenin daha optimal olduğu tartışılması yeni coşku ile parlıyor. Bu makale statik ve dinamik web siteleri arasındaki farkı gösterecektir. Bu aynı zamanda Jetengine eklentisi ve Astra temasını kullanarak dinamik bir web sitesinin nasıl oluşturulacağı hakkında bazı bilgiler sağlayacaktır.
İçindekiler
Dinamik bir web sitesi nedir?
Dinamik ve web sitesi Statik web siteleri
Astra ve Jetengine ile dinamik bir web sitesi nasıl oluşturulur
Astra ve Jetengine ile inşa edilen en iyi dinamik sitelerin örnekleri
Paketlemek
Dinamik bir web sitesi nedir? Dinamik web siteleri, değiştirilmiş şablonlar gibi dinamik sayfalardan oluşur. Web sitesi, belirli kullanıcılara konum, gün boyunca ve kullanıcı etkileşimi gibi çeşitli özelliklere göre uyum sağlar.
Dinamik bir sitenin en çarpıcı örneği, içerik yönetim sistemine (CMS) dayanan bir sayfadır. Bu kategoride, çevrimiçi mağazalar, forumlar, inceleme web siteleri ve kullanıcıların onlarla etkileşime girmesine izin veren diğer platformları da bulabilirsiniz. Kullanıcı sayfayı her açtığında isteğe göre dinamik sayfalar yapılır. Sayfa, isteğe göre yüklenecek belirli öğeler için bir yer tutucu içerecektir. Buradaki fayda, kullanıcının sayfayı her açtığında her zaman en son içeriği görüntüleyebilmenizdir. Dinamik ve web sitesi Statik web siteleri Dinamik ve statik web sitelerini karşılaştırmadan önce, statik bir web sitesinin ne olduğunu açıklayalım.
Statik siteler tüm ziyaretçiler için aynı görünüme ve aynı içeriğe sahiptir. Genellikle, rutin güncellemeler gerektirmeyen minimal sayfalara veya içeriğe sahip siteler statiktir, yani iş veya ürün hizmeti sayfaları, ürün katalogları, teknik dokümantasyon dizinleri ve bizim hakkımızda sayfalardır. Ancak, üçüncü taraf aracı kullanarak sayfaya bazı dinamik öğeler (yorumlar, kullanıcı hesapları, arama) ekleyebilirsiniz. Dinamik bir sayfa nasıl çalışır? Ziyaretçiler dinamik bir sayfaya indiğinde, sunucu gerekli sayfayı bulur ve çevirmene gönderir. Tercümanlar daha sonra bir şablonu kullanarak bir sayfa oluşturur ve veritabanının dinamik bir öğesiyle uzlaştırır. Ardından, sayfa sunucuya döner ve sunucu onu görüntülemek için kullanıcının tarayıcısına gönderir. Tercümanlar, sunucu tarafındaki sayfaları işlemek için Java, PHP, ASP ve diğer programlama dillerini kullanır. Statik bir web sitesi hakkında konuştuğumda, tarayıcıda statik bir sayfa isterken, sunucu derhal orijinal formunda bitmiş bir HTML sayfası sağlar. HTML’nin yanı sıra, statik sayfalar için yalnızca CSS ve JavaScript kullanılır ve hızlı yükleme sağlar.
Dinamik sitelerin ana özelliklerinden birinin kullanımı, tasarımın ayrılması (şablon), bilgi işleme sistemi (makine) ve içeriktir. Dinamik siteleri veritabanına bağlayarak, ihtiyaçlarınıza bağlı olarak içerik oluşturmak ve görüntülemek için organize ve yapılandırılmış bir şekilde bilgi isteyebilirsiniz. Dinamik web siteleri çeşitli işlevsel özellikler sağlar. Kullanıcılar için bu, kayıt ve kimlik doğrulama, kişisel bilgileri depolama, siteleri arama, formları doldurma, çevrimiçi mağazalar oluşturma ve diğer etkileşimleri oluşturma yeteneğidir. Bu, inşaat sitelerinde esneklik sağlar, çünkü CMS genellikle bazı kullanıcıların sitelerle de çalışmasına izin verir (SEO uzmanları, yazarlar, editörler vb.). Kullanıcılar, kodlamayı keşfetmeden siteyi tam olarak yönetebilir. Buna karşılık, bağlantıya dokunarak ve formu doldurarak statik bir web sitesi ile etkileşime girebilirsiniz. Statik sayfalar, bilgi web siteleri, işletme sayfaları, broşür siteleri vb. İçin iyi bir seçimdir. Çünkü kullanıcılara hızlı bir şekilde gerekli ayrıntıları sağlamada etkili olabilirler. statik sitelerden daha. ” Her şey esas olarak sitenin kendisine bağlı olacaktır:
Kullandığı platform ve site üreticisi
Yöntem oluşturuldu
içerik
Kullanıcı Becerileri Seviyesi
Web programcılarına veya geliştirici işlerine olan ihtiyacı vb.
Daha önce statik web sitelerinin bakım için daha fazla para gerektirdiği söylenebilir.
Ancak şimdi, etkili maliyet ve zamana sahip statik web sayfaları oluşturmak için WordPress, HTML ve statik site jeneratörlerini kullanabilirsiniz. Arama motorları SEO açısından statik ve dinamik web siteleri arasında büyük bir fark yoktur. Bazı statik web sayfalarının ve diğerlerinin dinamik olması, bazı web sitelerinin arama motorları için önemli ölçüde daha iyi olduğu anlamına gelmez. Dikkate alınması gereken noktalardan biri URL’dir. Statik web sayfaları hakkında konuşursak, “doğal olarak” çalışırlar. Klasörlerdeki URL kuruluşları web sitesi organizasyonunuzu takip eder. Bu, her sayfanın yalnızca bir URL vb. Olduğu anlamına gelir. Dinamik web sayfaları durumunda, SEO performansı web sitenizi nasıl düzenlediğinize bağlıdır – URL’nizin web sitesinin yapısını takip ettiğini garanti etmeniz gerekir. Bu nedenle, kullanıcı URL’sinden emin olun. SEO için bir diğer önemli nokta sayfanın hızıdır, bu nedenle dinamik veya statik web sitenizi mümkün olduğunca çabuk oluşturun. Son olarak, tüm arama motorları düzenli olarak taze içerikle güncellenen web sitelerini tercih eder. Dinamik web sayfalarının güncellenmesi statik sayfalardan çok daha rahattır. Hız web siteleri statik sayfalar dinamik sayfalardan daha hızlıdır. Gerçek bu.
Web sunucusunun yalnızca sayfa dosyasını kopyalaması, herhangi bir form veya öğe eklemesi ve tarayıcıya göndermesi gerekir. Yapılması gereken çok az işlem ve sunucu kaynağını daha az boşaltır. Kullanıcının tarayıcısına gönderilmeden önce dinamik sayfaların CMS tarafından oluşturulması gerekir. Sayfa şablonunun kopyalanması ve her dinamik öğenin veritabanında bulunması ve sayfaya enjekte edilmesi gerekir. Sadece bundan sonra kullanıcının tarayıcısına gönderilebilir. Ek karmaşıklık dışında, hafif bir WordPress teması kullanıyor ve web sitenizi doğru bir şekilde oluşturuyorsanız, işlemenin ertelenmesini en aza indirmek için birçok şey yapabilirsiniz. Doğru aracı nasıl kullanırsanız. Bu durumda, Astra WordPress ve Jetengine eklentisinin teması budur. Bir crocoblock müşterisiyseniz, Astra’yı kurulum sihirbazında bulabilirsiniz.
Adım 1. Crocoblock hesabınızı girin ve kontrol panelini açın.
Kurulum sihirbazını içeren Zip’i indirin.
WordPress ve lansmanlara sihirbaz kurulumunu yükleyin.
Astra’yı Crocoblock Kurulum Kılavuzu sayfasında bulun ve seçin.
CSS değişikliklerinizi güvence altına almak için bir çocuk teması seçin. Kurulum sihirbazı tamamlandıktan sonra, Astra teması kurulur ve sadece bu.
Astra temasını yüklemenin ikinci yolu, görünüm menüsündeki temayı değiştirmektir.
Yönetici panelindeki görünüm> temalara gidin.
Listedeki Astra temasını bulun ve Yükle düğmesini tıklayın.
Bağlantı etkinliğine basın ve kurulumun bitmesini bekleyin.
Bunu yapmak için görünüm> temaları seçin.
“Eklenen yeni” bulun. “Tema Yükle” düğmesini bulabileceğiniz başka bir sayfaya yönlendirileceksiniz. Astra temasıyla zip yükleyin, “Şimdi Yükle” yi tıklayın, ardından “Etkinleştir” düğmesini seçin. Ayrıca, arama teması bıçakları aracılığıyla Astra temalarını bulabilirsiniz. Astra temasını etkinleştirdiğinizde, temanızda göreceksiniz. Mutlu! Astra teması WordPress’e yüklendi! Şimdi başka bir adıma geçeceğim – yeni başlayan bir şablon seçin. Astra’yı yükledikten sonra göreceğiniz ilk mesaj şablonunu seçmek şudur:
Yeni başlayan şablonu etkinleştirmek için Başlat düğmesini tıklayın.
Süreç bittikten sonra bir sayfa üreticisi seçmelisiniz:
Sizin için uygun olanı seçtikten sonra, ücretsiz ve premium şablonların bir listesini göreceğiniz yeni başlayan şablon sayfasına yönlendirileceksiniz.
Girmek istediğiniz şablona tıklayın. “Dağlar” kullanacağım. Açık pencerede üç düğme bulun: Önizleme siteleri, tam site içe aktarma, “ana sayfa” şablonlarının içe aktarılması. Tüm şablon işlevselliğine mi yoksa bir kısmına mı ihtiyacınız olduğuna karar verin. Tam siteye gideceğim. İçe aktarmaya başlamak için uygun düğmeyi tıklayın. Bir sonraki adım, amacı seçmektir: Adınızı girmeniz istenecek, ancak bu adımı geçebilirsiniz. Şablon içe aktarıldıktan sonra dinamik web sitenizi oluşturmaya başlayabilirsiniz. Astra teması Astra’nın ana özelliğinin ana özelliği kullanım kolaylığı ve esnekliktir. Bloglardan WooCommerce mağazalarına kadar her türlü web sitesi için uygundur. Tema ayrıca 50 KB’den azdır, bu nedenle sayfalar hızlı bir şekilde yüklenir (özellikle önbellekleme, GZIP sıkıştırma ve optimize edilmiş görüntüler yapılandırılmışsa). Diğer önemli özellikler şunlardır: Elementor gibi sürükleme ve gevşek sayfa yapımcıyı kullanarak veya orijinal WordPress düzenleyicisini kullanarak her şeyi tam olarak ayarlayabilirsiniz. Tüm duyarlı şablonlar ve bilgisayarlarda ve akıllı telefonlarda mükemmel görüntülendi. Ayarlamaları kullanarak web sitesinde hızlı bir şekilde değişiklik yapabilirsiniz. Görünüşe Erişim> WordPress Gösterge Tablosunda özelleştirin. Web sitesinde değiştirdiğiniz her şey önizlemede gerçek zamanlı olarak görünecektir, böylece sitenizin yayınlanmadan önce nasıl göründüğünü her zaman bilirsiniz. Çeşitli ayar araçları mevcuttur. Temanın ana rengini değiştirebilir, sayfa düzenini değiştirebilir, Google yazı tipini kullanabilir ve daha fazlasını yapabilirsiniz. Altbilgi, kenar çubuğu, başlık vb. Yapılandırma için bile seçenekler vardır. Web sitenizin tek tip bir görünüme sahip olması için tipografi gibi şeyleri küresel olarak yapılandırabilirsiniz. Yani, her sayfadaki yazı tipini değiştirmenize gerek yoktur. Veya, her sayfaya tek tek erişmek zorunda kalmadan yan bıçakları veya altbilgiyi birkaç sayfada devre dışı bırakmak isteyebilirsiniz. Buna ek olarak, ekmek kırıntıları, hatta mesajları, başlıkları ve meta veri bloglarını, yorumları, kategorileri ve yazarları değiştirme gibi tarafın görüntülenme şeklini değiştirmek kolaydır. Bunun için Astra Mass Düzenleme eklentisine sahipsiniz. Bu, web sitenizin tarafı ve başlığın başlığı gibi meta veri ayarlarını ayarlamak için zamandan tasarruf sağlar. Bu, gerekirse yüzlerce sayfaya aynı anda değişiklik uygulamanızı sağlar. ASTRA, başlık başlığını dinamik olarak yapılandırmanıza izin verir. Orada görüntülenmeniz gereken içeriğe bağlı olarak değişeceklerdir. Örneğin, belki telefon numaraları, sosyal medya bağlantıları veya CTA. Ayrıca, web sitesinde başlıkların nasıl görüntüleneceğini ayarlamak isteyebilirsiniz. Örneğin, kanopiyi özellikle belirli rolleri olan ziyaretçiler girdiğinde görüntülenen ana sayfa için ayarlayın. Jetengine eklentisi nedir? Jetengine, karmaşık web siteleri oluşturmanıza, gelişmiş web sitesi yapıları tasarlamanıza, dinamik işlevsellik uygulamanıza ve her şeyi maliyetle tasarlamanıza yardımcı olan dinamik bir içerik eklentisidir. Jetengine’i yüklemek için bir Crocoblock kurulum kılavuzuna ihtiyacınız var. Lisans kodunu girdikten sonra, ayrı ayrı bir Jetengine eklentisi almak için Jetplugins kurulumunu seçmelisiniz. Bir jetengine bulun ve listeden seçmek için uygun onay kutusunu tıklayın. Ardından, yüklemeye devam etmek için Devam düğmesine basın. Eklentiyi Croco kontrol panelinde ve yönetici panelinin sol tarafında göreceksiniz.
Jetengine eklentisinin ana dinamik web sitesi özelliği Jetengine, dinamik bir web sitesi oluşturmak için ihtiyacınız olan her şeye sahiptir. Karmaşık web sitesi yapıları geliştirmek için 15 dinamik özellik sağlar, ancak aynı anda kullanmaya gerek yoktur. Web sitesinin amacına bağlı olarak, temel bilgilere başlamak ve daha fazlasını eklemeniz gerekip gerekmediğini görmek mantıklıdır. Bir kitap incelemesi ile basit bir blog oluşturalım. . Yönetici panelinizde, Post> Yeni Ekle Türünü seçin. CPT adınızı verin. Salyangoz tipi gönderim otomatik olarak yapılacaktır. Etiketi de doldurabilirsiniz:
İşiniz bittikten sonra “Gönderi Türü” düğmesine basın. Tamamlandı!
Şimdi bazı kitap incelemeleri ekleyelim. “Yeni Kitap İncelemesi Ekle” seçeneğini bulun ve bir inceleme yazısı oluşturmak için tıklayın.
Gerekli metni ve resimleri girin, video incelemeniz varsa videoyu sabitleyin ve “Yayınla” düğmesine basın. Özel bir meta kutusu oluşturmaya devam etmeden önce ihtiyacınız olduğu kadar çok gönderi ekleyin.
Özel meta kutumun yayınlarla ilgili bazı ek ayrıntılar eklemek için özel bir alana ihtiyacı var. Benim durumumda, kitabın başlığı, yazar, sayfa sayısı, resim ve tür olacak. Jetengine’i Aç> Meta Kutusu> Yeni Ekle. Genel ayarlarda gereken bilgileri girin.
Ardından, CPT’niz için gereken metafield’i ekleyin. 5 ekledim, ancak istediğiniz kadar ekleyebilirsiniz.
Bundan sonra, yeni yapılmış meta kutuyu CPT’ye ekledim. Genel ayarlarda, meta kutusunun uygulandığından emin olmak için oluşturduğunuz CPT’yi seçmelisiniz. Bir kitap incelemem var, bu yüzden bu meta kutusunu kitap incelemesine etkinleştiriyorum. Değişiklikleri kaydetmeyi unutmayın! Sonra, daha önce yaptığım meta alanındaki her kitap hakkında ayrıntılı olarak ilk kitap inceleme gönderim ve doldurma gittim. Her yazı için bu prosedürü tekrarlamanız gerekir. Özel alan, birkaç ayrıntıyı değiştirirseniz, web sitesinde her görüntülenen kitap incelemenizi otomatik olarak uygulanmasını sağlar. Bu nedenle, belirli incelemeleri bulmak ve orada değişiklik yapmak için tüm siteyi parçalamanıza gerek yoktur. Jetengine’i açın> Liste> Yeni Ekle. “Post Tür” seçeneği için CPT’nizi seçin, tanımlanması kolay olacak şekilde listeniz için bir ad verin. Blok (Gutenberg) seçin ve listeleme öğelerini oluşturun. Cantuman’ın düzenini yapmaya başlayabileceğiniz sayfaya yönlendirileceksiniz. Kullandığım ana dinamik özellikler dinamik görüntü, dinamik alan, dinamik bağlantı ve dinamik meta. Bu düzene dinamik görüntüler ekleyerek başlayalım. Kaynak olarak, daha önce meta alanıma eklediğim etiketi seçtim. Girdiğim görüntünün boyutu orta. Meta verileri, gerekli tüm ayrıntıları yayınlamak için bir kaynak olarak yerleştirmeyi unutmayın. En ilginç olanı bulmak için gerekli alanları girin ve güncelleme düğmesine basın. Bir sonraki adımın ana sayfasındaki liste kutusunu görüntüler Listeyi tüm incelemelerle görüntülemektir. Bunun için, ızgarayı görüntülemek istediğiniz bir sayfa seçmelisiniz. Ana sayfayı seçeceğim ve Elementor ile düzenleyeceğim. Grid ve Liste Widget’ı gereken yere sürükleyin. Bundan sonra, daha önce oluşturduğunuz liste şablonunu seçmelisiniz. Kurgu Listesi şablonumu seçtim: Gördüğünüz gibi, mevcut kafeste kitap incelemeleri düzenlenmiştir. Güncelleme düğmesine basın ve neye sahip olduğumuzu görelim. Oldukça basit görünüyor, ancak Gutenberg için ilginç hale getirmek için her zaman ücretsiz Elementor veya JetStyLanager düzenleme özellikleri kullanabilirsiniz. Jetengine’in bundan daha fazlası olduğunu bilmelisiniz. Bu eklenti, birkaç temel siteyi aşmak için araçlar sağlar. Jetengine tarafından sağlanan nelerdir ve blogun inceleme blogunu diğer dinamik özelliklerle nasıl geliştirebiliriz? Veri depolama ekleyin. Jetengine veri depolama modülünü kullanarak, kullanıcıların doğrudan web sitesindeki hesapta bir koleksiyon oluşturmasına izin veriyoruz. Posta ilişkisini yapılandırın. Yazar hakkında bir yazı yapabilirim, onları ebeveynler yapar ve roman incelemelerini çocuk romanları olarak birleştirebilirim. Taksonomi ve terimler ekleyin. Web sitesi içeriği düzenlemesi için bir araç daha. Örneğin, ziyaretçilerin belirli türlerden incelemeleri okuyabilmeleri için her incelemeye – kurgu, drama, belgesel – etiketler ekleyebilirim. Grafik yapımcıları ve tablolar, genişletilmiş sorgular, sözlük, tekrarlama özel alanları, seçeneği gibi diğer dinamik jetengine özellikleri Sayfalar ve diğerleri, çevrimiçi mağazalar, otel web siteleri veya gelişmiş WordPress dizini – Astra ve Jetengine (ve diğer birkaç Crocoblock eklentisi) temalarıyla oluşturulan dinamik web siteleri – her türlü web sitesini oluşturma yeteneği sunar. İlk örnek Thor Solutions tarafından yapılan mummasecret’dir. Geliştiriciler, ürün kartlarını ek ayrıntılarla genişletmek ve Astra dinamik sayfa başlıklarını uygulamak için jetengine özel alanını kullanır. Thor’un çözümü ayrıca jetwoobuilder ve jettabs kullanır. İkincisi Tommy Callaghan & Manna Design tarafından EAF. Geliştiriciler, blog makalelerine (tarih, yazar) öznitelikler eklemek için Astra, CPT için Jetengine ve Meta Box temasını kullanıyor. Ayrıca, jetler, jettablar ve jetthemecore kullanılır. Bir örnek daha Thomas Anderson’ın alevleri ve gülleri.