Základy práce s editorem
Vizuální editor (označovaný také zkratkou WYSIWYG) je online nástroj, s jehož pomocí můžete snadno vytvářet, upravovat a formátovat text, a to uživatelsky velmi příjemnou formou prostřednictvím příslušných grafických ikon. Pracovní verze textu z tohoto editoru je pak vzhledově skoro stejná jako zobrazená verze na webu. Zatímco se tedy můžete soustředit hlavně na samotný obsah, vizuální editor automaticky vytvoří příslušný HTML kód, který je uložen do databáze a následně zobrazován. Na webu se tedy objeví např. stejný styl písma, odkazy či obrázky tak, jak jste si to nastavili ve vizuálním editoru.
Součástí WordPressu je kvalitní vizuální editor TinyMCE, který bez problémů funguje ve všech nejpoužívanějších internetových prohlížečích. Další úpravy automaticky vytvořeného HTML kódu už jsou pak složitější než jednoduché psaní textu v editoru. Každá internetová stránka se skládá ze dvou hlavních složek: struktury a vzhledu. Struktura je definována pomocí aktuálního HTML kódu, který vzniká automaticky při použití vizuálního editoru (nebo ho můžete zadávat přímo). Konkrétní vzhled webu je pak určován aktuálně zvolenou šablonou, respektive definovanými kaskádovými styly (CSS) v souboru style.css. WordPress automaticky generuje validní kód podle specifikace XHTML 1.0, což znamená, že např. vložení několika nových řádků (zalomení) hned po sobě (značka BR) za nějakým odstavcem nevytvoří očekávanou větší mezeru, ale naopak budou tyto značky automaticky odstraněny, protože nejsou v tomto případě považovány za validní.
Pokud používáte vizuální editor, funguje v něm většina běžných klávesových zkratek stejně jako v jiných textových editorech (Word, Poznámkový blok). Například: Shift+Enter = zalomit řádek, Ctrl+C = kopírovat, Ctrl+X = vyjmout, Ctrl+Z = vrátit provedenou akci zpět, Ctrl+Y = opakovat předchozí akci, Ctrl+A = vybrat vše. Pokud používáte operační systém Mac OS X, použijte pro tyto zkratky klávesu Command místo Ctrl. Pro bližší informace o dostupných klávesových zkratkách se podívejte na jejich přehled.
Nechcete-li vizuální editor používat, můžete si ho vypnout v administraci - menu Uživatelé, položka Profil.
Pokročilá práce s TinyMCE
Obrázky a přílohy
Panel nástrojů vizuálního editoru nabízí i tlačítko pro vkládání obrázků, které jsou uloženy někde na internetu. Pokud tedy znáte URL adresu obrázku, stačí kliknout na toto tlačítko a vložit URL adresu do příslušného pole.
Pokud chcete nahrát na web obrázek nebo nějaký jiný soubor ze svého počítače, tak stačí kliknout na některou z příslušných ikon (umístěny nad vizuálním editorem), a to podle typu nahrávaného mediálního souboru. Okamžitě se otevře nové okno s funkcemi Knihovny médií, kde můžete vybraný obrázek jednoduše nahrát a WordPress se přitom ještě pokusí vytvořit automaticky náhled. Abyste mohli nahraný obrázek vložit do příspěvku, klikněte nejdříve na vytvořený náhled, čímž zobrazíte další možnosti jeho nastavení. Až budete mít všechno potřebné připraveno, stačí už jen kliknout na tlačítko "Vložit do příspěvku" a nahraný obrázek se objeví přímo v upravovaném příspěvku. Pokud chcete nahrát na web třeba video, tak můžete použít ikonu "Vložit / upravit mediální soubor" (umístěna v druhé řádě ikon vizuálního editoru) a bude potřeba vyplnit ještě další informace.
HTML v editoru
Jakýkoli HTML kód, který přímo vložíte do vizuálního editoru, bude zobrazen stejně jako když zobrazíte příspěvek. Co vidíte, to dostanete. Když potřebujete vložit nějaký HTML prvek, který nelze vytvořit běžnou cestou (tlačítky panelu nástrojů vizuálního editoru), musíte ho vložit ručně pomocí HTML editoru. Příkladem jsou např. tabulky, nebo označení zdrojového kódu. Pokud tedy potřebujete něco podobného udělat, přepněte z vizuálního editoru na záložku HTML, vložte/upravte HTML kód a poté přepněte zpátky do vizuálního editoru. Pokud je HTML kód správný a pro editor srozumitelný, zobrazí se zde jeho vizuální podoba.
Vkládání textu ve vizuálním editoru
Jestliže třeba vkládáte text zkopírovaný z jiné internetové stránky, výsledek nemusí být takový, jaký byste očekávali, protože vše závisí i na používaném internetovém prohlížeči a zdrojové stránce. Vizuální editor se pokouší automaticky opravovat jakýkoli neplatný HTML kód, který je vkládán. Pokud tedy chcete získat při vkládání kopírovaného obsahu co nejlepší výsledky, použijte záložku pro vkládání HTML kódu, nebo jedno z tlačítek pro různé způsoby vkládání kopírovaného textu, které se nachází ve druhém řádku panelu nástrojů. Můžete také vyzkoušet ruční vkládání jednotlivých odstavců ze zvoleného textu. Ve většině internetových prohlížečů můžete vybraný odstavec označit tak, že na něj třikrát za sebou rychle kliknete (trojklik).
Vkládání kopírovaného obsahu z jiných aplikací (např. Word, Excel) je nejlepší provést pomocí tlačítka "Vložit z Wordu", které naleznete v druhé řadě panelu nástrojů vizuálního editoru.
Psaní maximální rychlostí
Pokud neradi zbytečně pohybujete myší, můžete používat při práci s vizuálním editorem klávesové zkratky. Uživatelé operačních systémů Windows a Linux mohou používat zkratky ve tvaru Ctrl + písmeno a uživatelé systému Macintosh zase Command + písmeno.
| Klávesa | Akce | Klávesa | Akce |
|---|---|---|---|
| c | Kopírovat | v | Vložit |
| a | Vybrat vše | x | Vyjmout |
| z | Zpět | y | Znovu |
Následující klávesové zkratky využívají odlišné klávesy: Alt + Shift + písmeno.
| Klávesa | Akce | Klávesa | Akce |
|---|---|---|---|
| n | Kontrola pravopisu | l | Zarovnat doleva |
| j | Zarovnat do bloku | c | Zarovnat na střed |
| d | Přeškrtnutí | r | Zarovnat doprava |
| u | • Seznam | a | Vložit odkaz |
| o | 1. Seznam | s | Odstranit odkaz |
| q | Citace | m | Vložit obrázek |
| g | Celá obrazovka | t | Vložit značku pro pokračování textu |
| p | Vložit značku pro rozdělení stránky | h | Nápověda |
| e | Přepnout do režimu HTML | ||
O editoru TinyMCE
Verze: ()
TinyMCE je vizuální (WYSIWYG) HTML editor, který je založený na Javascriptu a je nezávislý na provozované platformě. Tento editor je distribuován jako Open Source software (pod licencí LGPL) a je neustále vylepšován společností Moxiecode Systems AB. Je schopen převádět obsah textových polí (TEXTAREA) nebo jiných HTML prvků do vizuální podoby a tu zase naopak převádět na čistý HTML kód.
Copyright © 2003-2007, Moxiecode Systems AB, všechna práva vyhrazena.
Další informace o tomto programu naleznete na internetových stránkách TinyMCE.
