Začínáme s WordPressem, 4.část – práce s obrázky

V rubrice: Tutoriály | Obtížnost:

Pomalu ale jistě se dostáváme do další části našeho tutoriálu pro začínající uživatele WordPressu. Co máme dnes na programu? Řekneme si, jak vkládat obrázky, jak je upravovat či jak vložit do příspěvku galerii. Dozvíte se, jak jednoduše vkládat youtube videa nebo třeba fotky z flickeru. A na závěr vám dám tip na několik pluginů, který vám usnadní práci s obrázky, ale i s dalšími médii.

Jak tedy obohatit články obrázky a dodat jim trochu přívětivějšího vzhledu? Naneštěstí se přesné použití může lišit šablonu od šablony. U některých musíte obrázky vkládat přímo do příspěvku, u jiných zase můžete využít náhledového obrázku. Ten můžete zvolit ho můžete v pravém sidebaru.

Box pro vložení náhledového obrázku.

Pokud tam nic takového nevidíte, podívejte se do pravého horního rohu a rozbalte si nabídku kliknutím na „Nastavení zobrazených informací“. Zatrhnutím položky „Náhledový obrázek“ povolíte jeho zobrazování. Pokud ho tam nevidíte, nezoufejte, vaše šablona ho jednoduše nepodporuje a vy si musíte vkládat obrázky přímo do textu. K tomu vám slouží toto nenápadné tlačítko:

Tlačítko pro vkládání médií ve WordPressu

Po kliknutí vám vyjede nabídka:

Okno pro vkládání médií ve wordpressu

Jak vidíte, na výběr tu jsou 4 možnosti vložení obrázku. Buď nahrajete nový NEBO budete odkazovat na obrázek z jiného webu NEBO přidáte obrázek, který byl přiřazen tomuto článku NEBO vyberete nějaký z vaší galerie. Musím vás upozornit, že wordpress s přiřazováním obrázků nepracuje příliš dobře. Přiřazení totiž nejde nějak jednoduše zrušit. Jako lék existuje plugin Unattach.

Po vybrání či nahrání vašeho obrázku se vám objeví další nabídka:

Úprava informací o obrázku ve WordPressu

Vezmeme si to hezky postupně. Hned nahoře máme náhled obrázku a pár informací o něm. Hned pod náhledem je tlačítko „Upravit obrázek“ pomocí něhož ho budeme moci zmenšit, ořezat nebo otočit. Více informací hledejte níže.

Název: Název obrázku se objevuje v administraci wordpressu, takže si je všechny přehledně jmenujte, aby se vám dobře hledaly. Pokud má obrázek samostatnou stránku (jako například zde) zobrazí se v titulku. Rovněž se jedná o atribut title a zobrazí se po najetí myši na obrázek.

Alternativní text: Pro zkušenější – jedná se o atribut alt. Pro méně zkušené – tento text se zobrazí, pokud má návštěvník vypnuté zobrazování obrázků. Rovněž ho dokáží přečíst vyhledávače, takže jeho chytré využití může zlepšit SEO.

Titulek: Tato položka se zobrazí jako text pod obrázkem.

Popis: Stejné jako titulek, akorát se zobrazí i v obrázku na samostatné stránce.

URL odkazu: Velmi důležitá položka, kterou byste neměli přehlédnout. Můžete zde nastavit, kam bude váš obrázek odkazovat. Můžete vložit vlastní url, nebo pomocí buttonů využívat nějaké přednastavené hodnoty – bez odkazu, odkazuje na svou plnou velikost nebo odkazuje na samostatnou stránku s obrázkem. Pokud chcete využívat služby lighboxů, zadávejte URL souborů.

Zarování: Jednoduše vyberte umístění obrázku.

Velikost: Jak má být vložený obrázek veliký? Přednastavené hodnoty lze změnit v nastavení médií.

Jak jsem na začátku zmiňoval, ve wordpressu můžete obrázky i upravovat. Sice jen základní věci, ale pokud nemáte k dispozici lepší editor nebo se vám obrázek nechce znovu nahrávat, tak vám jistě pomůže. Takto vypadá jeho rozhraní:

Úprava obrázků ve wordpressu

Jak můžete vidět, jsou tu základní možnosti: ořez, otočení, překlopení a otočení. Můžete si rovněž upravit náhled a ostatní fotky nechat netknuté. Či právě naopak.

V novějších verzích se ještě přibyla funkcionalita, která vám umožní vložit celou galerie.

Vkládání galerií ve wordpressu

Obrázky si můžete jednoduše pomocí drag & drop seřadit podle svého uvážení. V select boxu pak máte více možností řazení – např. podle data nebo náhodně. Odkaz obrázků může vést na jeho plnou velikost či na samostatný příspěvek. Po nastavení všech parametrů klikněte na „Vložit galerii do příspěvku“.

Jak na vkládání dalších médií?

Do svých článků samozřejmě nemusíte vkládat jen obrázky, ale i dokumenty – .ppt, .xls .doc, .rtf, .pdf, video – .avi, .mpg, audio – .mp3, .ogg, .wav ale i další typy jako třeba archivy .zip atd. WordPress je sice dokáže rozeznat, ale žádné zobrazovací orgie nečekejte. V článku se objeví pouze jako odkaz ke stažení.

Co určitě potěší je, že WordPress podporujte oEmbed. Stačí tedy do textu zkopírovat link na youtube video a ono se pak v článku zobrazí v celé své kráse. Podporovány jsou např. weby YouTube, Vimeo nebo Flickr. Ve verzi 3.4 pak přibude ještě Twitter. Kompletní seznam je na codexu.

Tipy na pluginy

Easy FancyBox – jednoduchý lightbox. Stačí nainstalovat a běží. Je akorát nutné aby obrázky v příspěvcích odkazovaly na svou plnou velikost. V nastavení médiích si ho pak můžete přizpůsobit.

NextGEN Gallery – velmi oblíbený plugin pro galerie, pro někoho možná příliš robustní. Můžete vytvářet alba a mít tak v obrázcích větší přehled. Je v něm integrovaný lighbox i několik widgetů.

Post Thumbnail Editor – umožní vám upravit oříznutí všech dostupných velikostí obrázků.

WP RSS Images – přidá náhledový obrázek do vašeho RSS kanálu.

MediaElement.js – HTML5 Video & Audio Player – Slouží pro zobrazení videa a audia přímo ve vašem příspěvku.


Začínáme s WordPressem

V rubrice: Tutoriály | Obtížnost: