Divi Eklenti Spot Işığı – Hücresel Menü Ayarı

Mobil menünüzü masaüstü menünüzden ayrı olarak ayarlamak istediniz mi? Divi menü sistemi, menüyü Hamburger simgesine yerleştiren hücresel ayarları içerir, ancak hücresel için farklı bir başlık kullanmak, yeni stiller eklemek veya hatta menüyü açma veya kapatma eylemini canlandırmak istiyorsanız ne olur? Bunu Customer Mobile Menüsü adı verilen üçüncü taraflı bir eklenti ile yapabilirsiniz. Bu eklentinin spot ışığında, hücresel menünün divicio.us’dan ayarlanmasını göreceğiz ve ne yapabileceğini ve web sitenizi yükleme zamanındaki etkisini göreceğiz. Bu örnekteki resim unssplash.com’dan çekilmiştir.
Hücresel Menü ayarının yüklenmesi

Önce indirilen dosyayı çıkarmanız gerekir. İçinde üç dosya göreceksiniz:
Değişim yeri
Divi-mobile-mobile-cümlesi
Beni oku
Divi-Mobile-Mobile-Custominer dosyasını yükleyin ve etkinleştirin.

Gösterge tablosundaki eklenti menüsünde DMMC eklentisi lisansı adı verilen yeni bir bağlantı var. Bunu tıklayın ve güncelleme almak için lisans anahtarınızı girin. Yeni Tema Ayarlama Ayarları

Hücresel menü ayarı adı verilen temanın ayarlanması için yeni menü öğesi eklendi. Seçmek, hücresel menüyü kullanarak web sitenizi mobil ekranda otomatik olarak görüntüler. Tablet modunu da seçebilirsiniz. Menüde yedi menü var.
Menü Strack Ayarları

Menü başlığı ayarları, başlığın arka plan rengi, metin rengi ve simge, simge biçimi, açık ve kapalı menüler için metin türü, metin boyutu, simge boyutu, yazı tipi stili çubuğu menüsü ve açılır menünün üst kısmı için ayarları içerir.

Başlığın arka plan rengini ve metnin ve simgenin rengini değiştirdim. Metin ve menü simgelerini görüntülemeyi, görüntülemek istediğim metni girmeyi ve kalın ve eğik yazı tipi stilini seçmeyi seçtim. Varsayılan olarak metnin ve yazı tiplerinin boyutunu bıraktım. Ayrıca soldaki simgeleri ve sağda metin, yalnızca metin veya sadece simgeleri görüntüleyebilirim. Açık menü için görüntülenecek metni girdim ve X simgesini görüntülemeyi seçtim. Ayrıca 5. ofset üst ofsetini ayarladım Menü sadece ayarlanabileceğini göstermek için. Menü Ayarları

Menü ayarları sabit bir menü, tam genişlik (portre modunda), dolgu, üst çubuğun arka plan rengi, metin ayarları ve sınır ayarları içerir. Web sitesini Portre Modunda otomatik olarak görüntülemesini seviyorum, ancak manzara modunda nasıl görüleceğini görmüyorum, bu yüzden tam menü efektini göremiyorum. Menü açıldığında ekranda kalacak şekilde tamir edilecek şekilde ayarladım. Menünün üst bıçaklarını ve arka plan rengini düzenledim ve metni odakladım. Biraz arka plan göstermek için opaklık ayarladığımı görebilirsiniz.

Ayrıca yazı tipi, yazı tipi renginin mesafesini ve boyutunu artırdım ve sınır, yarıçap ve rengin genişliğini ayarladım. Bu ikinci örnekte, sağ ve sol sınırların üst sınırının ve genişliğinin yarıçapını ayarladım. Küçük bir vardiyanın varsayılan ayarlara geri dönmesi için bir düğmesi varsa çok yararlı olacaktır. Menü Tahıl Ayarları

Menü öğelerinin ayarları menüdeki tek tek öğeler için geçerlidir. Marjı, yüksekliği, arka plan rengini, sınır genişliğini, sınır yarıçapını ve sınır rengini ayarlayın. Bu örnekte, marjı 4’e çıkardım, öğenin yüksekliğini 22’ye düzenleyerek, sınırın genişliğini 5’e ve sınır yarıçapını hafif yuvarlak bir açı vermek için 8’e çıkardım.

Alt menü ayarları, alt menünün kaldırılabilmesini, arka plan rengini ve bağlantısını değiştirmeyi mümkün kılar ve boyut ve yazı tipi stilini ayarlar. Rengi ayarladım, yazı tipi boyutunu 14’ten 16’ya yükselttim, eğime ayarladım ve katlanmış hale getirdim. Gölge
Gölge, giriş ve çıkış, ofset x ve y, bulanık, yayma ve renk yönünü kontrol etmenizi sağlar. Bunu X-Ofset 20, Y-Offset -17, Flash Shadow 5 ile başlayacak ve 10 yayılacak şekilde ayarladım. Eğim

Degrade başlık menüsüne ve menünün kendisine uygulanabilir. Bu size her biri için durağın konumu ile üç renk verir. Açıyı da değiştirebilirsiniz.

Bu bir menü gradyanı ekranıdır.

Menü ve başlık menüsü için farklı bir gradyan da görüntüleyebilirsiniz. Aşağıdaki gradyanlar farklı açılarla aynıdır ve başlık menüsü için konum duraklarıdır. Animasyon

Animasyonlar, her biri 10 animasyonla birlikte açık animasyon için biri ve kapanış animasyonu için iki açılır liste sağlar. Animasyonlar arasında solma, büzülme, yakınlaştırma, flip vb. Animasyonu istediğiniz herhangi bir kombinasyonda kullanabilirsiniz.

Bu sağda solma kullanır ve sol sola solar.

Bu, büyümeyi ve büzülmeyi kullanır.

Bu, X’i X’de kullanır ve Y çevirir. Şimdiye kadar ortak bir ayar kullanarak, ne yaptıklarını görebilmeniz için her menü öğesini ayrı ayrı vurguladım. Birleştirildiğinde bazı görünüm örnekleri.

Bu örnekte, bağlantının menüsünün ve renginin arka planını ayarladım, menü simgelerini metinle değiştirdim, bıçakların rengini değiştirdim, menü öğesinin yüksekliğini ayarladım, üst sınırdan vazgeçtim, alt menü yazı tipini ayarladım Kalın ve eğik, renk alt menüsünü ayarlayın ve böcekleri kullanarak gölgeyi verin ve ayarları yalnızca görünecek şekilde ayarlayın.

Bu, 12 ila yuvarlak açı yarıçapı olan bir ofset sınır genişliği kullanır. Sınır rengi kırmızıdır. Yazı tipinin boyutunu ve genişliğini maksimuma çıkardım. Arka plan, 0.87 opaklığı ile siyahtır. Başlık 0.55 opaklığı ile siyahtır. Menü bağlantısı, gerilme menüsü sınırına uyacak şekilde kırmızıdır.

Bu örnek yazı tipi boyutunu artırır ve başlıklar ve açılır menüler için çeşitli kırmızı gradyan nüansları kullanır. Üst bıçakların rengini koyu kırmızı renge uyacak şekilde ayarladım. Ayrıca menünün yüksekliğini ayarladım.

Bu örnek 100 için bir ofset açılır menüsü kullanır ve onarılmaz. Yazı tipinin mesafesi ve yazı tipi boyutu en üst düzeye çıkarılır. Menü sınır yarıçapı 50’ye ayarlanmıştır ve sınır genişliği 5 olarak ayarlanmıştır. Metin düzdür. Opaklık 30 ile beyaz arka plan.

Menü öğesi sınırının genişliği 1 ve parmaklar 25’tir. Aynı siyah arka planı kullandım, ancak opaklık ile .08 ve sınır opaklığı .12’dir. Alt menü ayarlarının arka plan opaklığı 0.55 ve beyaz yazı tipi vardır. Gölge, 0.17 opaklığı ile aynı siyah rengi kullanarak biraz öne çıkıyor. Gölge ofseti x ve y için 16 olarak ayarlanır. Gradyanı çeşitli gölge ve opaklık seviyelerine sahip siyah kullanarak başlığa koydum. Bazı küçük ayarlamalar görünümü tamamen değiştiriyor. Bu, ortada kalın bir yazı tipi ve 0.90 arka plan opaklığı kullanır.

Tablet modunda aşağıdaki menü görüntüleme. Ayarlar yaparken modlar arasında geçiş yapmak daha iyidir. Güncelleme – İki yeni ayar

Bu makale yayınlanmadan önce iki yeni ayar eklendi: menü arka planı ve simgeler. Arka Plan Görüntü Ayarları
Arka plan görüntü ayarları, gerilme menüsünün arkasına yerleştirilecek resimleri yüklemenize olanak tanır. Boyutu, konumu, tekrarlanırsa ve sınır için nasıl klipsleri seçebilirsiniz. Menü simgesi ayarları

Menü simgesi ayarları, her menü öğesi için simgeler seçmenize ve boyutu ve konumu ayarlamanıza olanak tanır. Hücresel Menü Çıkma Sayfasının Hız Testi

Eklenti, etkinleştirilen tüm özelliklerle birçok efekt verdiğinden, PagePeed Insights kullanarak test etmeye karar verdim. Eklenti devre dışı bırakıldığında, test sunucum 70 puan aldı. Bir madenleştirme veya önbellek eklentisi kullanmadım.

admin

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir