Wysiwyg textový editor

Náhled - Zobrazí stránku, jak ve skutečnosti vypadá. Do zobrazení se nepromítnou styly, nastavené na webové části projektu.

Odstranit formátování - Formátování provedené pomocí tohoto editoru bude odstraněno. Označte daný text a klikněte na tlačítko.

Změny o krok zpět a opakovat

Zpět - Vrátit úpravy "zpět".

Opakovat - Vrátit změny zpět.

Základní stylování

Přepnout mezi "Tučným" a "Normal" textem.

Přepnout mezi "Italics" a "Normal" textem.

Přepnout mezi "Přeškrtnutým" a "Normal" textem.

Jelikož jsou tato tlačítka přepínací, po prvním kliknutí se styl zapne a po dalším vypne. Tyto styly lze vzájemně kombinovat.

Zarovnání textu

Zarovnání doleva Váš text zůstane zarovnán jako v tomto případě. Váš text zůstane zarovnán jako v tomto případě.
Zarovnání nastřed Váš text zůstane zarovnán jako v tomto případě. Váš text zůstane zarovnán jako v tomto případě.
Zarovnání doprava Váš text zůstane zarovnán jako v tomto případě. Váš text zůstane zarovnán jako v tomto případě.
Zarovnání do bloku Váš text zůstane zarovnán jako v tomto případě. Váš text zůstane zarovnán jako v tomto případě.

Seznamy

Označte myší text, ze kterého chcete vytvořit seznam, a klikněte na jedno z následujících tlačítek. Nové položky seznamu přidáte stisknutím klávesy ENTER za každou položkou.

Seznam s odrážkami

Číslovaný seznam

Odsazení

Zvětšit odsazení - Odsadí text zleva po každém kliknutí.

Zmenšit odsazení - Zmenší odsazení textu zleva po každém kliknutí.

Písma a styly

Možnost výběru standardních formátů, které jsou k dispozici ve všech prohlížečích, jako jsou nadpisy a odstavce textu. Styly nadefinované na webové části projektu automaticky naformátují jejich vzhled tak, aby byl jednotný pro celý web. Všude, kde je to možné, se snažte držet předdefinovaných stylů projektu, spíše než používat formátování vlastní.

Nastavení velikosti textu v aktuálním odstavci.

Barvy

Následující tlačítka umožňují zadat popředí a pozadí textu:

Barva textu - Výběr barvy popředí textu.

Barva pozadí- Výběr barvy pozadí textu.

Pro výběr barvy klikněte na šipku napravo od tlačítka.

Zobrazená nabídka vám umožňuje vybrat si jednu ze 40 barev. Chcete-li mít více možností barev, klikněte na Další barvy.

V následujícím dialogovém okně si můžete vybrat z více než 16 milionů různých barev.

Odkazy na jiné stránky

Chcete-li odkazovat na jinou stránku, a to buď v rámci svých stránek nebo na externí stránky, vytvořte hypertextový odkaz.

Odkazy lze využít také ve spojení s kotvami. Jedná se o případ, kdy chcete "skočit" do konkrétní části textu v rámci stávající stránky.

Vytvoření odkazu

Pro vytvoření odkazu nejprve označte myší text, který chcete použít jako odkaz, např.:

Klikni zde a přejdi na mé stránky...

Dále klikněte na tlačítko Vložit/upravit odkaz .

Cíl - Určuje umístění stránky, na kterou je odkazováno.

  • Otevřít v tomto okně/rámu - Chcete-li stránku nahradit jinou;
  • Otevřít v novém okně (_blank) - Stránka se otevře v novém okně prohlížeče, přitom aktuální stránka je stále k dispozici;
  • Otevřít v nadřazeném okně/rámu (_parent) - Otevře stránku v nadřazeném rámu (ve složitějších rámových strukturách);
  • Otevřít v hlavním okně/rámu (_top) - Otevře stránku v celém okně (ne v rámu);

Titulek - Popis odkazu, který se objeví po najetí myší. Doporučujeme vkládat v případě, že odkaz např. obsahuje obrázek.

Je mnoho dalších pokročilých možností nastavení v tomto dialogovém okně. Jsou však určeny spíše pro ty, kdo mají znalosti HTML.

Odebrat odkaz

Pro odebrání odkazu jednoduše označte odkaz myší, např.:

Klikni zde a přejdi na mé stránky...

...potom klikněte na Odebrat odkaz .

