Přejít k hlavnímu obsahu

Jak používat modul Souhrn v nástroji Divi Builder

Divi: nejjednodušší téma WordPress k použití

Divi: Nejlepší WordPress téma všech dob!

více Stahování 901.000, Divi je nejoblíbenější téma WordPress na světě. Je kompletní, snadno použitelný a je dodáván s více než šablonami 62 zdarma. [Doporučeno]

Před přidáním modulu Souhrn na svou stránku musíte nejprve otevřít Tvůrce Divi. Jakmile si téma Divi nainstalujete na svůj web, uvidíte tlačítko Použijte nástroj Divi Builder nad editorem příspěvků, kdykoli vytvoříte novou stránku. Kliknutím na toto tlačítko aktivujete Divi Builder, který vám umožní přístup ke všem modulům Divi Builder. Poté klikněte na tlačítko Použijte Visual Builder pro spuštění generátoru ve vizuálním režimu. Můžete také kliknout na tlačítko Použijte Visual Builder když procházíte webovou stránku proti proudu, pokud jste přihlášeni ke svému panelu WordPress.

tlačítko divi builder modul blog divi

Po zadání do Visual Builderu můžete kliknutím na šedé tlačítko plus přidat na stránku nový modul. Nové moduly lze přidávat pouze do řádků. Pokud začínáte novou stránku, nezapomeňte nejprve přidat na stránku řádek.

modul obnovit divi builder.png

Najděte modul Souhrn v seznamu modulů a kliknutím na něj jej přidejte na svou stránku. Seznam modulů je prohledávatelný, což znamená, že můžete také napsat slovo „Summary“ a poté kliknout na Enter, abyste automaticky našli a přidali popisný textový modul! Po přidání modulu vás přivítá seznam možností modulu. Tyto možnosti jsou rozděleny do tří hlavních skupin: Obsah , Design et pokročilý .

use case to list company services on homepage

Protože modul Souhrn kombinuje obrázky a text, aby předvedl určité funkce, můžete jej použít k přidání seznamu vašich obchodních služeb na domovskou stránku. Modul Blurb také umožňuje proměnit váš obrázek / ikonu a název na odkaz na vaši servisní stránku. V tomto příkladu použiji modul Blurb k přidání čtyř vybraných služeb na domovskou stránku.

divi.png stránce služby

Chcete-li na stránku přidat všechny čtyři Blurbs, použijte vizuální nástroj pro přidání standardní sekce se čtyřmi sloupci. Poté do prvního sloupce řádku přidejte modul Blurb.

Aktualizujte nastavení Blurb následujícím způsobem:

Možnosti obsahu

Název: [zadejte název služby] Obsah: [zadejte krátký popis služby] URL: [přidat adresu URL na stránku služby] Použijte ikonu: ANO
Ikona: [vyberte ikonu, která ilustruje vaši službu]

Možnosti návrhu

Barva ikony: # 42bb99 (vytvořte barvu, která doplní design webu)
Použijte ikonu Velikost písma: ANO
Velikost písma ikony: 68px (upravuje velikost ikony)
Orientace textu: Střed -
Velikost písma hlavy: 24px
Velikost písma: 18px
Výška řady těla: 1.5em

design služby divi.png

Nyní je váš první úvodní text dokončen.

seznam služeb divi builder.jpg

Nyní duplikujte modul Souhrn, který jste právě vytvořili třikrát, a přetáhněte každý z duplikovaných souhrnů do dalších tří sloupců. Protože vaše konstrukční parametry byly integrovány do vašich duplicitních modulů, stačí změnit obsah (záhlaví, obsah, ikona, URL atd.) A změnit barvy tak, aby vyhovovaly každé z vašich služeb.

kompletní seznam služeb divi.jpg

Souhrnné možnosti obsahu

Na kartě obsah najdete všechny prvky obsahu modulu, jako jsou text, obrázky a ikony. Vše, co ovládá co Ve vašem modulu se vždy zobrazí tato karta.

