Drupal 7 a Image Resize Filter – snadná změna velikosti obrázků v textu

Dnes trochu oživíme sérii video návodů pro Drupal 7. Ukážeme si modul Image Resize Filter nabízející velmi snadnou cestu k tomu, aby si uživatel mohl měnit obrázky vkládané do textu na libovolnou velikost, aniž by musel vytvářet jejich kopie.

Drupal 7 nabízí styly obrázků, což je vlastně funkcionalita modulu ImageCache, který můžete stejným způsobem použít v Drupalu 6. Styly obrázků umožňují definovat určité rozměry, ale také efekty, jako je otočení, změna barev a podobně. Jejich nevýhodou je ale vždy pevně daný rozměr vkládaného obrázku. Já toto řešení používám ve spojení s modulem Insert, kdy do obrázkového políčka nahraji obrázek a jedním klepnutím jej vložím do textu s vybraným stylem.

Někdy je však vhodnější řešit vkládání obrázků přímo v editoru pomocí tlačítka Vložit obrázek a třeba správce souborů na serveru. Mým oblíbeným řešením je IMCE, kde si můžete obrázek po nahrát nechat zmenšit a vytvořit tak jeho zmenšenou kopii.

Ovšem pro řadu uživatelů je práce s IMCE i tak nepohodlná. Obrázek zmenšit dovedou, umí jej také vložit. Ale co když chcete vložit zmenšenou kopii a provázat ji po kliknutí na originál? V IMCE stačí pár kliknutí navíc, ale ne každý je schopen si to zapamatovat. Taková je realita. Mnohem zdlouhavější je pak situace, kdy chcete vloženou zmenšeninu upravit na jiný rozměr. Musíte ji smazat, vytvořit znovu s jinými rozměry a zase ji vložit.

Modul Image Resize Filter nabízí řešení dvou posledních popsaných problémů. Automaticky vytváří zmenšené kopie obrázků vložených do těla stránky, přičemž samozřejmě uchovává originál. Na rozdíl do stylů obrázku však můžete velikost zmenšeniny definovat libovolně rovnou při editaci obsahu, tak, jak zrovna potřebujete.

V následujícím videu najdete ukázku použití Image Resize Filteru spolu s návodem k jeho nastavení.

Pro pořádek ještě shrnuji seznam modulů, které se v návodu vyskytují:

Tagy

Buďme ve spojení, přihlaste se k newsletteru

Odesláním formuláře souhlasíte s podmínkami zpracováním osobních údajů. 
Více informací v Ochrana osobních údajů.

Autor článku: Jan Polzer

Tvůrce webů z Brna se specializací na Drupal, WordPress a Symfony. Acquia Certified Developer & Site Builder. Autor několika knih o Drupalu.
Web Development Director v Lesensky.cz. Ve volných chvílích podnikám výlety na souši i po vodě. Více se dozvíte na polzer.cz a mém LinkedIn profilu.

Komentáře k článku

návštěvník

Díky za podnětný článek! Zajímalo by mě, jestli se tento postup dá zkombinovat s nějakým jiným postupem (např. definicí stylů nebo defaultním nastavením max. rozměrů?) tak, aby se rozměry obrázků v článku nastavovaly automaticky a nebylo na libovůli uživatelů, jak velký obrázek kde bude.

Profile picture for user Jan Polzer

Rádo se stalo. V tom případě potřebujete spíše modul Insert zkombinovaný se styly obrázků, jak zmiňuji. Řekněme, že uděláte styl obrázku "dvěsta" s rozměry 200x100. K článku přidáte políčko typu Obrázek a povolíte u něj podporu pro vkládání přes modul Insert. Dále tam vyberete, aby Insert vkládal obrázek jen pomocí toho stylu "dvěsta". Případně propojený Colorboxem na originál.

No a uživatel půjde do editace článku, v samostatné políčku nahraje obrázek a po kliknutí na tlačítko Vložit se mu obrázek hodí do editoru s rozměrem 200x100.

návštěvník

Že by to bylo až tak jednoduché? :-) No je vidět, jaký jsem lenoch, že jsem se v experimentování nepustil až sem. Tak díky za nakopnutí... :-)

návštěvník

Dobrý den, stává se mi, že uživatel nahraje obrázek v plném rozlišení (např. 3000x4000)  z foťáku do políčka. Lze automaticky převést obrázek na menší rozlišení a ten použít místo toho velkého a ten velký soubor zahodit? Vím, že lze nastavit omezení jak velikosti souboru tak i rozlišení, ale když uživatel neumí měnit rozlišení obrázků... Děkuji

Profile picture for user Jan Polzer

Velký obrázek je automaticky zmenšen při nahrávání do políčka typu obrázek s nastavenými maximálními rozměry. Pokud jej nahráváte jinak a zobrazujete jej přes styly obrázků nebo popsaný Image Resize Filter, je originál uchováván.

návštěvník

Dobry den,

vdaka za super navod. Na D7 som to rozbehal podla navodu ihned. Kedze som videl, ze modul Image Resize Filter je dostupny aj na D6, a drvivu vacsinu webov mame prave na D6, chcel som to nastavit aj tam. Samotny filter sa mi podarilo nastavit a obrazky pekne zmensuje. Problem je ten, ze sa neda kliknut a otvorit v Lightbox2 :(

Poradite, kde sa to nastavuje? Dakujem

Profile picture for user Jan Polzer

V Drupalu 6 už skoro žádné weby nemám a Image Resize Filter jsem tam nezkoušel. Obecně, Lightbox2 potřebuje, aby bylo v odkazu rel="lightbox", zatímco Colorbox v Drupalu 7 funguje podle class="colorbox".

návštěvník

Nakoniec sa mi to podarilo rozbehat - zabudol som totiz pridat ten atribut (rel="lightbox"), lebo som si nepozrel poriadne konfiguraciu filtra admin/settings/filters/2/configure. Teraz uz to funguje a dost ma to tesi. Este raz vdaka.

návštěvník

Dobrý den,

mám problém s nainstalování
elFindru respektive jeho knihovny. Když se snažím aktivovat modul

tak mi to hlásí, že knihovna
neexistuje přitom jsem ji instaloval do site/all/libraries (stejný
problém mám i s colorboxem mám tu TinyMce a ten funguje.Můžete
mi aspoň naťuknout co s tím?

Děkuji Lapčík

Profile picture for user Jan Polzer

Dobrý den. Buď tam máte špatně cestu (například rozbaleno do sites/all/libraries/elfinder/elfinder místo sites/all/libraries/elfinder) nebo je problém v nastavení práv, jak probírá dnešní článek.

Přidat komentář

Odesláním komentáře souhlasíte s podmínkami Ochrany osobních údajů

reklama
Moje kniha o CMS Drupal

 

Kniha 333 tipů a triků pro Drupal 9


Více na KnihyPolzer.cz

Sledujte Maxiorla na Facebooku

Maxiorel na Facebooku

Hosting pro Drupal a WordPress

Hledáte český webhosting vhodný nejenom pro redakční systém Drupal? Tak vyzkoušejte Webhosting C4 za 1200 Kč na rok s doménou v ceně, 20 GB prostoru a automatické navyšováním o 2 GB každý rok. Podrobnosti zde.

@maxiorel na Twitteru

Maxiorel na Twitteru