Wysiwyg editor: Porovnání verzí

Z LOGIC CMS Manuál
Přejít na: navigace, hledání
 
(Není zobrazeno 8 mezilehlých verzí od 2 uživatelů.)
Řádka 1: Řádka 1:
−
{| style="width: 700px" border="1" width="100%"
+
{| style="width: 700px;  padding-left: 10px" align="right" border="1" cellpadding="10" width="100%"
 
|-
 
|-
 
| [[File:Wsw1.png|Styl písma]]<br/>
 
| [[File:Wsw1.png|Styl písma]]<br/>
Řádka 15: Řádka 15:
 
| [[File:Wsw4.png|Formát textu]]
 
| [[File:Wsw4.png|Formát textu]]
 
| '''Formát textu'''
 
| '''Formát textu'''
−
| Nastaví formát textu na odstavec (paragraph, bežný text), adresu (address), předformátovaný (preformated) nebo nadpis (heading). Nadpis má několik úrovní, které umožňují text logicky členit.
+
| Nastaví formát textu na odstavec (paragraph, bežný text), adresu (address), předformátovaný (preformated) nebo nadpis (heading). Nadpis má několik úrovní, které umožňují text logicky členit.<br/>
 
|-
 
|-
 
| [[File:Wsw5.png|Vložit/upravit hypertextový odkaz]]
 
| [[File:Wsw5.png|Vložit/upravit hypertextový odkaz]]
 
| '''Vložit/upravit hypertextový odkaz'''
 
| '''Vložit/upravit hypertextový odkaz'''
 
|  
 
|  
−
Označte text, z kterého chcete vytvořit odkaz a stiskněte toto tlačítko. Zadejte www adresu (včetně počátečného &lt;a href="http://"&gt;[http:// http://]&lt;/a&gt;) nebo jméno záložky, na kterou má odkaz směrovat, případně další parametry, a potvrďte stisknutím tlačítka INSERT vlevém dolním rohu dialogového okna.
+
Označte text, z kterého chcete vytvořit odkaz a stiskněte toto tlačítko. Zadejte www adresu (včetně počátečného http:// ) nebo jméno záložky, na kterou má odkaz směrovat, případně další parametry, a potvrďte stisknutím tlačítka INSERT vlevém dolním rohu dialogového okna.
  
 
|-
 
|-
−
| [[File:Wsw6.png|Odstranit odkaz]]
+
| [[File:Wsw6.png|Odstranit odkaz]]<br/>
 
| '''Odstranit odkaz'''
 
| '''Odstranit odkaz'''
 
| Odstraní hypertextový odkaz z označeného textu (není třeba označovat celý text, ze kterého vede odkaz, stačí kliknout kamkoliv v textu s odkazem).
 
| Odstraní hypertextový odkaz z označeného textu (není třeba označovat celý text, ze kterého vede odkaz, stačí kliknout kamkoliv v textu s odkazem).
Řádka 33: Řádka 33:
 
| [[File:Wsw8.png|Vložit/upravit obrázek]]
 
| [[File:Wsw8.png|Vložit/upravit obrázek]]
 
| '''Vložit/upravit obrázek'''
 
| '''Vložit/upravit obrázek'''
−
| Do pole „Image URL" zadejte cestu k obrázku. Cesta k obrázku uloženém na jiném servru musí začínat &lt;a href="http://"&gt;[http:// http://]&lt;/a&gt;. Pokud možno, použijte na vložení obrázku tlačítko „Browse" <a href="[http://www.wmp.cz/images/stories/tinymce_manual/100000000000001400000011226DCED4.png http://www.wmp.cz/images/stories/tinymce_manual/100000000000001400000011226DCED4.png]">[http://www.wmp.cz/images/stories/tinymce_manual/100000000000001400000011226DCED4.png http://www.wmp.cz/images/stories/tinymce_manual/100000000000001400000011226DCED4.png]&lt;/a&gt;, které otevře okno s průzkumníkem uploadnutých souborů.<br/>Pro zvýšení přistupnosti stránky se doporučuje zadat popis obrázku do pole „Image description" a lepší je zadat jej i do pole Title (rúzné typy prohlížečů jej zpřístupňují odlišně). Popis obrázku se zobrazí, pokude bude obrázek z nějakého důvodu nedostupný.<br/>Obrázek smažete tím, že na něj kliknete a stlačíte klávesu DELETE.
+
| Do pole „Image URL" zadejte cestu k obrázku. Cesta k obrázku uloženém na jiném servru musí začínat http:// . Pokud možno, použijte na vložení obrázku tlačítko „Browse" , které otevře okno s průzkumníkem uploadnutých souborů.<br/>Pro zvýšení přistupnosti stránky se doporučuje zadat popis obrázku do pole „Image description" a lepší je zadat jej i do pole Title (různé typy prohlížečů jej zpřístupňují odlišně). Popis obrázku se zobrazí, pokude bude obrázek z nějakého důvodu nedostupný.<br/>Obrázek smažete tím, že na něj kliknete a stlačíte klávesu DELETE. Pokud je obrázek již vložen, lze změnit jeho rozměr, tím, že pomocí myši chyitíme jeden z okrajů a při držení tlačítka a tažením myši budeme měnit rozměr konkrétního obrázku.<br/>
 
|-
 
|-
−
| [[File:Wsw9.png|Vložit/upravit média]]
+
| [[File:Wsw9.png|Vložit/upravit média]]<br/>
 
| '''Vložit/upravit média'''
 
| '''Vložit/upravit média'''
 
|  
 
|  
 
Na pozici kurzoru se vloží mediální soubor (flash, video apod.). Doporučujueme kontaktovat WMP s žádostí o vložení.
 
Na pozici kurzoru se vloží mediální soubor (flash, video apod.). Doporučujueme kontaktovat WMP s žádostí o vložení.
−
 
−
Návod, jak vložit video z YouTube najdete <a href="[http://www.wmp.cz/manual-k-editoru-tinymce/#youtube http://www.wmp.cz/manual-k-editoru-tinymce/#youtube]">zde&lt;/a&gt; .
 
  
 
|-
 
|-
Řádka 55: Řádka 53:
 
| Umožňuje vrátit poslední krok zpět (Undo), nebo ho znovu vykonat (Redo).<br/>Pokud například vložíte obrázek, a zjistíte, že ho tam nechcete, použijete Undo a poslední vykonaný krok se stornuje (vložení obrázku). Když si pak v zápětí uvědomíte, že tam ten obrázek vlastně chcete, použije krok dopředu (Redo) a naposled odvolaný krok se zase vykoná.
 
| Umožňuje vrátit poslední krok zpět (Undo), nebo ho znovu vykonat (Redo).<br/>Pokud například vložíte obrázek, a zjistíte, že ho tam nechcete, použijete Undo a poslední vykonaný krok se stornuje (vložení obrázku). Když si pak v zápětí uvědomíte, že tam ten obrázek vlastně chcete, použije krok dopředu (Redo) a naposled odvolaný krok se zase vykoná.
 
|-
 
|-
−
| [[File:Wsw13.png|Seznam]]
+
| [[File:Wsw13.png|Seznam]]<br/>
 
| '''Seznam'''<br/>
 
| '''Seznam'''<br/>
 
| Umožňuje vytvoření odrážek nebo číslovaného seznamu. Možno použít jak od pozice kurzora, tak aplikovat na označený text.
 
| Umožňuje vytvoření odrážek nebo číslovaného seznamu. Možno použít jak od pozice kurzora, tak aplikovat na označený text.
Řádka 135: Řádka 133:
 
| Vytiskne obsah editoru.<br/>
 
| Vytiskne obsah editoru.<br/>
 
|-
 
|-
−
| [[File:Wsw32.jpg|Uložit]]
+
| [[File:Wsw32.png|Uložit]]
 
| '''Uložit'''<br/>
 
| '''Uložit'''<br/>
 
| Uloží změny provedené v textu<br/>
 
| Uloží změny provedené v textu<br/>
 
|-
 
|-
−
| [[File:Wsw33.jpg|Vložit konec stránky]]
+
| [[File:Wsw33.png|Vložit konec stránky]]
 
| '''Vložit konec stránky'''
 
| '''Vložit konec stránky'''
 
|  
 
|  
Řádka 145: Řádka 143:
  
 
|-
 
|-
−
| [[File:Wsw34.jpg|Nápověda]]
+
| [[File:Wsw34.png|Nápověda]]
 
| '''Nápověda'''
 
| '''Nápověda'''
 
| Zobrazí informace o editoru, nápovědu k editoru a seznam aktivních pluginů.<br/>
 
| Zobrazí informace o editoru, nápovědu k editoru a seznam aktivních pluginů.<br/>
 
|}
 
|}
 +
 +
== Práce s tabulkami<br/> ==
 +
 +
=== Vložení tabulky<br/> ===
 +
 +
Tabulku vložíme kliknutím na tlačítko „Vložit tabulku". Otevřené dialogové okno umožňuje zadat počet řádku (rows) a sloupců (cols) tabulky.
 +
 +
 +
 +
=== Úpravy tabulky<br/> ===
 +
 +
Aby bylo možné použít nástroje na úpravu tabulky, musí byt tabulka označena, nebo se v ní musí nacházet kurzor.
 +
 +
=== Vložení textu nebo volného řádku před tabulku umístěnou na začátku<br/> ===
 +
 +
V případě, že se na začátku editoru nachází tabulka a není před ní žádný řádek textu, nejde před tabulku umístnit kurzor kliknutím myši. Je třeba kliknout do první buňky tabulky a pak se pomocí levé šipky na klávesnici dostat před tabulku.<br/>Jiná možnost je vložit text před tabulku přímo v editoru HTML kódu, to však jen v případě, že máte alespoň základní znalosti HTML.
 +
 +
 +
 +
 +
 +
== Editace textu<br/> ==
 +
 +
=== Zalomení řádku<br/> ===
 +
 +
Editor se chová tak, že po stlačení klávesy ENTER se vytvoří nový odstavec. To je v některých případech nežádoucí. Stlačením klávesové kombinace SHIFT+ENTER se řádek zalomí bez přerušení současného odstavce.
 +
 +
 +
 +
 +
 +
== Seznamy<br/> ==
 +
 +
Seznam začnete psát stlačením tlačítka pro normálni nebo číslovaný seznam [[File:Wsw13.png|Seznam]] , nebo jej můžete aplikovat na už napsaný text.<br/>Pomocí tlačítka „Styl seznamu" můžete nastavit vzhled odrážek. U nečíslovaného seznamu je to kruh, kružnice, čtverec nebo žádná odrážka.&nbsp; U číslovaného seznamu jsou na výběr čísla, malé nebo velké písmena normální nebo římské abecedy a žádna odrážka. Je možné nastavit též číslo, kterým bude číslování začínat.
 +
 +
 +
 +
 +
 +
== Vkládání médií<br/> ==
 +
 +
=== Vložení videa z Youtube<br/> ===
 +
 +
Pro vložení videa z YouTube bez příme editace HTML kódu je možné použít tlačítko '''Vložit/upravit média''' [[File:Wsw9.png|Vložit/upravit média]]. V zobrazeném dialogovém okně vyberte typ média Flash.
 +
 +
URL adresu souboru zjistíte následovně:<br/>Na YouTube najdete video, které chcete vložit. Adresa videa bude ve tvaru [http://www.youtube.com/watch?v= http://www.youtube.com/watch?v=]'''XXXX''', kde '''XXXX''' je kód videa, např. v připadě videa na adrese [http://www.youtube.com/watch?v= http://www.youtube.com/watch?v=]'''UqkPJJT2m14'''&feature=related je kód videa '''UqkPJJT2m14'''.<br/>Tento kód zkopírujte a do dialogového okna pro vložení médií zadejte jako adresu souboru '''[http://www.youtube.com/v/k%C3%B3d_videa http://www.youtube.com/v/kód_videa]''', v tomto případě '''[http://www.youtube.com/v/UqkPJJT2m14 http://www.youtube.com/v/UqkPJJT2m14]'''. Nastavte rozměry videa a potvrďte vložení.
 +
 +
 +
 +
== Změna rozměru obrázku<br/> ==
 +
 +
Při vložení obrázku, můžete změnit jeho rozměr přímo ve wysiwyg editoru. Po kliknutí na obrázek se kolem něj objeví rámeček s body, vždy na každém rohu a ve prostřed.
 +
 +
Při najetí myší na jeden z těchto bodů, můžete změnit velikost obrázku. Pokud budete chtít změnit rozměr proporcionálně, musíte táhnou za jeden z bodu, který je vždy na jednom z rohů obrázku.
 +
 +
Pokud budete táhnout za bod, který je uprostřed obrázku na jedné ze stran, budete měnit pouze jednu velikost (šířku nebo výšku).

Aktuální verze z 1. 5. 2012, 13:48

Styl písma
 Styl písma
 Může se aplikovat na označený text.
B - tučné písmo, zkratka CTRL+B
I - kurzíva, zkratka CTRL+I
U - podtržené písmo, zkratka CTRL+I
ABC - přeškrtnuté písmo
Dolní a horní index Dolní a horní index Z označeného textu udělá dolní, resp. horní index
Zarovnání textu Zarovnání textu Zarovná odstavec (nebo označený text) vlevo, na střed, vpravo nebo do bloku.
Formát textu Formát textu Nastaví formát textu na odstavec (paragraph, bežný text), adresu (address), předformátovaný (preformated) nebo nadpis (heading). Nadpis má několik úrovní, které umožňují text logicky členit.
Vložit/upravit hypertextový odkaz Vložit/upravit hypertextový odkaz

Označte text, z kterého chcete vytvořit odkaz a stiskněte toto tlačítko. Zadejte www adresu (včetně počátečného http:// ) nebo jméno záložky, na kterou má odkaz směrovat, případně další parametry, a potvrďte stisknutím tlačítka INSERT vlevém dolním rohu dialogového okna.

Odstranit odkaz
 Odstranit odkaz Odstraní hypertextový odkaz z označeného textu (není třeba označovat celý text, ze kterého vede odkaz, stačí kliknout kamkoliv v textu s odkazem).
Vložit/upravit záložku Vložit/upravit záložku Na pozici kurzoru se vloží „záložka" se zvoleným jménem, na kterou je možné odkazovat hypertextovým odkazem.
Vložit/upravit obrázek Vložit/upravit obrázek Do pole „Image URL" zadejte cestu k obrázku. Cesta k obrázku uloženém na jiném servru musí začínat http:// . Pokud možno, použijte na vložení obrázku tlačítko „Browse" , které otevře okno s průzkumníkem uploadnutých souborů.
Pro zvýšení přistupnosti stránky se doporučuje zadat popis obrázku do pole „Image description" a lepší je zadat jej i do pole Title (různé typy prohlížečů jej zpřístupňují odlišně). Popis obrázku se zobrazí, pokude bude obrázek z nějakého důvodu nedostupný.
Obrázek smažete tím, že na něj kliknete a stlačíte klávesu DELETE. Pokud je obrázek již vložen, lze změnit jeho rozměr, tím, že pomocí myši chyitíme jeden z okrajů a při držení tlačítka a tažením myši budeme měnit rozměr konkrétního obrázku.
Vložit/upravit média
 Vložit/upravit média

Na pozici kurzoru se vloží mediální soubor (flash, video apod.). Doporučujueme kontaktovat WMP s žádostí o vložení.

Upravit HTML kód Upravit HTML kód Umožňuje přímou editaci HTML kódu.
Vyhledávání/ nahrazení textu Vyhledávání/ nahrazení textu Umožňuje vyhledávat části textu a případně je nahradit jiným textem.
Klávesová zkratka CTRL+F.
Krok zpět / dopředu Krok zpět / dopředu
 Umožňuje vrátit poslední krok zpět (Undo), nebo ho znovu vykonat (Redo).
Pokud například vložíte obrázek, a zjistíte, že ho tam nechcete, použijete Undo a poslední vykonaný krok se stornuje (vložení obrázku). Když si pak v zápětí uvědomíte, že tam ten obrázek vlastně chcete, použije krok dopředu (Redo) a naposled odvolaný krok se zase vykoná.
Seznam
 Seznam
 Umožňuje vytvoření odrážek nebo číslovaného seznamu. Možno použít jak od pozice kurzora, tak aplikovat na označený text.
Styl seznamu Styl seznamu

 Nastaví styl označeného seznamu - typ odrážek nebo číslování podle typu použitého seznamu. Použije se na seznam odrážek.
Zmenšit / zvětšit odsazení Zmenšit / zvětšit odsazení
 Zmenší (posune doleva) nebo zvětší (posune doprava) odsazení označeného textu.
Vložit datum Vložit datum
 Vloží aktuální datum ve formátu RRRR-MM-DD, např. 2011-01-28.
Vložit čas Vložit čas
 Vloží aktuální čas ve formátu HH:MM:SS, např. 19:14:11.
Zapnout / vypnout zobrazení na celou obrazovku Zapnout / vypnout zobrazení na celou obrazovku
 Přepíná mezi zobrazením textového pole v původní velikosti a celou obrazovkou.
Vložit symbol Vložit symbol
 Umožňuje vložit speciální symboly, jako např. písmená řecké abecedy, ©, nebo symboly pro euro, libru a mnoho jiných.
Vložit vodorovný oddělovač Vložit vodorovný oddělovač Vloží na pozici kurzoru horizontální dělící čáru.
Vystřihnout, kopírovat a přilepit Vystřihnout, kopírovat a přilepit
 Označený text se vystřihne (CTRL+X) resp. zkopíruje (CTRL+C). „Přilepit" (CTRL+V) vloží vystřihnutý nebo zkopírovaný text na pozici kurzoru.
Nefunguje v prohlížeči Mozilla Firefox - je třeba použít klávesové zkratky.
Přilepit čistý text nebo text z wordu Přilepit čistý text nebo text z wordu

Zobrazí dialog pro vložení zkopríovaného textu na pozici kurzoru jako čistý text, resp. formátovaný text z Wordu nebo internetového prohlížeče.
Zkopírovaný text vložíte do dialogového okna pomocí klávesové zkratky CTRL+V, pak potvrďte vložení kliknutím na INSERT. Při vkládání čistého textu je možné hromadně odstranit konce řádků (text se sleje do jednoho odstavce) - vhodné při kopírování textů z PDF souborů.

Odstranit formátování Odstranit formátování
 Odstraní formátování označeného textu.
Nedělitelná mezera Nedělitelná mezera
 Vloží na pozici kurzoru nedělitelnou mezeru - v tomto místě se text nebude zalamovat na nový řádek.
Citace Citace
 Označený text se naformátuje jako citace.
Nástroje pro vytváření tabulek Nástroje pro vytváření tabulek
 Vložit tabulku, upravit řádek, upravit buňku, vložit řádek na začátek tabulky, vložit řádek na konec tabulky, odstranit řádek, vložit sloupec na začátek, vložit sloupec na konec, odstranit sloupec, rozdělit spojené buňky, spojit buňky.
Emotikony Emotikony Zobrazí okno pro vložení grafické emotikony (tzv. smajlíka). Kliknutím na zvolenou emotikonu se tato vloží na pozici kurzoru.
Vložit/upravit vodorovný oddělovač Vložit/upravit vodorovný oddělovač Umožňuje vložit nebo upravit existujíci vodorovnýoddělovač. V zobrazeném dialogovém okně je možné nastavit jeho šířku a tloušťku.
Náhled Náhled
 Zobrazí náhled současné podoby textu pro kontrolu před uložením.
Rozbalovací text Rozbalovací text

Vloží blok textu, který je možné skrýt nebo zobrazit kliknutím na odkaz.
Do zobrazeného dialogového okna zadejte název - text odkazu, a unikátní ID, podle kterého bude možné tento blok textu identifikovat. Zvolte, zda má být text implicitně zbalený nebo rozbalený.
Po potvrzení dialogu se v editoru zobrazí odkaz, který bude sloužit jake přepínač pro zobrazení nebo skrytí textu, a blok textu, který je možné editovat. Všechno, co bude zadené v tomto bloku se bude skrývat nebo zobrazovat po kliknutí na přepínač.

Tisk Tisk Vytiskne obsah editoru.
Uložit Uložit
 Uloží změny provedené v textu
Vložit konec stránky Vložit konec stránky

Vloží na pozici kurzoru konec stránky.
Některé CMS (např. Joomla) podporují rozdělení obsahu na více stránek pomocí tohoto tlačítka.

Nápověda Nápověda Zobrazí informace o editoru, nápovědu k editoru a seznam aktivních pluginů.

Obsah

Práce s tabulkami

Vložení tabulky

Tabulku vložíme kliknutím na tlačítko „Vložit tabulku". Otevřené dialogové okno umožňuje zadat počet řádku (rows) a sloupců (cols) tabulky.


Úpravy tabulky

Aby bylo možné použít nástroje na úpravu tabulky, musí byt tabulka označena, nebo se v ní musí nacházet kurzor.

Vložení textu nebo volného řádku před tabulku umístěnou na začátku

V případě, že se na začátku editoru nachází tabulka a není před ní žádný řádek textu, nejde před tabulku umístnit kurzor kliknutím myši. Je třeba kliknout do první buňky tabulky a pak se pomocí levé šipky na klávesnici dostat před tabulku.
Jiná možnost je vložit text před tabulku přímo v editoru HTML kódu, to však jen v případě, že máte alespoň základní znalosti HTML.



Editace textu

Zalomení řádku

Editor se chová tak, že po stlačení klávesy ENTER se vytvoří nový odstavec. To je v některých případech nežádoucí. Stlačením klávesové kombinace SHIFT+ENTER se řádek zalomí bez přerušení současného odstavce.



Seznamy

Seznam začnete psát stlačením tlačítka pro normálni nebo číslovaný seznam Seznam , nebo jej můžete aplikovat na už napsaný text.
Pomocí tlačítka „Styl seznamu" můžete nastavit vzhled odrážek. U nečíslovaného seznamu je to kruh, kružnice, čtverec nebo žádná odrážka.  U číslovaného seznamu jsou na výběr čísla, malé nebo velké písmena normální nebo římské abecedy a žádna odrážka. Je možné nastavit též číslo, kterým bude číslování začínat.



Vkládání médií

Vložení videa z Youtube

Pro vložení videa z YouTube bez příme editace HTML kódu je možné použít tlačítko Vložit/upravit média Vložit/upravit média. V zobrazeném dialogovém okně vyberte typ média Flash.

URL adresu souboru zjistíte následovně:
Na YouTube najdete video, které chcete vložit. Adresa videa bude ve tvaru http://www.youtube.com/watch?v=XXXX, kde XXXX je kód videa, např. v připadě videa na adrese http://www.youtube.com/watch?v=UqkPJJT2m14&feature=related je kód videa UqkPJJT2m14.
Tento kód zkopírujte a do dialogového okna pro vložení médií zadejte jako adresu souboru http://www.youtube.com/v/kód_videa, v tomto případě http://www.youtube.com/v/UqkPJJT2m14. Nastavte rozměry videa a potvrďte vložení.


Změna rozměru obrázku

Při vložení obrázku, můžete změnit jeho rozměr přímo ve wysiwyg editoru. Po kliknutí na obrázek se kolem něj objeví rámeček s body, vždy na každém rohu a ve prostřed.

Při najetí myší na jeden z těchto bodů, můžete změnit velikost obrázku. Pokud budete chtít změnit rozměr proporcionálně, musíte táhnou za jeden z bodu, který je vždy na jednom z rohů obrázku.

Pokud budete táhnout za bod, který je uprostřed obrázku na jedné ze stran, budete měnit pouze jednu velikost (šířku nebo výšku).

Citováno z „https://manual.newlogic.cz/index.php?title=Wysiwyg_editor&oldid=260“