Lokanta: Restoranlar için Ücretsiz Divi Düzeni

Basit, bilgilendirici web sitelerine umutsuzca ihtiyaç duyan bir tür yerel işletme vardır: Restoranlar. Ortalama bir restoran söz konusu olduğunda, web sitesi ziyaretçileri genellikle sadece birkaç parça bilgi ister: konum, saatler ve menü. Sipariş veya rezervasyon teklif edilirse, telefon numarası da. Bunları çekici bir biçimde sunabiliyorsanız, başardınız demektir! İşletmenizi internette arayan kişilerin %99,9'unun ihtiyaçlarını karşıladınız.

Divi kullanan herhangi bir restoran sahibinin, çekici bir tek sayfalık web sitesini sorunsuz bir şekilde hızlı ve kolay bir şekilde hazır hale getirmek için kullanabileceği ücretsiz bir kaynak oluşturmak istedim. Bu yüzden yerel bir restoranın ihtiyaç duyduğu tüm temel bilgi bölümlerini sağlayan ücretsiz bir Divi yerleşim paketi olan Diner'ı yaptım. Eğlence!

Diner Layout Pack'e Neler Dahil?

Bu düzen basittir ve içinde çok fazla özel CSS yoktur, ancak bolca sahip olduğu şey negatif marjlardır. Özelleştirmenin çoğu, Divi yerleşik kenar boşluğu, dolgu ve oluk kontrolleri kullanılarak yapıldı. Negatif marj ve bunun nasıl kullanılacağı hakkında daha fazla bilgi edinmek için Tom Ewer tarafından yazılan bu gönderiye göz atın.

Düzen 6 bölümden oluşur: ana başlık, genel bilgiler, menü, rezervasyon, incelemeler ve iletişim bilgileri. Satırları veya bölümleri klonlayarak düzeni genişletebilirsiniz.

Diner Layout Pack'i İndirme

Ücretsiz Diner Divi Düzenini kendi Divi web sitenizde kullanmak için önce aşağıdaki düğmeyi kullanarak indirmeniz gerekir.

İndirmeye erişmek için aşağıdaki formu kullanarak Divi Daily e-posta listemize abone olmanız gerekir. Yeni bir abone olarak daha da fazla Divi iyiliği alacaksınız. DiviStar Düzen Paketini indirebilmenin yanı sıra, size Ultimate Divi Açılış Sayfası Düzen Paketi'ni de göndereceğiz ve size sürekli olarak yeni (ve ücretsiz) Divi kaynakları, ipuçları, püf noktaları ve haberler kaynağı sağlayacağız.

Zaten listedeyseniz, aşağıya e-posta adresinizi girin ve indir'i tıklayın. İki kez abone olmayacaksınız.

Ardından, indirilenler klasörünüzde Diner-layout-by-olga-summerhayes.zip dosyasını bulun ve açın. Ardından, WordPress yöneticinizde Divi > Divi Kitaplığı'na gidin ve sayfanın üst kısmındaki "İçe Aktar ve Dışa Aktar" düğmesini tıklayın.

Taşınabilirlik modu açıldığında, içe aktarma sekmesine gidin. "Dosya seç" düğmesini tıklayın ve Diner-Layout-for-Divi.json dosyasını seçin. Ardından mavi renkli “Import Divi Builder Layout” düğmesine tıklayın ve içe aktarmanın tamamlanmasını bekleyin.

İçe aktarma işlemi tamamlandıktan sonra, Kitaplıktan Yükle > Kitaplıktan Ekle'ye giderek yeni Lokanta Düzeninizi oluşturucu tarafından desteklenen herhangi bir sayfada yükleme olanağına sahip olacaksınız.

Lokanta Düzen Paketini Ayarlama

Navigasyonun tam olarak demo gibi görünmesini sağlamak için aşağıdaki adımları izleyin.

İlk adım, navigasyonun çalışmasını sağlamaktır. Görünüm > Menüler'e gidin ve Birincil menünüzü açın (veya yeni bir siteyse bir tane oluşturun).

Önce düzeni içeren sayfayı navigasyona ekleyin.

