Ako pridať vyhľadávacie pole do sekundárnej ponuky Divi

Bez vyhľadávacieho poľa bude navigácia na vašich stránkach trpieť. Môžete mať najrobustnejšie skúsenosti s prehliadaním na internete, ale ak vaši používatelia nevedia hľadať presne to, čo hľadajú, riskujete (a pravdepodobne prídete) o podnikanie. Tento tutoriál vás prevedie pridaním vyhľadávacieho poľa do sekundárnej ponuky Divi, takže v každom prípade budú vaši používatelia vždy vzdialení pár kliknutí od všetkého, čo potrebujú.

Prehľad vyhľadávacieho poľa Divi

kancelária

Mobilné

Stiahnite a / alebo upravte globálnu hlavičku

V tomto článku použijeme bezplatnú hlavičku / pätu, ktorá je súčasťou nášho balíka rozloženia dodávky potravín. Môžete si jednoducho stiahnuť súbor .Zip *: francúzština archivovať a extrahovať potrebné .json súbor vo vašom počítači.

Potom prejdite na svoj hlavný panel WordPress a prejdite na Divi - generátor tém. Odtiaľ musíte kliknúť na ikona šípok hore a dole otvoriť možnosti prenosnosti.

V novom režime kliknite na import kartu a nájdite súbor .json súbor, ktorý ste stiahli. Keď budete pripravení, vyberte Importujte modely generátorov z Divi téma spustite sťahovanie.

V tomto mieste ste pripravení vstúpiť do Globálna hlavička časť Šablóna webovej stránky V predvolenom nastavení. Importovať z .json súbor mal automaticky použiť freebie ako hlavičku celej stránky.

Pridajte vyhľadávacie pole na sekundárny panel s ponukami

Pri použití Divi Visual Builder by ste mali vidieť niečo podobné tomuto ako globálna hlavička.

Prvá vec, ktorú chceme urobiť, je vytvoriť priestor pre vyhľadávacie pole. Chceme sa uistiť, že vyhľadávacie pole bude ľahko dostupné pre každého. Návštevníci, takže ho pridáme do sekundárneho menu (nad Domov / Kontakt riadok).

Na začiatok pridáme vyhľadávacie pole pomocou Vyhľadávací modul Divi v treťom stĺpci prvého riadka.

Zástupný text je dôležitý pre vyhľadávacie polia, takže keď je modul na mieste, prejdite na Parametre a nastavte si Vyhradená oblasť text na niečo, čo používateľovi pripomína, čo má hľadať. dali sme Nájdite položky! ako zástupný symbol, aby používateľ vedel, že to je to, čo môže hľadať, pretože používame balíček rozloženia na doručovanie potravín.

Vyhľadávacie pole v treťom stĺpci nie je dobré. Chceme teda vstúpiť do Výskumný modul nastavenia a prejdite na Dizajn jazyk. Nájdi to Transformer možnosti, potom prejdite na preložiť záložka (druhá). Potom môžete presuňte vyhľadávací modul na miesto a Divi zvládne všetky CSS a medzery.

Tiež pre túto hodnotu používame%, aby zostala relatívna bez ohľadu na výrez na pracovnej ploche. Použitím pixelov môže skresliť niektoré rôzne rozlíšenia.

divi Transformer Translate možnosti je potrebné upraviť aj pre mobil. Ak nie, je to to isté. Preto určite choďte do reaktivita nastavenia a v možnostiach sekundárneho menu nastavte umiestnenie vyhľadávacieho modulu. Upravili sme len vertikálne umiestnenie mobilu, pretože jeho umiestnenie do tretieho stĺpca riadku ho automaticky zobrazí v spodnej časti riadkových položiek.

Styling vyhľadávacieho modulu Divi

Aj keď nemáte veľa možností štýlu pre vyhľadávacie pole, máte ich niekoľko. Menovite farba textu a samotného poľa, a to ako v prípade, že je neaktívny, tak aj vtedy, keď naň používateľ klikol. (Rozstup a dimenzovanie a ďalšie štandardné možnosti dizajnu Divi, samozrejme.)

Možnosti farieb nájdete v časti Chrúmať menu v Dizajn jazyk. Po rozbalení máte možnosť upraviť farbu textu zástupného symbolu, farbu pozadia poľa a farbu textu poľa (text zadaný používateľom, t.j. povedať). Okrem toho sústrediť sa variácie nastanú vtedy, keď používateľ konkrétne interaguje s vyhľadávacím poľom.

Keď je tento štýl podľa vašich predstáv, kliknite na tlačidlo Uložiť.

Skontrolujte nastavenia viditeľnosti

Niektoré z našich bezplatných balíkov rozloženia a hlavičiek majú rôzne možnosti zobrazenia pre stolné a mobilné zariadenia. Ak vo vizuálnom builderi vidíte stmavené / sivé režimy, znamená to, že na niektorých zariadeniach je tento režim zakázaný.

V prípade hlavičky dodávky potravín sú posledné dva stĺpce v mobile zakázané. Chceme vstúpiť do Nastavenie linky a kliknite na nastavenia stĺpcov, ktoré chcete zobraziť v mobile. V tomto prípade ide o tretie.

Potom prejdite na pokrok jazyk a prejdite na viditeľnosť možnosť. Tu sa uistite, že sú uvedené všetky možnosti uvedené nižšie deaktivácia sommes nekontrolovane pre stĺpec obsahujúci vaše vyhľadávacie pole. Kliknite na tlačidlo Uložiť (zelený kliešť) a moduly by sa mali zobrazovať farebne a už by nemali mať zmenenú farbu.

Keď sa ubezpečíte, že je všetko viditeľné, ste pripravení dať túto vec online!

Uložte svoju prácu

Nezabudnite kliknúť na zelené tlačidlo uložiť v pravom dolnom rohu obrazovky.

Teraz ste pripravení zavrieť vizuálny generátor pomocou X v pravom hornom rohu. Na ďalšej obrazovke sa budete chcieť uistiť, že Divi Theme Builder uložil všetky vaše možnosti. Ak hovorí Uložte zmeny, Kliknite na tlačidlo. Ak hovorí Všetky zmeny boli uložené, potom je vaše vyhľadávacie pole už aktívne v sekundárnej ponuke Divi.

Konečné výsledky

Zostáva už len obdivovať vašu prácu na vašom webe!

kancelária

Mobilné

Záver s vyhľadávacím poľom Divi

Vyhľadávacie polia sú základnou súčasťou dobrej používateľskej skúsenosti s vašimi stránkami. Ak chcete svojim zákazníkom poskytnúť tie najlepšie možné služby Návštevníci, jednou z vašich hlavných priorít by malo byť zabezpečenie možnosti vyhľadávania obsahu. Dúfam, že túto rýchlu a jednoduchú metódu využijete a čoskoro ju použijete na svojej stránke Divi!