Kotvy

Kotvy jsou něco jako záložky, umístěné v konkrétních částech stránky. Kotvy jsou odkazy, pomocí kterých chcete "skočit" do konkrétní části textu stránky.

Chcete-li vytvořit kotvu, umístěte kurzor na požadované místo na stránce.

Klikněte na Vložit/upravit záložku (kotvu) .

Napište název kotvy. Kotva se zobrazí na vaší stránce následovně.

Podrobnosti o napojení odkazu na vaši kotvu najdete zde.

Obrázky

Pro vložení obrázku do článku použijte tlačítko Vložit/upravit obrázek .

URL obrázku - Určuje umístění (na internetu) obrazku, který se bude zobrazovat. Napište zde jeho URL adresu. Ve většině případů ale budete vaše obrázky nahrávat prostřednictvím správce souborů. K tomu použijte tlačítko Procházet.

Procházet - Tlačítko otevře dialogové okno správce souborů. Jak s ním pracovat se dozvíte v administraci vašeho projektu v modulu Obsah / Správce souborů. Z nabídky správce vyberte soubor, který již byl v minulosti do správce vložen, nebo nahrajte soubor nový.

Popis obrázku a Titulek - Doporučujeme zadat také popis a titulek obrázku, aby uživatelé, kteří mají obrázky vypnuté, nebo používají např. čtečky obrazovky, věděli, jaký obrázek se na stránce vyskytuje.

Náhled - Znázorňuje obrázek, který jste si vybrali.

Pro zobrazení více možností klikněte na záložku Vzhled.

Zarovnání - Určení, jak bude obraz zarovnán ve vztahu k textu na stránce.

Rozměry - Volba umožňuje nastavit si velikost zobrazení obrázku v pixelech.

Zachovat proporce - Automaticky se vypočítá výška (pokud zadáte šířku), nebo šířka (pokud zadáte výšku) obrázku. To zajistí, aby zůstaly proporce obrázku nezměněny. Responzivní stránky mají zachování proporcí nastaveno přímo ve stylech webové části projektu.
Poznámka: Není úplně šťatné používat tuto funkci pro zmenšování velkých obrázků. Bez ohledu na to, jaká velikost obrázku je zobrazena, se stáhne celý obrázek ve své původní velikosti. Raději obrázek nejdříve zmenšete na požadovanou velikost ve vašem počítači a potom ho znovu nahrejte. Tím se urychlí načítání stránky.

Vertikální odsazení / Horizontální odsazení - Možnost nastavení (v pixelech) velikosti prázdného místa okolo obrázku.

Rámeček - Nastavení tloušťky rámečku v pixelech v případě, že formát rámečku není dán ve stylech webové části projektu.

Styl - Pokud chcete, aby obrázek odpovídal konkrétním CSS stylům určeným na webové části projektu, zadejte jejich názvy.

Je mnoho dalších pokročilých možností nastavení v tomto dialogovém okně. Jsou však určeny spíše pro ty, kdo mají znalosti HTML.

Poté, co je obrázek vložen, můžete měnit jeho velikost. Kliknutím na obrázek se objeví úchyty pro změnu velikosti.

Uchopte jeden z těchto úchytů levým tlačítkem myší a potáhněte požadovaným směrem. Pokud jste s velikostí spokojení, tlačítko myší uvolněte.

Pro smazání obrázku klikněte na obrázek a zmáčkněte klávesu "Delete".

Přidávání speciálních znaků a obsahu

Vložit speciální znak - Vložení znaků, které nejsou běžně dostupné na vaší klávesnici.

Vložit/upravit média - Podobná funkce jako Vložit obrázek. Umožňuje vložit multimediální soubor jako je flash, video nebo zvukový soubor.

Jak vložit video z youtube?
Na youtube si u vybraného videa klikněte na odkaz "sdílet", dále "Vložit". Zkopírujte kompletní kus kódu <iframe....</iframe> a vložíte jej do administrace do vybraného textového editoru pomocí ikonky Vložit / upravit média. Vyskočí vyskakovací okno a v záložce Zdroj je pole, do kterého vložíte zkopírovaný kód z youtube.

Vložit nedělitelnou mezeru - HTML ignoruje více mezer za sebou a interpretuje je jako jednu. Toto tlačítko vloží takové mezery, které za sebou zobrazit lze.

Práce s tabulkami

Vytvoří novou tabulku a vloží ji do vaší stránky.

