Elementor je výkonný Page Builder pre WordPress, ktorý vám umožňuje vytvoriť atraktívne webové stránky bez programovacích znalostí. Jedným z najužitočnejších prvkov v Elementore je ikona-zoznam. S touto funkciou môžete vizuálne atraktívne prezentovať informácie, či už ide o zoznamy úloh, odkazy na sociálne siete alebo iný obsah. V tomto návode vám ukážem krok za krokom, ako vytvoriť a prispôsobiť atraktívny ikonový zoznam.
Najdôležitejšie poznatky
- S ikonovým zoznamom môžete ľahko pridávať vizuálne prvky.
- Každý záznam môže byť individuálne vybavený textom, ikonami a odkazmi.
- Štýl a rozloženie zoznamu je možné flexibilne prispôsobiť.
Krok za krokom návod
Krok 1: Otvorte Elementor a pridajte ikonový zoznam
Najprv otvorte editor Elementor na stránke, na ktorej pracujete. V záložke „Widgety Elementoru“ vyhľadajte možnosť „Ikonový zoznam“. Potiahnite tento widget do požadovaného časti svojej stránky.
Krok 2: Prispôsobte prvky v ikonovom zozname
Keď už je umiestnený widget, uvidíte predvolené záznamy v zozname. Počet ikon a riadkov textu môžete zmeniť pomocou príslušných možností v ľavom menu. Kliknite na „Záznam 1 v zozname“, aby ste upravili text. Môžete napísať napríklad „YouTube“.
Krok 3: Výber ikon
Pre výber vhodnej ikony pre každý záznam v zozname kliknite na oblasť s ikonami. Otvorí sa okno, kde môžete vybrať zo širokej knižnice. Hľadajte „YouTube“ a pridajte požadovanú ikonu.
Krok 4: Pridanie odkazov
Každému záznamu v zozname môžete priradiť aj odkaz. Kliknite na políčko „Odkaz“ vedľa textu a pridajte príslušnú URL adresu, napríklad odkaz na váš YouTube kanál.
Krok 5: Prispôsobenie rozloženia
Teraz môžete konfigurovať možnosti rozloženia. Vyberte medzi „Inline“ alebo „Plná šírka“. Rozhodnite sa, ako chcete vizualizovať svoj ikonový zoznam, aby zodpovedal celkovému štýlu vášho webu.
Krok 6: Prispôsobenie štýlu
Prejdite na kartu „Štýl“, aby ste zmenili vzhľad vášho ikonového zoznamu. Tu môžete nastaviť vzdialenosť medzi jednotlivými riadkami, prispôsobiť zarovnanie a aktivovať prípadné oddelovacie prvky. Napríklad si vyberte prerušovanú čiaru ako oddeľovač pre elegantný vzhľad.
Krok 7: Prispôsobenie farieb
Môžete meniť farby svojich ikon a textu. Napríklad vyberte zelenú farbu, keď nad prvkom prejde kurzor myši. Tým vytvoríte interaktívny tieňový efekt, ktorý pritiahne pozornosť vašich návštevníkov.
Krok 8: Nastavenie veľkosti písma a typografie
Aby ste zabezpečili, že veľkosť textu vizuálne zodpovedá ikonám, upravte veľkosť textu v záložke „Text“. Napríklad veľkosť nastavte na 25 a vyberte vhodnú farbu textu, aby ste dosiahli harmónický vizuálny efekt.
Krok 9: Náhľad a uloženie
Ak ste spokojní so svojím ikonovým zoznamom, kliknite na „Uložiť“, aby sa zmeny prejavili. Skontrolujte náhľad, aby ste videli, ako zoznam vyzerá vo frontende.
Krok 10: Testovanie funkcionality
Skontrolujte odkazy na vašej zverejnenej stránke, aby ste sa uistili, že všetko funguje podľa očakávania. Skontrolujte tiež, či sa zobrazujú hover efekty správne, aby ste mali interaktivitu zachovanú.
Zhrnutie
V tejto príručke si sa naučil, ako krok za krokom vytvoriť pútavý a funkčný zoznam ikon s Elementorom pre WordPress. Stačí vykonať niekoľko jednoduchých prispôsobení, aby si prispôsobil zoznam svojmu štýlu a optimalizoval používateľskú skúsenosť.
Často kladené otázky
Ako pridám novú položku do zoznamu ikon?Ľahko môžeš kliknúť na symbol "+" v widgete zoznamu ikôn a pridať nový prvok.
Môžem zmeniť ikony po ich pridaní?Áno, môžeš kedykoľvek upravovať každú ikonu kliknutím na príslušnú položku zoznamu.
Ako môžem zmeniť farby ikon?V časti Štýl v Elementor Editorovi môžeš upraviť farby ikon a textov.
Môžem pridať odkazy na sociálne médiá?Áno, každá položka zoznamu môže byť odkázaná, ideálne pre sociálne médiá.
Existuje v Elementore funkcia náhľadu?Áno, môžeš si zobraziť náhľad tvojich zmien pred uložením.
