Úprava stránek 1. 2. 3. 4. 5. 6.
Obsah Popis ikon editoru použitých v šabloně Psaní a formátování textu pro web Odkazy Tabulky Obrázky Média
1. Popis ikon editoru použitých v šabloně krátký popis
detaily
Nový dokument
vytvoří prázdný dokument (odstraní veškerý stávající obsah)
Hledat
vyhledá text v dokumentu (umí také nahradit nalezený text)
Vložit prostý text
vloží neformátovaný text (z jiných stránek apod.)
Vložit z Wordu
vkládá předpřipravený text z wordu (používejte pro vkládání formátovaného textu)
Zpět (Ctrl + Z)
vrátí zpět naposledy provedenou akci
Znovu (Ctrl + Y)
obnoví poslední zrušenou akci
Vložit / upravit odkaz
viz. oddíl 4. Odkazy
Zrušit odkaz
zruší odkaz v aktuálním výběru / odstranit všechny vybrané odkazy
Vložit novou tabulku
vloží / upraví novou tabulku
Vlastnosti řádku
nastaví vlastnosti vybraného řádku tabulky
Vlastnosti buňky
nastaví vlastnosti vybrané buňky
Vložit řádek před
vloží nový řádek před aktuální
Vložit řádek za
vloží nový řádek za aktuální
Odstranit řádek
odstraní aktuální řádek
Vložit sloupec před
vloží nový sloupec před aktuální
Vložit sloupec za
vloží nový sloupec za aktuální
Odstranit sloupec
odstraní aktuální sloupec
Rozdělit buňky
rozdělí dříve sloučené buňky tabulky
Sloučit buňky
sloučí vybrané buňky tabulky
Vyčistit kód
vyčistí kód / odstraní přebytečné formátování
Zrušit formátování
odstraní z výběru formátování
Upravit HTML kód
otevře editor s html zdrojem
Odstavec
formát odstavce dle výběru
Písma Velikost písma
nastaví druh písma výběru (používejte z rozvahou, písmo nemusí být dostupné na počítačích návštěvníků stránek) nastaví velikost písma výběru (pro nadpisy je lepší použít "Odstavec Nadpis 1 až 6")
Tučné Kurzíva Podtržené Přeškrtnuté Zarovnat doleva Zarovnat na střed Zarovnat doprava Zarovnat do bloku Číslovaný seznam Seznam s odrážkami Zmenšit odsazení
zmenší odsazení textu od okraje
Zvětšit odsazení
zvětší odsazení textu od okraje
Blok citace
aktuální odstavec odsadí od obou okrajů
Barva pozadí Barva textu
Vložit / upravit obrázek
viz. oddíl 6. Obrázky
Vložit / upravit média
viz. oddíl 7. Média
Vložit vodorovný oddělovač
vloží pevný oddělovač na pozici kurzoru
Vodorovný oddělovač
vloží oddělovač s možností nastavení vlastností
Vložit speciální znak Emotikony Přepnout na celostránkové zobrazení Nápověda
Krátký popis ikon je možné získat najetím ukazatele myši na ikonu přímo v editoru.
2. Psaní a formátování textu pro web: Vizuální editor je na webu skvělá věc. Odstraňuje nutnost znát zápis značek jazyka HTML, takže každý může text na webu formátovat podle své potřeby, a to aniž by se s HTML vůbec kdy setkal. Ve vizuálním editoru jednoduše píšete text stejným způsobem, jako v počítači. K dispozici máte funkce pro zarovnávání či odsazování textu od okraje, tvorbu bodových a číslovaných seznamů, vkládání obrázků atd. Chceme-li formátovat text, může to znamenat mnoho úkonů, které s textem chceme provést. Můžeme například vytvořit jednoduše hlavní nadpis či podnadpis, zvýraznit text tučně, zvětšit velikost písma nebo změnit barvu, zarovnat odstavec na střed, umístit před text odrážku a další. Možností je opravdu mnoho, avšak zvýrazňování textu bychom měli používat uváženě! Jak správně formátovat text v editoru Existují dva způsoby jak dostat textový obsah do editoru. Buď můžete svůj text psát do editoru "přímo" (zde si jej pak také jednoduše naformátujete), nebo si můžete textový obsah připravit v programu MS Word, a poté jej jednoduše zkopírujete do editoru přes patřičnou ikonu. Nejdříve se však zaměříme na psaní a formátování textu přímo v editoru. Psaní a formátování textu "přímo" v editoru Než začneme formátovat jednotlivé části textu, je dobré si nejdříve vytvořit základní, ucelený textový obsah. Máme-li text připravený, můžeme začít s formátováním. Pamatujte! Každou stránku bychom měli začít hlavním nadpisem. Vytvoření hlavního nadpisu Používání nadpisů na stránkách je nedílnou součástí SEO optimalizace stránek. Vytvoření nadpisu v editoru je skutečně velmi jednoduché. Označíme si větu či slovo, které chceme označit jako hlavní nadpis a vybereme z nabídky Nadpis 1. Vytvoření podnadpisů Stejným způsobem jako jsme vytvořili hlavní nadpis, vytváříme v editoru i podnadpisy. Podnadpisy se v označují jako Nadpis 2, Nadpis 3 až Nadpis 6. Jako podnadpisy označujte slova či větná spojení nadepisující určitou část daného odstavce, tedy slova mající určitý význam pro vyhledávače (klíčová slova).
Dále je možné nastavit například zvýraznění, zarovnání, velikost nebo barvu písma. Vkládání a formátování textu z Wordu Pokud si text pro web připravujete nejprve v počítači v nějakém textovém editoru (například ve Wordu nebo v OpenOffice.org), pak jej nemůžete jen tak jednoduše zkopírovat do schránky a následně vložit do vizuálního editoru na webu. Namísto toho klepněte nejprve na tlačítko Vložit text z aplikace Word a text zadejte teprve do políčka v dialogu, který se vám objeví. Proč to všechno? Pokud totiž do editoru vložíte zkopírovaný text z Wordu přímo, dojde také k vložení speciálních formátovacích značek, včetně různých barev, velikostí a typů písma. To bude mít za následek, že po uložení nebude stránka vypadat podle nastavení webové šablony. V lepším případě bude vzhled prvků na stránce mírně odlišný, v horším pak bude stránka vypadat nepoužitelně.
Vkládání obrázků Zejména méně zkušení uživatelé často vkládají obrázky přímo do dokumentu ve Wordu. To je samozřejmě vhodné pro případ, kdy vytváříte dokument určený například pro tisk. Ovšem nikoli již pro přípravu textů na web. Zkopírováním obrázku do schránky a jeho následným vložením do vizuálního editoru jej totiž na web neuložíte. Obrázky ponechejte v samostatných souborech, které nahrajete pomocí příslušného nástroje (záložka Soubory) do prostoru šablony. Poté obrázky z připraveného textu ve Wordu odstraňte a teprve takovýto text vkládejte do vizuálního editoru na webu. Pozor na odstavce Třetí nejčastější chybou méně zkušených uživatelů je špatná práce s odstavci v textovém editoru, kde si text pro umístění na web připravují. Odstavce vždy vytvoříte stiskem klávesy Enter. Pokud ji použijete dvakrát za sebou, vznikne prázdné místo, resp. jeden prázdný odstavec navíc. Po vložení do vizuálního editoru na webu se to projeví zbytečným prázdným místem mezi řádky. (Chcete-li místo odstavce vložit jen zařádkování stiskněte Shift + Enter) Snažte se tedy vyvarovat popsaných chyb a dodržovat tři základní pravidla, díky kterým si práci s vizuálním editorem v administraci usnadníte a zajistíte si správný vzhled vytvořených stránek.
3. Odkazy Již od doby vzniku internetu jsou odkazy jeho zásadní součásti. Jako odkaz je možné použít libovolnou část textu nebo jen slovo. Zásadně však nedoporučujeme používat např. slovo „zde“! Ale nějaké výstižné pojmenování „manuál šablony“ nebo „beseda s Františkem Novákem 2010“ apod. Důvodem je, že když vyhledávače (google, seznam…) prohledávají internet slovo „odkaz zde“ pro ně není příliš atraktivní. Vytvoření odkazu krok za krokem a) Vybereme text nebo obrázek, který bude odkazovat na další obsah
b) Klikneme na ikonu „vložit/ upravit“ odkaz otevře se dialogové okno
c) V tomto dialogovém okně můžeme přímo zadat adresu stránky do řádku „url“ odkazu (ve formátu http://webknihovny.cz/). Také je možné zvolit si z připraveného seznamu odkazů
d) Při výběru z připraveného seznamu se automaticky upraví „url,“ následně stačí kliknutím na tlačítko „vložit“ vložit odkaz do stránky (stránku je třeba uložit!)
e) Speciální funkci je možné použít při tvorbě odkazu na obrázek
V dialogovém okně „Vložit/upravit odkaz“ stačí nastavit položku „rel“ na hodnotu „Lightbox“ a obrázek na který je odkaz vytvořen se pak otevře efektně jakoby nad stránkou šablony
4. Tabulky Tabulky je možné využít nejen k výstupu nějakých tabulkových dat, ale také pro formátování obsahu stránky, kterého není jinak možné docílit. Výchozí hodnota rámečku vkládané tabulky je totiž 0, a proto nebude tabulka vidět. Pokud chcete použít rámeček tabulky, věnujte pozornost nastavení hodnot „Rozestup buněk“ a „Odsazení obsahu“, které značně ovlivní vzhled tabulky.
Ve vytvořené tabulce je následně možné upravovat nastavení jednotlivých buněk Atd. Viz. popis ikon
5. Obrázky Pro oživení obsahu se dají do šablony vkládat obrázky, ty však musí být MENŠÍ než 2Mb a) Postup vložení obrázku do stránky krok za krokem • obrázek je nejdříve nutné nahrát do šablony • před nahráváním obrázku důrazně doporučuji zvolit požadovanou šířku obrázku pokud budete velikost obrázku upravovat až v editované stránce může dojít k velice nepříjemnému efektu, kdy se stránka načítá velmi pomalu a zbytečně zahlcuje linku
• nahranému obrázku se upraví automaticky jméno, aby neobsahovalo velká písmena, diakritiku ani mezery a soubor se tak dal dobře používat na webu. • rozměry fotografie je možné zkontrolovat kliknutím na jméno souboru.
b) Pokud je obrázek nahrán v šabloně, nic již nebrání jeho použití ve stránce. Otevřete si stránku, do které chcete obrázek vložit pro úpravy, kurzor postavte na místo, kam chcete vložit obrázek, klikněte na ikonu „Vložit/upravit obrázek“ V dialogovém okně pak stačí zvolit obrázek ze „seznamu obrázků“
c) Ostatní hodnoty se doplní automaticky, ale je možné je upravit dle požadavku. Popis obrázku využívají vyhledávače a čtečky slabozrakých nebo slepých uživatelů internetu, proto by měl byt vystižný, aby nahradil obrázkový obsah. Titulek používají prohlížeče internetu k zobrazení popisku obrázku, když nad ním zastavíte kurzor myši.
d) V položce vzhled dialogového okna „vložit /upravit“ obrázek je možné upravit zarovnání obrázku atd. (okno obsahuje náhled, jak bude cca vypadat výsledek)
e) Klikneme na tlačítko „vložit“ a obrázek je na místě
f) Ukázka zobrazení titulku:
6.Média Do šablony lze jednoduše vložit i například video z youtube. Stačí najít na youtube video, které by jste chtěli přidat. Zkopírovat url (přesná internetová adresa v horním řádku prohlížeče pravděpodobně začínající http:// ) Ikonou „Vložit/upravit média“ vyvolat dialog :
Do kterého vložíte adresu youtube a kliknete vložit.
