WordPress sitenize muhteşem mega menü nasıl eklenir
Mega menü, büyük WordPress sitelerinde yaygın bir tasarım desenidir. Site, birçok farklı parça ve alt bölüme sahip karmaşık bilgi mimarisine sahip olabilir. Benzer bağlantıları gruplandırarak, mega menü kullanıcıların ilgili bilgileri hızlı bir şekilde bulmasını kolaylaştırır. Mega menü hakkında, Jakob Nielsen’in kullanım uzmanı şunları söyledi: “[Mega Menü] büyük miktarda seçeneği barındırmak veya bir bakışta düşük seviyeli site sayfaları açmak için mükemmel bir tasarım seçeneğidir.” Bu yazıda, mega menüyü kullanan WordPress sitelerinin örneklerini, neden büyük bir web sitesi çalıştırırsanız bir seçenek olarak keşfedilmeyi hak ettiklerini ve mega menüyü uygulamanıza yardımcı olacak eklentileri göreceğiz.
Mega menü kullanan WordPress siteleri, çeşitli sitelerde etkili bir şekilde mega menüler bulunur. Joanie’nin kıyafetleri
Joani giyim web sitesindeki mega menü öğeleri WooCommerce ürün kategorisine bağlıdır. Stanford Daily Mega Stanford Günlük Spor Menüsü
Stanford Daily News sitesi, kategoriyi kategoride görüntülemek için Mega menüyü kullanır, yani Spor> Sporlar> Field Hokeyi. Pouse Mega pouse tekil menü
Özellik görüntüsü, önemli hikayeleri vurgulamak için site boyunca Mega Pouse menüsünde de kullanılır. Gürcü Devlet Üniversitesi Mega Mezunlar Menüsü Georgia Eyalet Üniversitesi
Georgia State University web sitesindeki Mezunlar Menü öğesi başka bir etki alanına özel bir bağlantıdır.
Jamie Oliver Jamie Oliver tarifi mega menü
En mega menü! Jamie Oliver sitesi, tabletler ve hücresel için ayrı bir hamburger menüsü içerir. İngiliz kürekçesi Mega bilgi menüsü kürek İngilizce
Mega WordPress menüsü hangi özellikleri içerebilir? Menü bağlantısına ek olarak, bunlar olabilir: bölümün başlığı
Görüntüler
simge
tanım
Görüntüler veya videolar içerebilen widget
Mega menülerin çoğu imleci yönlendirirken, imleci yönlendirirken veya yatay menü çubuğundan tıklarken görüntülenir. Bazı eklentiler mega dikey menü de yapabilir. Hover Intent, kullanıcının fare hareketi niyetlerini anlamaya çalışan bir jQuery eklentisidir. Bu nedenle, menü öğesinin üzerindeki kasıtlı yavaş hareket ederken hızlı çekme menüyü açmayabilir.
Mega WordPress Eklenti Menüleri WordPress sitenize mega menüler eklemeyi düşünürseniz, iyi işlev gören bir dizi ücretsiz ve ücretli eklenti vardır.
Mega Max Menü (Ücretsiz)
Özellikler şunları içerir: Dostu Erişilebilirlik: Navigasyon klavyesi desteklenir.
Alt menü geçişleri için animasyon.
Menü öğelerini gizleme veya bağlantıları devre dışı bırakma seçenekleri.
Dikey menüler ve Chordeons dahil daha fazla özelliğe sahip premium sürümler.
Max Mega Menü (Ücretsiz) ile ilgileniyor musunuz?
Detaylar
WordPress için Mega Menü Eklentisi – AP Mega Menü (Ücretsiz)
Özellikler şunları içerir: Mega dikey menü.
Sürükle ve bırak ile bir menü oluşturun.
Cep telefonundaki menüyü gizleme seçenekleri.
Solma veya slayt geçişi.
Premium sürüm, daha fazla simge ve kendi simgeniz gibi daha fazla özellik ile kullanılabilir.
WordPress – AP Mega Menü (Ücretsiz) için Mega Menü Eklentisi ile ilgileniyor musunuz?
Detaydemo
Ubermenu (19 $)
Özellikler şunları içerir: Alt menü BERTU.
Ortaya çıkan menü dinamiktir.
Hücresel menü ve tablet.
Animasyonlu menü.
Ubermenu (19 $) ile ilgileniyor musunuz?
Detaydemo
Mega’nın Ana Menüsü (14 $)
Özellikler şunları içerir: 1600+ simgeler.
WPML ile uyumlu.
Diğer menü öğeleri (logo, arama) ekleyin. Mega’nın ana menüsüyle ilgileniyor musunuz (14 $)?
Detaydemo
WP Mega Menü Pro (18 $)
Özellikler şunları içerir:
Mega sekme menüsü. 14 Mevcut deri.
WP Mega Menu Pro (18 $) ile ilgileniyor musunuz?
Detaydemo
Kahraman Menüsü (19 $)
Özellikler şunları içerir:
WooCommerce etkinleştirildi. Menü için arka plan.
Yapışkan menü.
Kahraman menüsü (19 $) ile ilgileniyor musunuz?
Detaydemo
Noo Menü (15 $)
Özellikler şunları içerir:
Şeffaf menü. Önceden ayarlayın/yükleyin.
NOO menüsü (15 $) ile ilgileniyor musunuz?
Detaydemo
Mega Max Menü ile Mega Menü Nasıl Yapılır Mega Menü Nasıl Oluşturulur Bakalım. Bu örnek için, lahana temasını kullanarak çeşitli tariflerle yiyecek tabanlı bir site oluşturuyorum. İlk adım, görünüm> menü kullanarak menünüzü oluşturmaktır, alt menü öğesini doğru şekilde netleştirdiğinizden emin olun. Mega menü, bir alt menü öğesinde değil, yalnızca üst düzey menü öğesinde yapılabilir. Menü için eklenti seçeneğine erişmek için imleci menü öğesine işaret edin ve Mega menüyü seçin.
Görüntü eklemek için WordPress 4.8’de yeni bir resim widget’ı kullanın.
Max Mega Menü Resim Widget
Ve bu, test web sitemin önündeki görünüm: Önde resim bulunan Max Mega Menü
Video eklemek için WordPress 4.8 video widget’ı kullanın ve URL’den video ekleyin. Veya Semat video kodunu metin widget’ına ekleyin. Aşağıdaki görünüm: Video ile Max Mega Menü
Eklentideki simge bölümünden menü simgeleri de ekleyebilirsiniz. Max Mega Menüde Dashicons Varsayılan
Harika bir yazı tipi eklemek için, jenerikler veya özel simgeler, bir site için 23 $ değerinde olan bir Pro sürümü gerektirir. Menünün görüntülendiği sütun sayısını seçebilir ve öğeleri gruplandıran çok sütunlu bir düzen yapabilirsiniz.
Maks Mega Menü 2 sütununun düzeni, iki sütunun düzenini derledikten sonra, ön uçtaki sonuçlar şunlardır:
Max Mega Menü 2 Sütun Düzeni Alt menü çorbası için
En son yayınları eklemek için son yayın widget’ını küçük resim eklentisi ile kullanıyorum. Yatay olarak dizilmiş hale getirmek için, bir sütun ve birkaç CSS düzeninde bir widget kullanıyorum. Resmin tek nedeni mükemmel bir şekilde sıralanmamıştır, çünkü yüksekliğin farklı olması! Bu sonucu elde etmek için kullandığım CSS:Ve Mega Menem’imin test sitemin önünde nasıl bulunduğunu tekrar görün, bu sefer üç sütunla: Üç sütun düzenindeki son gönderi
Mega menüsüne öğeleri ekleme veya değiştirme otomatik olarak kaydedersiniz. Menü yapısına yeni öğeler eklerseniz menüyü kaydetmeyi de tıklamayı unutmayın. Cep telefonumdaki tabletler ve hücresel için maksimum mega menüyü kullanarak, temalarımdan biri olan ve Max Mega menü tarafından üretilen iki hamburger menüsü ile bittim. Tema menüsü devre dışı bırakılır, bu nedenle CSS ile gizlenmelidir. İmleci yönlendirecek bir durum olmadığından, etkinlik imleci yönlendirme ve imleç işlevlerini bir tıklama olayı olarak yönlendirme noktasıdır ve alt menüyü açmak için bir ritimdir.
Bir alt menü olarak mega menüye sahip üst düzey menü öğesi (örn. Ana ders), kullanıcı yeni sekmede dokunmadığı ve açmayı seçmedikçe telefonda erişilemez. Bunun üstesinden gelmenin bir yolu, özel hücresel menüler için başka bir eklenti kullanmaktır. Max Mega Menü, cep telefonunda her şeyi en uygun şekilde görüntüleymez. Sütun sayısını ikiden bire değiştirdim, ancak gösterildiği gibi çorba menümdeki içeriği karıştırma etkisi var. Karışık video sütununa sahip bir Android telefondaki Max Mega Menüsü de doğru görüntülenmez. Küçük ekran boyutunun yanıt verebilirliği ile ilgili bir sorun var.
Android telefonlarda bağlantısı kesilen video widget’ı görüntüle
Ubermenu Ubermenu ile Mega Menü Nasıl Yapılır Mega menünüz üzerinde daha ince bir kontrol sağlar. Her menü öğesi ayarlanabilir. Ayrıca bazı seçeneklerin düzenlenebileceği ve miras alınabileceği küresel kontrol panelleri de vardır, örneğin varsayılan görüntünün boyutu. 20’den fazla konjenital cilt vardır. “Basit yeşil” i seçtim. Bireysel öğe kontrolleri: Genel – Metin tesviye seçenekleri dahil çeşitli ayarlar ve sınıflar veya CSS kimlikleri ekleyin.
Ikon – Bir menü ile görüntülenecek simgeyi ayarlayın. Tam erişim için, Ubermenu simgesinin (8 $) uzantısına ihtiyacınız var. Menü öğenizin yanında resimler ne görüntülenir.
Düzen – Sütun ekranını ve kullanılan görüntünün konumunu seçin.
Alt menü – alt menünün ekranını yapılandırma.
Özel İçerik – Widget kullanmadan HTML ve kısa kodlar hızlı bir şekilde ekleyin.
Widget – Widget alanını menüye girin ve sütun sayısını seçin.
Stilin Özelleştirmesi – Farklı menü öğeleri için renk ve dolgu seçin.
Duyarlı – Menüyü farklı bir kesme noktasında gizleyin veya devre dışı bırakın.
Eski – Yeni bir kullanıcıysanız bunu güvenle görmezden gelebilirsiniz.
Ubermenu #1’in gelişmiş öğesiyle yapabileceğiniz harika şey. Google haritası ve iletişim formumla iletişim sayfaları için bir alt menü oluşturmak, iki sütuna ayarlanan Widget öğesi alanını kullanarak buna ulaşır. Her iki widget da görünüm> widget’lar adlı Ubermenu widget bölgesine eklendi.
Google Haritası ve İletişim Formu#2 ile Ubermenu Widget. İki özel sütununun düzenini yapmak, çorba alt menüsü için sütun öğeleriyle buna ulaştı.
Sütunları kullanarak Ubermenu çorba alt menüsü
#3. “Blog” un altındaki son üç blog gönderisini ekleyin Maks mega menüsünde aynı şeyi yapmaktan çok daha kolaydır çünkü üç otomatik sütunun düzenini seçebilirim. “Dinamik yazı” öğesinde, içinde zaten var olan birkaç gelişmiş sorgu WP’si vardır. İstersem, kategorilere göre filtreleyebilir, sıralama dizilerini değiştirebilir veya yayınları hariç tutabilirim.
Ubermenu 3 blog sütunları dinamik yayınlarla #4. Gıda teması yerine alt menü kullanarak wooCommerce ve kukla verileri yükledim. Bu, blok sekmesini kullanarak mağazamın menü ayarıdır.
Sekmelerle dükkanlar için ubermenu hazırlanması Her ürün kategorisi için dinamik mesajların sayısını, alt menü ile Anggu ile eşleştirecek şekilde ayarlıyorum.
Alt menü sekmesi ile ubermenu dükkanı Cep telefonumda tabletler ve hücresel için ubermenu kullanarak, üst düzey menü öğesini vurmanın bir kez alt menü açtığını ve sayfayı tekrar vururken buldum. Bazı menü davranışının biraz beklenmedik olduğunu görmeme rağmen, kullanıcıların üst düzey menü öğelerine erişebilmeleri yararlıdır. Her alt menü, altta kapatmak için bir kapak bağlantısı vardır. Sütun düzenim çorba alt menüsü için korundu.
Android telefonlarda ubermenu çorba alt menüsü Ancak, sütun düzeninde çalışan video widget’larıyla ilgili sorunlar yaşamaya devam ediyorum. Video için seman kodu olan özel içerik öğeleri daha iyi, ancak hücresel olarak kesilir.
Android cep telefonuna özel içerikle gömülü videoları olan Ubermenu, masaüstündeki yatay sekmeden cep telefonundaki dikey sekmeye kadar sekmeleri değiştirir. Android telefonlarda ubermenu sekme alt menüsü
Herkes için mega menü mi? Mega menü çok güçlüdür ve en son konular, eğitim ve E-Niaga gibi bazı endüstriler için iyi işlev görür. İyi bir yol olabilirler: Çevrimiçi mağazalar için ürün kategorisini ve satış öğelerini vurgulayın.
Kullanıcıları Sitenin belirsiz bölümünü bildirir ve amaçlarını açıklar e. Gönderme veya ürün fotoğrafları için üstün görüntüler gösterin.
Ancak her bir site türü için uygun değildirler. Mega menü kullanan küçük ve basit bir siteniz varsa aşırı derecede olacaktır. Gördüğünüz gibi, ekran sorunlarını ve etkileşimlerini önlemek için cep telefonlarındaki mega menü davranışının dikkatle kontrol edilmesi gerekir. Ayrıca mobil cihazlar için büyük menüler arzu edilmeyebilir. Ayrıca bir mega menü ile SEO problemleri için bir potansiyel vardır – çok fazla bağlantı seyreltmeye neden olabilir “Bağlantı Suyu”. Son olarak, kullanıcı onunla etkileşim kurmaya çalıştığında çok hızlı kaybolan mega menü izin verilmeyen bir şeydir. Ne olursa olsun, sitenizin navigasyonunu mantıklı bir şekilde planlamak ve kullanıcıların istenen hedefe ulaşmak için çok fazla tıklama yapmaları önemlidir. Ayrıca: Her sayfada görülen bir arama kutusu var.
Üst seviye sayfanıza bir çocuk sayfası ekleyin.
Site haritasını kullanmayı düşünün.
Bir sitede mega menüyü kullandınız mı? Kullanıcı deneyimine yardımcı oluyorlar mı? Aşağıdaki yorumlarda bize fikrinizi anlatın.
Etiket:
Menü
navigasyon
