Úpravy textů a obrázků na webu
Jak zapnout editační mód
Abyste mohli svůj web editovat, musíte být nejprve přihlášeni do administrace vašeho webu.
Odkaz i postup přihlášení jste ode mě dostali e-mailem při spuštění webu. Pokud e-mail s těmito údaji v archivu vaší e-mailové schránky nenajdete, ozvěte se mi.
Po otevření stránky administrace a po přihlášení se dostanete do administrace webu. Nyní máte dvě možnosti, jak otevřít editační mód konkrétní stránky:
- Přímo v administraci si zobrazte seznam stránek vašeho webu pomocí položky „Stránky“ v levém menu. Po najetí myši na stránku, kterou chcete editovat se zobrazí možnosti, klikněte na “Upravit pomocí programu Divi”
- Otevřete si v nové záložce prohlížeče váš web, načtete stránku, kterou chcete editovat a v horním černém pruhu, který vidí jen přihlášený administrátor, kliknete na “Zapnout Visual Builder”
V obou případech se vám otevře stránka v editačním módu a můžete ji upravovat.
Sekce, řádky, moduly
Nejdřív vás seznámím s hierarchií prvků na vaší stránce, abyste vždy neomylně našli prvek, který potřebujete upravovat.
Když se přepnete do editačního módu webu, budou se jednotlivé prvky webu po najetí myši rámovat barevnými rámečky.
Modrým rámečkem je orámována sekce stránky. Sekce je vždy přes celou šířku stránky a obsahuje v sobě další vnořené prvky – řádky a moduly.
Řádky jsou orámovány zeleným rámečkem. Většinou už nejsou přes celou šířku stránky, respektují nastavené vzdálenosti od okraje sekce.
Pro vás jsou důležité moduly, které jsou orámovány šedým rámečkem. Jsou to ty nejmenší rámečky, které jsou vždy nejblíže k obsahu, který chcete editovat. Modul může být pouhý text nebo obrázek, mohou být ale použity i moduly, které v sobě kombinují text s obrázkem. Editace textů a obrázků v různých typech modulů je hodně podobná.
Sekce ani řádky na svém webu neměňte sami, pokud nejste pokročilejší uživatel Divi.
Nástroje modulů
Nejčastěji asi budete potřebovat úpravit texty nebo vyměnit obrázky. Tyto akce najdete v úpravách po stisku ikony ozubeného kola.
Modul můžete také zkopírovat a vytvořit tak nový modul se stejnými styly, jen v něm upravíte texty nebo vyměníte obrázky. Modul zkopírujete ikonou dvou obdélníčků.
Pokud budete chtít mobul přesunout na místo jiného modulu, nebo např. do jiného sloupce, přesunete ho přidržením ikony čtyřsměrné šipky a tažením.
Pokud jste vytvořili kopii modulu omylem, nebo chcete nějaký modul smazat, smažete ho kliknutím na ikonu popelnice.
Kopie nebo přesunutí modulu
Někdy se může hodit zkopírovat celý modul a editací textu a obrázku zkopírovaného modulu tak vytvořit modul nový ve stejném stylu.
Kopii modulu vytvoříte stiskem ikony dvou obdélníčků. Modul se zkopíruje pod ten současný.
Chcete-li změnit pořadí modulů, přesunete moduly chycením za ikonku čtyřsměrné šipky. Přesunutím prvního modulu na místo druhého a druhého modulu na místo prvního jejich pořadí prohodíte.
Jak editovat modul
Po najetí na modul, který chcete editovat se modul orámuje šedým rámečkem a u levého horního rohu rámečku se zobrazí ikonky možností. Pokud ikonky možností po najetí nevidíte, klikněte na modul jedním klikem.
Pro editaci obsahu modulu klikněte na ikonku ozubeného kola.
Po kliknutí se vám otevře panel s obsahem k editaci. Tento panel je buď plovoucí nad prostorem webu, nebo může být i přichycený k pravému či levému okraji obrazovky, pak ovšem zúží oblast webu a nevidíte web ve skutečné velikosti tak, jak ho uvidí váš návštěvník. Umístění panelu si můžete měnit pomocí ovladače v pravém horním rohu panelu, jak vám to bude vyhovovat.
Editace textu
Pro úpravu textu se nacházíte v panelu na záložce Obsah. Zde je okno s textem, který můžete přepisovat, nad textem jsou možnosti textu známé např. z wordu – můžete text udělat tučný, nebo nakloněný, můžete použít odrážky nebo číslování, nebo vložit odkaz.
Změny potvrdíte zeleným tlačítkem s fajfkou, nebo odmítnete červeným tlačítkem s křížkem.
Vizuální změny textu (barva, velikost, zarovnání) nedělejte sami, pokud nejste pokročilejší uživatel Divi.
Pokud nechcete o svou práci přijít, ukládejte průbežně všechny změny tlačítkem “Uložit” v pravém dolním rohu obrazovky, které je někdy skryto a zobrazí se až po kliku na fialový kruh se třemi tečkami.
Pokud jste si nový text připravili v nějakém textovém editoru (např. Word) a chcete ho na web kopírovat, může se vám stát, že si web převezme styly textu z Wordu – typicky font, velikost, barva…, což nechceme!
Chceme, aby všechny texty na webu byly v jednom stylu, který je pro web globálně nastaven. Vkládejte zkopírovaný text pomocí klávesové zkratky Ctrl+Shift+V nebo klikem pravým tlačítkem myši + výběrem možnosti “Vložit a použít odpovídající styl”.
Chcete-li udělat nový odstavec, stiskněte na konci řádku posledního odstavce ENTER. Vytvoříte tím nový odstavec, který je od předchozího odstavce odřádkován větší mezerou.
Chcete-li v rámci jednoho odstavce udělat jen nový řádek, stiskněte Shift+ENTER Vytvoříte tím nový řádek, který má od předchozího řádku stejně velké odsazení, jako ostatní řádky.
Výměna obrázku
S obrázky je to složitější, protože je potřeba, abyste vložili nový obrázek ve stejné velikosti, jako je ten původní použitý na webu, nebo alespoň ve stejném poměru stran.
Navíc obrázky nemusí být jen součástí modulu jako texty, ale některé jsou umístěny v pozadí sekce, řádku, nebo sloupce řádku.
Výměna obrázku v modulu
Obrázek opět měníte v panelu na záložce Obsah, někdy je však na této záložce i jiný obsah, typicky text. Je potřeba si tedy část Obrázek najít a rozkliknout, většinou je hned druhá pod částí editace textu.
Po kliku na obrázek se otevře knihovna médií, kde můžete buď vybrat obrázek z již nahraných, nebo v záložce “Nahrávání souborů” nahrát připravený nový obrázek ze svého počítače.
Příprava obrázku
Abyste zjistili velikost původního obrázku, najděte ho v knihovně médií a po kliku na něj se vpravo zobrazí informace o obrázku včetně jeho velikosti. Nový obrázek zmenšete nebo ořízněte ideálně na stejnou velikost nebo alespoň na stejný poměr stran. K tomu vám poslouží program Gimp pro Windows nebo aplikace Náhled pro MacOS.
Datová velikost obrázku
Obrázek by neměl být větší než 200 kB, aby nezpomaloval načítání webu. Ideální velikost je 100 kB.
V současné době je nejlepší nahrávat obrázky ve formátu *.webp.
Pro komprimaci obrázku můžete použít online nástroj TinyPNG.
Výměna obrázku v pozadí sekce/řádku/sloupce řádku
Někdy nejsou obrázky součástí modulu, ale jsou vloženy do pozadí nějakého prvku. Jedná se hlavně o úvodní obrázky stránek nebo obrázky, které jsou přes celou šíři stránky. Takové obrázky se málokdy nacházejí v modulu (šedý obdélník) a je potřeba hledat v sekci nebo řádku (modrý nebo zelený obdélník).
Nastavení pozadí najdete u sekcí, řádků i modulů po kliku na ozubené kolo v záložce “Obsah” většinou jako druhou nebo třetí položku. Po jejím rozkliku se zobrazí barva pozadí a nad ní tři záložky: barva, barevná přechod, obrázek. Barvu ani barevný přechod neměňte a překlikněte se na záložku obrázku. Pokud se vám v této záložce obrázek zobrazí, vyhráli jste a můžete ho vyměnit za jiný ve stejné velikosti (nebo alespoň ve stejném poměru stran). Pokud v této záložce obrázek nevidíte, musíte hledat v jiném prvku (sekci, řádku nebo modulu). U řádků, které obsahují více sloupců, se obrázek v pozadí může nacházet ne v pozadí řádku, ale v pozadí konkrétního sloupce.
Jak vidíte, některé obrázky není lehké najít, pokud nejste tvůrcem webu. Může to pak být trochu pátrání, než obrázek objevíte. Při vstupu do sekce nebo řádku se zvyšuje riziko, že něco na webu “rozbijete”, postupujte tedy velmi opatrně a pokud obrázek nemůžete najít, neváhejte se mi ozvat.