shrnutí modulu parametrů wordpress.png

Titul

Přiřaďte svému textu název, který se nad textem zobrazí tučným stylem. Možnost URL umístěná pod polem Nadpis vám umožní vytvořit z vašeho hypertextového odkazu.

Obsah

Toto pole je místo, kde můžete zadat hlavní část textu. Blurb Text pokryje také celou šířku vašeho sloupce až do 550 pixelů.

URL

Umístěte platnou webovou adresu URL do tohoto pole, aby se váš titul Blurb stal odkazem. Ponecháte-li toto pole prázdné, zůstane váš titul jako statický prvek.

Otevření URL

Zde si můžete vybrat, zda se váš odkaz otevře v novém okně.

Vytvořte si snadno svůj web pomocí Elementoru

Elementor vám umožní snadno vytvořit jakýkoli design webových stránek s profesionálním vzhledem. Přestaňte platit drahé za to, co můžete udělat sami. [Zdarma]

Použijte ikonu

Když používáte Blurbs, můžete se rozhodnout použít s textem ikonu nebo obrázek. Pokud vyberete možnost „Použít ikonu“ „Ano“, nabídnou se vám následující možnosti přizpůsobení vaší ikony. Pokud se nerozhodnete použít ikonu, budete vyzváni k nahrání obrázku.

ikona

Pokud jste pro nastavení „Použít ikonu“ vybrali „Ano“, zobrazí se tato možnost. Tato možnost vám nabídne seznam dostupných ikon, které můžete použít v reklamě. Stačí kliknout na ikonu, kterou chcete použít, a objeví se ve vašem textu.

použijte ikony divi builder.png

Obraz

Pokud jste se nerozhodli použít ikonu, zobrazí se toto nastavení. Sem vložte platnou adresu URL obrázku nebo vyberte / nahrajte obrázek prostřednictvím mediální knihovny WordPress. Obrázky v modulu Souhrn se vždy zobrazují na střed ve sloupcích a pokrývají celou šířku sloupce až do 550 pixelů. Váš obrázek však nikdy nebude větší než jeho původní velikost pro nahrávání. Výška prezentačního obrazu je určena poměrem stran původního obrázku. Proto je vhodné umístit všechny vaše prezentační obrázky do stejné výšky, pokud je umístíte vedle sebe.

Barva pozadí

Definujte vlastní barvu pozadí pro svůj modul nebo ponechte prázdné, chcete-li použít výchozí barvu.

Obrázek na pozadí

Pokud je nastaven, bude tento obrázek použit jako pozadí pro tento modul. Chcete-li odebrat obrázek na pozadí, jednoduše odeberte adresu URL z pole Nastavení. Obrázky pozadí se zobrazí nad barvami pozadí, což znamená, že při použití obrázku pozadí nebude barva pozadí viditelná.

Správce štítku

Tím se změní štítek modulu v generátoru pro snadnou identifikaci. Při použití pohledu WireFrame ve Visual Builderu se tyto štítky objeví v bloku modulu rozhraní Divi Builder.

Možnosti návrhu souhrnu modulu

Na kartě Návrh najdete všechny možnosti stylingu modulu, například písma, barvy, velikost a mezery. Tato karta umožňuje upravit vzhled vašeho modulu. Každý modul Divi má dlouhý seznam nastavení designu, pomocí kterého můžete vyladit téměř cokoli.

volba návrhu modul obnovit divi.png

Barva ikony

Pokud jste pro nastavení „Použít ikonu“ vybrali „Ano“, zobrazí se tato možnost. Tato možnost umožňuje přizpůsobit barvu vaší ikony. Ve výchozím nastavení jsou ikony nastaveny na barvu zvýraznění motivu.

Ikona kruhu

Pokud jste pro nastavení „Použít ikonu“ vybrali „Ano“, zobrazí se tato možnost. Tato možnost umožňuje umístit ikonu do barevného kruhu. Pokud pro toto nastavení vyberete „ano“, nabídnou se vám další možnosti přizpůsobení barvy a ohraničení kruhu.