Sonraki adım, sayfadaki farklı bölümlere gezinmeyi sağlamak için özel bağlantılar eklemektir. Düzende zaten tüm bölümlere benzersiz bir kimlik atadım.

Şef bölümü kimliği = "şef"
Menü bölümü ID=”menü”
Rezervasyon kimliği=”rezervasyon” olan bölüm
İncelemeler bölümü kimliği=”incelemeler”
Kişi ayrıntıları bölümü ID=”iletişim”.

Sayfanın sol tarafında Özel Bağlantılar'ı açın > “URL” alanına #sectionID ekleyin, “Bağlantı Metni”ne menünüz için metin ekleyin. > “Menüye Ekle”ye tıklayın.

Örneğin, bağlantıyı Chef bölümüne eklemek için aşağıdakileri ekleyin:

URL: #şef
Bağlantı metni: şef
“Menüye Ekle” ye tıklayın

Tüm 5 bölüm için tekrarlamanız gerekecek.

Divi Tema Seçeneklerine Özel CSS Ekleme

Şimdi navigasyondaki gölge kutusunu kaldırmamız gerekiyor.

Divi > Tema Seçenekleri > Özel CSS bölümüne gidin ve şu kodu ekleyin:

#main-header, #main-header.et-fixed-header {
-webkit-box-shadow:none !important;
-moz-box-shadow:none !important;
box-shadow:none !important;
}

"Değişiklikleri Kaydet" düğmesini tıklayın.

Özelleştirici Ayarları

Divi > Tema Özelleştirici > Başlık ve Gezinme > Başlık Biçimi'ne gidin. Başlık Stili için “Ortalanmış Satır İçi Logo”yu seçin, diğer seçenekleri işaretlemeden bırakın.

Divi > Tema Özelleştirici > Başlık ve Gezinme > Birincil Menü Çubuğu'na gidin. Aşağıdaki seçenekleri işaretleyin: “Tam Genişlik Yap” ve “Logo Resmini Gizle”.

Menü Yüksekliği: 52
Logo maksimum yüksekliği: 54 (varsayılan)
Metin Boyutu: 19
Harf Aralığı: 1
Yazı Tipi: Josefin Slab
Metin Rengi: rgba(0,0,0,0.6)
Aktif Bağlantı rengi: #2b3035
Arka plan rengi: #ffffff
Açılır menü rengi: #ffffff
Açılır menü satırı rengi: #08cac4
Açılır menü metin rengi: rgba(0,0,0,0.6)

Divi > Tema Özelleştirici > Başlık ve Gezinme > Sabit Gezinme Ayarları'na geçin:

Değiştirmemiz gereken ayarlar:

“Logo Resmini Gizle” seçeneğini işaretleyin
Sabit Menü Yüksekliği: 52
Metin boyutu: 19
Birincil Menü Arka Plan Rengi: #ffffff
Birincil Menü Bağlantı Rengi: rgba(0,0,0,0.6)
Aktif Birincil Menü Bağlantı Rengi: #282a2d

Her şey bittiğinde, üstteki “Kaydet ve Yayınla” düğmesine tıklayın. Navigasyonunuz demo gibi görünmelidir.

Olga Summerhayes'ten The Diner Layout Pack

Lokanta düzeni, yerel bir restoran için basit bir web sitesi oluşturmak isteyen herkes için mükemmeldir. Hatta sitenizi aynı tasarım estetiğine sahip birden çok sayfaya genişletmek için bu tek sayfa düzenindeki çeşitli bölümleri ve modülleri çoğaltabilir ve yeniden amaçlayabilirsiniz.

Herhangi bir Düzen İsteği?

Divi Kitaplığınızı daha da fazla ücretsiz Divi düzen paketiyle genişletmekle ilgileniyorsanız (ki kim değil?!), o zaman bir sonraki talebimiz için bize aşağıda bir yorum bırakın! Güzel bir koşu listemiz var ve bu bedavaların blogun düzenli bir parçası olarak gelmesini planlıyoruz.

Büyük bir duyuruyu, faydalı ipucunu veya Divi freebie'sini asla kaçırmamak için e-posta bültenimize ve YouTube kanalımıza abone olmayı unutmayın!