Diner: un aspect Divi gratuit pentru restaurante

Există un tip de afacere locală care are nevoie disperată de site-uri web simple și informative: restaurante. Când vine vorba de restaurantul obișnuit, vizitatorii site-ului doresc de obicei doar câteva informații: locație, oră și meniu. Dacă sunt oferite comenzi sau rezervări, atunci și numărul de telefon. Dacă puteți oferi aceste lucruri într-un format atractiv, ați făcut-o! Ați satisfăcut nevoile a 99,9% dintre persoanele care își caută afacerea online. Am vrut să creez o resursă gratuită pe care orice proprietar de restaurant care utilizează Divi să o poată folosi pentru a pune în funcțiune rapid și ușor un site atractiv de o singură pagină. Așa că am creat Diner, un pachet de layout Divi gratuit care oferă toate secțiunile de informații esențiale de care are nevoie un restaurant local. Bucurați-vă!

Ce este inclus în pachetul Diner Layout? Acest aspect este simplu și nu are mult CSS personalizat, cu toate acestea, ceea ce are în abundență este marjele negative. Cea mai mare parte a personalizării a fost făcută utilizând marja de încorporare Divi, umplutură și controale de jgheab. Pentru a găsi mai multe informații despre marja negativă și cum să o utilizați, consultați acest post de Tom Ewer. Aspectul are 6 secțiuni: antet principal, informații generale, meniu, rezervare, recenzii și detalii de contact. Puteți extinde aspectul clonând rânduri sau secțiuni. Descărcarea pachetului Diner Layout

Pentru a utiliza Free Diner Divi Layout pe propriul site Divi, va trebui mai întâi să îl descărcați folosind butonul de mai jos. Pentru a avea acces la descărcare, va trebui să vă abonați la lista noastră de e-mail Divi Daily folosind formularul de mai jos. Ca nou abonat, veți obține și mai multă bunătate Divi. În plus față de posibilitatea de a descărca DiviStar Layout Pack, vă vom trimite și Ultimul Divi Landing Page Layout Pack, precum și să vă oferim o sursă continuă de resurse Divi noi (și gratuite), sfaturi, trucuri și știri. Dacă sunteți deja pe listă, pur și simplu introduceți adresa de e-mail de mai jos și faceți clic pe descărcare. Nu veți fi abonat de două ori.

Apoi, găsiți fișierul Diner-layout-by-olga-summerhayes.zip în folderul de descărcări și dezarhivați-l. Apoi, navigați în administratorul dvs. WordPress la Divi> Biblioteca Divi și faceți clic pe butonul „Import & Export” din partea de sus a paginii. Când apare modalitatea de portabilitate, accesați fila Import. Faceți clic pe butonul „alegeți fișierul” și selectați fișierul Diner-Layout-for-Divi.json. Apoi faceți clic pe butonul albastru „Import Divi Builder Layout” și așteptați finalizarea importului.

Odată ce importul s-a încheiat, veți avea posibilitatea de a încărca noul dvs. aspect diner pe orice pagină alimentată de constructor accesând Încărcare din bibliotecă> Adăugare din bibliotecă. Configurarea pachetului Layout Diner Pentru ca navigarea să arate exact ca demonstrația, urmați pașii de mai jos. Primul pas este de a face navigarea să funcționeze. Accesați Aspect> Meniuri și deschideți meniul principal (sau creați unul dacă este un site nou). Mai întâi adăugați pagina de navigare care conține aspectul. Următorul pas este să adăugați linkuri personalizate pentru a activa navigarea către diferite secțiuni de pe pagină. În aspect am atribuit deja un ID unic tuturor secțiunilor.

ID secțiune bucătar = „bucătar” ID secțiune meniu = „meniu” Secțiunea cu ID de rezervare = ”rezervare” Secțiunea de recenzii ID = ”recenzii” Secțiunea de detalii de contact ID = „contact”. În partea stângă a paginii deschideți Linkuri personalizate> în câmpul „URL” adăugați #sectionID, în „Link Text” adăugați textul pentru meniul dvs. > Faceți clic pe „Adăugați la meniu”. De exemplu, pentru a adăuga linkul la secțiunea Chef, adăugați următoarele: URL: #chef Textul legăturii: bucătar Faceți clic pe „Adăugați la meniu” Va trebui să o repetați pentru toate cele 5 secțiuni. Adăugarea CSS personalizat în Opțiunile temei Divi Acum trebuie să eliminăm caseta de umbră din navigare.

Accesați Divi> Opțiuni temă> derulați în jos până la secțiunea CSS personalizată și adăugați acest cod: #main-header, #main-header.et-fixed-header {
-webkit-box-shadow:none !important;
-moz-box-shadow:none !important;
box-shadow:none !important;
}
Faceți clic pe butonul „Salvați modificările”. Setări Customizer Accesați Divi> Personalizare temă> Antet și navigare> Format antet. Pentru Stil antet alegeți „Sigla în linie centrată”, lăsați alte opțiuni debifate. Accesați Divi> Personalizator temă> Antet și navigare> Bara de meniu principală. Verificați următoarele opțiuni: „Realizați lățimea totală” și „Ascundeți imaginea siglei”.

Înălțimea meniului: 52 Înălțimea maximă a siglei: 54 (implicit) Dimensiune text: 19 Spațierea literelor: 1 Font: Josefin Slab Culoarea textului: rgba (0,0,0,0,6) Culoare Linkd activă: # 2b3035 Culoarea fundalului: #ffffff Culoarea meniului drop-down: #ffffff Culoarea liniei meniului drop-down: # 08cac4 Culoarea textului meniului drop-down: rgba (0,0,0,0,6) Comutați la Divi> Personalizare temă> Antet și navigare> Setări de navigare fixe: Setările pe care trebuie să le modificăm: Bifați „Ascundeți imaginea siglei” Înălțimea meniului fix: 52 Dimensiunea textului: 19 Culoarea fundalului meniului principal: #ffffff Culoare legătură meniu principal: rgba (0,0,0,0,6) Culoare legătură meniu principal activ: # 282a2d

Când totul este gata, faceți clic pe butonul „Salvați și publicați” din partea de sus. Navigarea dvs. ar trebui să arate ca demonstrația. Pachetul Diner Layout de Olga Summerhayes Aspectul Diner este perfect pentru oricine dorește să creeze un site web simplu pentru un restaurant local. Puteți chiar să duplicați și să refaceți diferitele secțiuni și module de pe acest aspect unic de pagină pentru a vă extinde site-ul în mai multe pagini care respectă aceeași estetică de design.

Orice cereri de aspect? Dacă sunteți interesat să vă extindeți Biblioteca Divi cu pachete de layout Divi și mai gratuite (și cine nu ?!), lăsați-ne un comentariu mai jos cu solicitarea dvs. pentru următoarea noastră! Avem o listă de alergare drăguță și intenționăm să menținem aceste cadouri ca o bază obișnuită a blogului.

Asigurați-vă că vă abonați la newsletter-ul nostru de e-mail și la canalul YouTube, astfel încât să nu pierdeți niciodată un anunț mare, un sfat util sau un cadou gratuit Divi!