Divi’de Pagination Style Nasıl Yapılacağına İlişkin Pratik Kılavuz

Şimdi bazı sayfalama tasarımlarını test etmeye hazırsınız. Genel olarak Divi’de sayfalandırma düzenlerken dikkate alınması gereken şeyler, sayfalandırma tasarımı ile çok çılgın olmak istemeyebilirsiniz, çünkü diğer navigasyon menüleri gibi, onu basit ve sezgisel tutmak önemlidir. Ancak, Divi’de sayfalandırma tasarlarken düşünebileceğiniz bazı şeyler. Pagination Pagination Yazı Tipi, siteniz için kullandığınız ana yazı tiplerinden kopmak için iyi bir yerdir. Kullanıcı ve navigasyon arayüzlerine yönelik en iyi yazı tiplerini seçmek istersiniz. Ve sayfalandırma çoğunlukla sayılar içerdiğinden, yazı tipinin tüm sayıları aynı yükseklik ve genişliğe sahip (astar ve tablo olarak tipograf olarak adlandırılan) görüntülediğinden emin olmak istersiniz. Muhafazakar favorilerimden bazıları oksijen, nunito sans ve kaynak sans pro. Ve sayfalamanızda birçok sayfa varsa, Fjalla One veya Roboto yoğunlaştırılmış sıkıştırılmış yazı tiplerini kullanarak biraz boşluk boşaltmanız gerekebilir.
Sayfa yazı tipi stiliniz, sayfalandırmanızı ayırt etmek için birkaç yazı tipi stilini de deneyebilir. Örneğin, “bir sonraki” ve “önceki” bağlantıyı daha net ve sayfa numarasının yüksekliğine eşit hale getirmek için büyük harfli bir yazı tipi stili kullanabilirsiniz. Bununla birlikte, bağlantının zaten navigasyon menüsünde olduğu göz önüne alındığında, alt çizgi yazı tipi stilinin eklenmesi biraz aşırı olabilir. Mektup Boşluğu Sayfalandırma Harfleri Aralık, sayfalamanıza biraz daha yatay boşluk eklemenin iyi bir yoludur. Bu iyi bir tasarım öğesi ekleyebilir ve navigasyonu öne çıkarabilir. Divi’de sayfalandırma metnini düzleştirme, sayfalandırmanızı sol, orta veya sağ sayfaya kolayca hizalayabilirsiniz. Web sayfalarınızı her tasarladığınızda bunu unutmayın. Doğru katlanmış odalar, sayfalandırma bağlantınız için tıklanabilecek yeterli alana sahip olmak için önemlidir. Varsayılan olarak, bu oldukça küçük olacaktır. Daha büyük bir metin kullanarak tıklanabilecek alanı artırabilir veya hattın yüksekliğini artırabilirsiniz. Ancak, birkaç CSS ile bağlantının etrafına bazı rulmanlar ekleyebilirsiniz. Pagination Metin Boyutu Sayfa metin boyutu genellikle oldukça küçüktür. Bu, kullanıcıları sayfa içeriğinden korumaktan korumak mümkündür. Ancak, daha büyük bir metin boyutuna sahip olmak, sayfalama bağlantısından tıklanabilecek alanı artırabilir ve kullanıcı tarafından daha görünür hale getirebilir. Tarayıcıları ve içerikli ölçeğin iyi olması için daha büyük sayfalama metni için uzun bir VW ünitesi kullanmayı seviyorum.
Sayfa Hattı Yüksekliği Boyunma genellikle bir satırda sabitlendiğinden, tıklanabilecek ek alan eklemek için bağlantıya biraz daha yükseklik ekleyebilirsiniz. Metin sayfa metin gölgesinin görüntüsü kötü kullanılırsa müdahale edebilir. Pürüzsüz tutmayı planlamadığınız sürece bırakmak en iyisidir. Bu, bu tür şeyleri istiyorsanız metninizin etrafına yaratıcı ışık eklemek için de kullanılabilir. Pagination Active Sayfaları, gezinmenin bu yönü, gezinirken hangi sayfalarda açık olduklarını söylemek önemlidir. Aktif sayfa bağlantı kuvveti ile aktif olmayan sayfa bağlantıları arasında net bir kontrast olmalıdır. Varsayılan olarak, Divi, tema ayarında düzenlenen ana vurgu rengini Divi’deki aktif sayfa bağlantısının rengi olarak kullanacaktır. Bununla birlikte, CSS hattında olabilirsiniz. Paginasyona sahip modüller için DIVI, çeşitli sayfalandırma öğelerini düzenlemek için varsayılan bir tasarım seçeneğine sahiptir. Buna ek olarak, rahat bir yerde tasarıma daha fazla kontrol için gelişmiş sekmeye kolayca bazı CSS görüntüleri ekleyebilirsiniz. Ancak tema düzeyinde sayfalandırma için, özel bir CSS ile WP-Pagenavi eklentisini kullanarak karmaşık bir çözüm elde edebilirsiniz (daha sonra bu konuda daha fazla). Şimdilik, divi modüllerinde sayfalandırmayı yöneterek başlayalım. Styling Divi Galeri Modülü ve Filtreleme Portföy Modülü Yeni Bir Sayfada Etkin Divi Oluşturucu ile Pagination, bir sütun satırı ile yeni bir normal bölüm oluşturun. Ardından satıra filtrelenebilen bir portföy modülü ekleyin. Daha önce de belirtildiği gibi, sayfalandırmayı görebilmeniz için 12-16 projeniz olduğundan emin olun.
Filtreleme portföy ayarlarında, aşağıdaki güncelleme: Gönderi numarası: 4 (böylece sayfalandırmada daha fazla sayfa bağlantısı görebilirsiniz) Etkinlik Başlığı: Kategoriyi gösterme: varsayılan olarak Divi, sayfalandırmayı görüntüleyecektir, bu nedenle seçeneğin evet olarak ayarlanmasına izin verecektir. Portföyün sağ alt kısmında sayfalandırmayı göreceksiniz. Sayfayı düzenlemek, tasarım sekmesini açmak ve mevcut tüm seçenekleri görmek için sayfalandırma metni anahtarını açın. Aşağıdaki Güncelleme: Düzen: Sayfa Yazı Tipi Kutusu: Ekşi Sans Pro Yazı Tipi Stil Paginasyonları: TT Tesviye Metin Sayma: Orta Renkli Metin Sayma: #CCCCCC Metin Boyutu Sayma: 4VW (masaüstü), 38px (tablet ve cep telefonu) Aralık Pajinasyon Harfleri: 1VW Pajinasyon Hat yüksekliği: 2em
Ardından Gelişmiş sekmesini tıklayın ve aktif sayfa sayfasının altına aşağıdaki CSS parçalarını ekleyin: Renk: #0096EB! Önemli;
Daha büyük bir çizgi yüksekliğine sahip daha büyük bir metin yaparak, kullanıcıya tıklanabilecek daha fazla alan vardır. Seviyenin ortada değiştirilmesi ve biraz alan eklemek, sayfalandırmayı daha görünür hale getirmeye yardımcı olur. Ve kontrastlı aktif sayfa renklerine sahip özel sayfalama metni rengi kullanıcıların hangi sayfa olduklarını bilmelerine yardımcı olur. Buradaki diğer hızlı CSS görüntüleri, sayfalamanın tasarımını değiştirmek için bazı hızlı ve kolay CSS snippet’leridir. Sayfalandırmanın hemen üstünde olan varsayılan sınır çizgisini ortadan kaldırmak için, sayfalandırma portföyü altında aşağıdaki CSS’ye girebilirsiniz:
Sınır: Yok;