Barva kruhu

Pokud jste pro nastavení „Ikona kruhu“ zvolili „Ano“, zobrazí se tato možnost. Zde si můžete vybrat barvu, kterou chcete použít pro svůj kruh. Tato barva je nezávislá na barvě dříve vybrané ikony. Vaše ikona se v její barvě objeví uvnitř kruhu s barvou, kterou zde vyberete.

Zobrazit ohraničení kruhu

Pokud jste pro nastavení „Ikona kruhu“ zvolili „Ano“, zobrazí se tato možnost. Tato možnost umožňuje aktivovat ohraničení kruhu. Pokud je vybrána tato možnost, zobrazí se další možnost pro výběr barvy ohraničení.

Kruhová barva okraje

Pokud jste pro nastavení „Zobrazit kruhový okraj“ vybrali „Ano“, zobrazí se tato možnost. Zde můžete upravit barvu okraje kruhu.

Umístění obrázku / ikony

Zde si můžete vybrat umístění svého obrázku / ikony. Může se zobrazit nad textem nebo nalevo od textu. Umístěním obrázku / ikony nalevo od textu bude obrázek menší, než kdyby byl umístěn nahoře.

Použijte velikost písma ikony

Pokud je tato možnost povolena, můžete zadat vlastní velikost ikony zobrazené nad nebo dvěma nalevo od vaší reklamy.

Barva textu

Pokud je vaše reklama umístěna na tmavém pozadí, měla by být barva textu nastavena na „Tmavý“. Naopak, pokud je vaše reklama umístěna na světlém pozadí, měla by být barva textu nastavena na „Světlá“.

Textová orientace

Tato rozevírací nabídka umožňuje určit orientaci textu tak, aby byla zarovnána doleva, na střed nebo doprava.

Hledáte ty nejlepší témata a pluginy aplikace WordPress?

Stáhněte si ty nejlepší pluginy a témata aplikace WordPress na Envato a snadno si vytvořte své webové stránky. Již více než stahování 49.720.000. [EXCLUSIVE]

Písmo záhlaví

Písmo záhlaví můžete změnit výběrem požadovaného písma z rozevírací nabídky. Divi přichází s desítkami úžasných písem využívajících písma Google. Ve výchozím nastavení používá Divi písmo Open Sans pro veškerý text na vaší stránce. Můžete také přizpůsobit styl textu pomocí možností tučně, kurzíva, velká a podtržená.

Velikost písma záhlaví

Zde můžete upravit velikost textu záhlaví. Posunutím posuvníku intervalu můžete zvětšit nebo zmenšit velikost textu nebo můžete přímo zadat požadovanou hodnotu velikosti textu do vstupního pole vpravo od posuvníku. Vstupní pole podporují různé měrné jednotky, což znamená, že můžete zadat „px“ nebo „em“ podle své velikosti a změnit typ jednotky.

modul shrnuje styl sekce title.png

Barva textu záhlaví

Ve výchozím nastavení se všechny barvy textu v souboru Divi zobrazují v bílé nebo tmavě šedé barvě. Pokud chcete změnit barvu záhlaví, vyberte pomocí této možnosti požadovanou barvu ve výběru barev.

Mezery v záhlaví

Mezery mezi písmeny ovlivňují mezeru mezi jednotlivými písmeny. Chcete-li zvětšit mezeru mezi každým písmenem textu záhlaví, upravte mezeru pomocí posuvníku intervalu nebo zadejte požadovanou velikost mezery do vstupního pole vpravo od posuvníku. Vstupní pole podporují různé měrné jednotky, což znamená, že můžete zadat „px“ nebo „em“ podle své velikosti a změnit typ jednotky.

Výška řádku záhlaví

Výška řádku ovlivňuje mezeru mezi každým řádkem textu záhlaví. Chcete-li zvětšit mezeru mezi každým řádkem, upravte mezeru pomocí posuvníku rozsahu nebo zadejte požadovanou velikost mezery do vstupní pole napravo od kurzoru. Vstupní pole podporují různé měrné jednotky, což znamená, že můžete zadat „px“ nebo „em“ podle své velikosti a změnit typ jednotky.

Body font

Písmo těla můžete změnit výběrem požadovaného písma z rozevírací nabídky. Divi přichází s desítkami úžasných písem využívajících písma Google. Ve výchozím nastavení používá Divi písmo Open Sans pro veškerý text na vaší stránce. Můžete také přizpůsobit styl textu pomocí možností tučně, kurzíva, velká a podtržená.

Velikost písma těla

Zde můžete upravit velikost textu. Posunutím posuvníku intervalu můžete zvětšit nebo zmenšit velikost textu nebo můžete přímo zadat požadovanou hodnotu velikosti textu do vstupního pole vpravo od posuvníku. Vstupní pole podporují různé měrné jednotky, což znamená, že můžete zadat „px“ nebo „em“ podle své velikosti a změnit typ jednotky.

Barva textu těla

Ve výchozím nastavení se všechny barvy textu v souboru Divi zobrazují v bílé nebo tmavě šedé barvě. Pokud chcete změnit barvu textu, vyberte pomocí této možnosti požadovanou barvu ve výběru barev.

Rozestup tělových písmen

Mezery mezi písmeny ovlivňují mezeru mezi jednotlivými písmeny. Chcete-li zvětšit mezeru mezi každým písmenem textu, upravte mezeru pomocí posuvníku intervalu nebo zadejte požadovanou velikost mezery do vstupního pole vpravo od posuvníku. Vstupní pole podporují různé měrné jednotky, což znamená, že můžete zadat „px“ nebo „em“ podle své velikosti a změnit typ jednotky.

Výška linie těla

Výška řádku ovlivňuje mezeru mezi každým řádkem hlavního textu. Chcete-li zvětšit mezeru mezi jednotlivými řádky, upravte mezeru pomocí posuvníku intervalu nebo zadejte požadovanou velikost mezery do vstupního pole vpravo od posuvníku. Vstupní pole podporují různé měrné jednotky, což znamená, že můžete zadat „px“ nebo „em“ podle své velikosti a změnit typ jednotky.

Použijte okraj

Povolením této možnosti umístíte ohraničení kolem vašeho modulu. Toto ohraničení lze přizpůsobit pomocí následujících podmíněných parametrů.

Barva hranice

Tato možnost ovlivňuje barvu ohraničení. Vyberte vlastní barvu z výběru barev a použijte ji na svůj okraj.

Šířka hranice

Ve výchozím nastavení jsou ohraničení široká 1 pixel. Tuto hodnotu můžete zvýšit přetažením posuvníku rozsahu nebo zadáním vlastní hodnoty do vstupního pole vpravo od posuvníku. Podporujte vlastní měrné jednotky, což znamená, že můžete změnit výchozí jednotku z „px“ na něco jiného, ​​jako em, vh, vw atd.

konfigurace modulu sbourdires obnovit divi builder.png

Styl okraje

Okraje podporují osm různých stylů, včetně: plný, tečkovaný, tečkovaný, dvojitý, drážka, hřeben, vložka a začátek. Z rozevírací nabídky vyberte požadovaný styl a použijte jej na svůj okraj.

Maximální šířka obrázku

Použitím maximální hodnoty šířky zde omezíte šířku prezentačního obrazu. To ovlivní pouze rozostření, která nejsou v režimu ikon.

Vlastní marže

Okraj je prostor přidaný na vnější stranu modulu, mezi modul a další prvek nahoře, dole nebo nalevo a napravo od něj. Na kteroukoli ze čtyř stran modulu můžete přidat vlastní hodnoty okrajů. Chcete-li odstranit vlastní okraj, odeberte přidanou hodnotu ze vstupního pole. Ve výchozím nastavení se tyto hodnoty měří v pixelech, ale do vstupních polí můžete zadat vlastní měrné jednotky.

Vlastní polstrování

Výplň je prostor přidaný uvnitř vašeho modulu mezi okraj modulu a jeho vnitřní prvky. Na kteroukoli ze čtyř stran modulu můžete přidat vlastní hodnoty výplně. Chcete-li odstranit vlastní okraj, odeberte přidanou hodnotu ze vstupního pole. Ve výchozím nastavení se tyto hodnoty měří v pixelech, ale do vstupních polí můžete zadat vlastní měrné jednotky.

Rozšířené možnosti Souhrnný modul

Na kartě Upřesnit najdete možnosti, které mohou zkušenější weboví designéři považovat za užitečné, například vlastní atributy CSS a HTML. Zde můžete použít vlastní CSS na kterýkoli z mnoha prvků modulu. Na modul můžete také použít vlastní třídy a ID CSS, které lze použít k přizpůsobení modulu v souboru style.css vašeho podřízeného motivu.

sekce souhrnu modulu advance.png

Snadno vytvořte svůj online obchod

Stáhněte si zdarma WooCommerce, nejlepší e-commerce pluginy pro prodej vašich fyzických a digitálních produktů na WordPress. [Doporučeno]

CSS ID

Zadejte volitelné ID CSS, které chcete použít pro tento modul. ID lze použít k vytvoření vlastního stylu CSS nebo k propojení s konkrétními částmi vaší stránky.

CSS třídy

Zadejte volitelné třídy CSS, které chcete pro tento modul použít. Třídu CSS lze použít k vytvoření vlastního stylu CSS. Můžete přidat více tříd oddělených mezerou. Tyto třídy lze použít ve vašem motivu Divi Child nebo ve vlastních CSS, které přidáte na svou stránku nebo web pomocí možností motivu Divi nebo nastavení stránky Divi Builder.

Vlastní CSS

Vlastní CSS lze také použít na modul a kterýkoli z interních prvků modulu. V sekci Vlastní CSS najdete textové pole, kde můžete přidat CSS přímo ke každému prvku. Položky CSS v tomto nastavení jsou již vloženy do značek stylů. Musíte tedy zadat pravidla CSS oddělená středníky.

Animace obrázku / ikony

Toto řídí směr líné načítající animace.

ALT text z obrázku

Pokud jste se nerozhodli použít ikonu, zobrazí se toto nastavení. Jiný text poskytuje veškeré potřebné informace, pokud se obrázek nenačítá, nezobrazuje správně nebo v jakékoli jiné situaci, kdy uživatel obrázek nevidí. Umožňuje také číst a rozpoznávat obrázek pomocí vyhledávačů.

viditelnost

Tato možnost umožňuje ovládat zařízení, na kterých se váš modul zobrazuje. Můžete se rozhodnout deaktivovat svůj modul na tabletech, chytrých telefonech nebo stolních počítačích jednotlivě. To je užitečné, pokud chcete použít různé moduly na různých zařízeních nebo pokud chcete zjednodušit mobilní design odstraněním určitých prvků ze stránky.

To je pro tento tutoriál vše. Doufáme, že jsme vám ukázali, jak používat souhrnný modul v Divi.

Tento článek obsahuje 1 komentář

  1. Dobrý den,
    Chci použít modul shrnutí k vložení přibližně 200 miniatur na stránku.
    Každá miniatura představuje název produktu k prodeji, ale nechci používat woocommerce, jen kontaktní odkaz ...
    Tato stránka bude pravidelně aktualizována o nové miniatury.
    Tyto miniatury (tedy 200 souhrnných modulů) by měly být uvedeny v abecedním pořadí (na základě názvu), také když přidám nové moduly na konec stránky ...
    Víte, jak bych to mohl udělat?
    merci beaucoup

Zanechat komentář

Vaše e-mailová adresa nebude zveřejněna. Povinné položky jsou označeny *

Tato stránka používá společnost Akismet ke snížení nežádoucích účinků. Přečtěte si další informace o tom, jak se používají vaše komentáře.

Zpět na začátek
12 akcie
podíl6
tweet
Zadat6