Vloží nový řádek před aktuální.

Vloží nový řádek za aktuální.

Odstraní aktuální řádek.

Vloží nový sloupec před aktuální.

Vloží nový sloupec za aktuální.

Odstraní aktuální sloupec.

Zobrazí dialogové okno umožnující upravit vlastnosti aktuálního řádku.

Zobrazí dialogové okno umožnující upravit vlastnosti aktuálního sloupce.

Sloučí vybrané buňky do jedné.

Rozdělí dříve sloučené buňky zpět do více buněk.

Vložení tabulky

Pro vložení tabulky klikněte na tlačítko Vložit novou tabulku .

Sloupce - Určuje počet sloupců v tabulce.

Řádky - Určuje počet řádků v tabulce.

Odsazení obsahu - Určuje velikost prázdného okolního prostoru uvnitř buňky v pixelech.

Rozestup buněk - Určuje velikost mezery mezi jednotlivými buňkami v pixelech.

Zarovnání - Stanovuje zarovnání tabulky ve vztahu ke zbytku stránky.

Rámeček - Určuje velikost rámečku kolem tabulky a jejích buněk v pixelech.

Šířka / Výška - Specifikace šířky a výšky tabulky. Pokud necháte nevyplněné, nastaví se na základě nastavených stylů tabulky z webové části projektu, tedy 100% šířka, automatická výška.

Třída - Pokud chcete, aby tabulka odpovídala konkrétním CSS stylům určeným na webové části projektu, zadejte jejich názvy.

Nadpis tabulky - Pokud je zaškrtnuto, zobrazí se nad vaší tabulkou další řádek s nadpisem tabulky.

Je mnoho dalších pokročilých možností nastavení v tomto dialogovém okně. Jsou však určeny spíše pro ty, kdo mají znalosti HTML.

Vlastnosti řádku tabulky

Pro úpravu vlastností aktuálního řádku klikněte na tlačítko Vlastnosti řádku tabulky .

Typ řádku - nabízí tyto možnosti:

  • Hlavička tabulky - Vytvoří z tohoto řádku záhlaví tabulky.
  • Tělo tabulky - Používá se pro řádky hlavního obsahu tabulky.
  • Pata tabulky - Nastaví tento řádek jako zápatí tabulky.

Zarovnání - Určuje horizontální zarovnání textu v řádku.

Vertikální zarovnání - Nastaví vertikální zarovnání textu v řádku.

Třída - Pokud chcete, aby řádek tabulky odpovídala konkrétním CSS stylům určeným na webové části projektu, zadejte jejich názvy.

Výška - Pokud je to třeba, specifikujte výšku řádku tabulky. Necháte-li nevyplněné, nastaví se výška automaticky dle obsahu buňky.

Možnosti aktualizace - Výběrové pole stanoví, jaké řádky budou aktualizovány výše uvedeným nastavením.

Je mnoho dalších pokročilých možností nastavení v tomto dialogovém okně. Jsou však určeny spíše pro ty, kdo mají znalosti HTML.

Vlastnosti buňky

Pro úpravu vlastností buňky tabulky klikněte na tlačítko Vlastnosti buňky .

Zarovnání - Určuje horizontální zarovnání textu uvnitř buňky.

Typ buňky - Výběrové pole nabízí tyto možnosti:

  • Data - Používá se pro buňky hlavního obsahu v tabulce.
  • Záhlaví - Nastaví buňku jako záhlaví tabulky.

Vertikální zarovnání - Určuje vertikální zarovnání textu uvnitř buňky.

Šířka / Výška - Specifikace výšky a šířky buňky. Pokud necháte nevyplněné, nastaví se automaticky dle obsahu buňky.

Třída - Pokud chcete, aby buňka tabulky odpovídala konkrétním CSS stylům určeným na webové části projektu, zadejte jejich názvy.

Možnosti aktualizace - Výběrové pole stanovuje, jaké buňky budou aktualizovány výše uvedeným nastavením.

Je mnoho dalších pokročilých možností nastavení v tomto dialogovém okně. Jsou však určeny spíše pro ty, kdo mají znalosti HTML.

Ruční editace HTML

Upravit HTML zdroj - Po kliknutí na tlačítko se zobrazí následující dialogové okno, obsahující HTML kód vaší stránky.

Poznámka: Tato funkce je určena pro pokročilé uživatele, kteří mají znalosti HTML kódování.

Diskuse