{"id":5206,"date":"2025-07-27T05:46:30","date_gmt":"2025-07-27T03:46:30","guid":{"rendered":"https:\/\/www.periferieprahy.cz\/blog\/?p=5206"},"modified":"2025-07-27T22:51:08","modified_gmt":"2025-07-27T20:51:08","slug":"nebojte-se-kratkych-kodu-2-karusel-obrazku","status":"publish","type":"post","link":"https:\/\/www.periferieprahy.cz\/blog\/2025\/07\/27\/nebojte-se-kratkych-kodu-2-karusel-obrazku\/","title":{"rendered":"Nebojte se kr\u00e1tk\u00fdch k\u00f3du \u2013\u00a03. karusel obr\u00e1zk\u016f"},"content":{"rendered":"\n

V nab\u00eddce blok\u016f jsem nic podobn\u00e9ho nena\u0161el, tak pokud n\u011bkdo chce karusel pou\u017e\u00edt, nezb\u00fdv\u00e1 ne\u017e pou\u017e\u00edt kr\u00e1tk\u00fd k\u00f3d Karusel obr\u00e1zk\u016f<\/a><\/p>\n\n\n\n

V nab\u00eddce blok\u016f zvolte [ \/ ] a d\u00e1l postupujte podle n\u00e1vodu v <\/i> \u00davod<\/span><\/a>. V nab\u00eddce kr\u00e1tk\u00fdch k\u00f3du zvlote Image carousel<\/strong> a vypl\u0148te dotazn\u00edk:<\/p>\n\n\n\n

POZOR:<\/strong> U parametr\u016f, kde se vol\u00ed ANO\/ NE je trochu zmatek. V anglick\u00e9 verzi NE<\/strong> v \u010desk\u00e9m p\u0159ekladu ANO<\/s> — plat\u00ed NE<\/strong> | V anglick\u00e9 verzi ANO<\/strong> v \u010desk\u00e9 p\u0159ekladu ZNOVU<\/s> — plat\u00ed ANO.<\/strong><\/p>\n\n\n\n

Zdroj: <\/strong>vyberete obr\u00e1zky. Doporu\u010duji, obr\u00e1zky m\u00edt nahran\u00e9 v knihovn\u011b m\u00e9di\u00ed, dopln\u011bn\u00e9 titulky a n\u00e1zvy a odsud je vyb\u00edrat pro karusel. Nahrajte si fotky do knihovny m\u00e9di\u00ed a dopl\u0148te Titulek a N\u00e1zev oboj\u00ed se stejn\u00fdm textem. Pro\u010d, proto\u017ee v <\/strong>galerii v nab\u00eddce blok\u016f a karuselu (Kr\u00e1tk\u00fd k\u00f3d) se objevuje Titulek<\/strong>, ale v galerii z kr\u00e1tk\u00fdch k\u00f3du se zobrazuje N\u00e1zev. M\u00e1te ov\u0161em mo\u017enost volit jin\u00e9 zdroje: Ned\u00e1vn\u00e1 m\u00e9dia | Nejnov\u011bj\u0161\u00ed \u010dl\u00e1nky | Taxonomie: Objev\u00ed se dal\u0161\u00ed spoiler, kde si vyberte taxonomii a jej\u00ed \u010dinitele. D\u00e1v\u00e1m p\u0159ednost v\u00fdb\u011bru z knihovny m\u00e9di\u00ed. Zvol\u00edte li tuto mo\u017enost, objev\u00ed se tla\u010d\u00edtko „P\u0159idat obr\u00e1zky“ a vy provedete v\u00fdb\u011br z knihovny m\u00e9di\u00ed.<\/p>\n\n\n\n

Omezit:<\/strong> Zvolte posuvn\u00edkem maxim\u00e1ln\u00ed po\u010det p\u0159\u00edsp\u011bvk\u016f, ve kter\u00fdch se maj\u00ed vyhled\u00e1vat vybran\u00e9 obr\u00e1zky (pro ned\u00e1vn\u00e1 m\u00e9dia, ned\u00e1vn\u00e9 p\u0159\u00edsp\u011bvky a taxonomii). Pro knihovnu m\u00e9di\u00ed to neplat\u00ed.<\/strong><\/p>\n\n\n\n

Styl slajd\u016f:<\/strong> Z nab\u00eddky doporu\u010duji „Z\u00e1kladn\u00ed“ (default).<\/p>\n\n\n\n

Styl ovl\u00e1dac\u00edch prvk\u016f:<\/strong> Tmav\u00e9 \/ sv\u011btl\u00e9 <\/p>\n\n\n\n

O\u0159\u00edznut\u00ed obr\u00e1zk\u016f:<\/strong> Tady ur\u010dujeme, jak budou vypadat obr\u00e1zky v karuselu. V nab\u00eddce je mo\u017enost „Neo\u0159ez\u00e1vat obr\u00e1zky“ tuto mo\u017enost doporu\u010duji jen u obr\u00e1zk\u016f, kter\u00e9 maj\u00ed p\u0159ibli\u017en\u011b stejn\u00e9 proporce a stejnou velikost. To plat\u00ed ostatn\u011b \u00ed pro ostatn\u00ed volby. Pokud m\u00e1te fotky podlouhl\u00e9 i vysok\u00e9, rad\u011bji volte rozd\u011blen\u00ed do dvou, nebo v\u00edce karusel\u016f podle proporc\u00ed fotek.<\/strong> Pro \u010dtvercov\u00e9 volte pom\u011br 1:1.<\/p>\n\n\n\n

Sloupce:<\/strong> zde si ur\u010d\u00edme kolik fotek vedle sebe bude viditeln\u00fdch v karuselu (kontejner karuselu). M\u016f\u017ee b\u00fdt i jedna, ale moje obvykl\u00e1 volba jsou 4.<\/p>\n\n\n\n

Adaptivn\u00ed:<\/strong> Ano \/ Ne Nastavte tuto mo\u017enost na Ano, chcete-li ignorovat parametr sloupc\u016f a na mobiln\u00edch za\u0159\u00edzen\u00edch zobrazit jeden sloupec.<\/p>\n\n\n\n

Vzd\u00e1lenost:<\/strong> Ano\/Ne P\u0159idat mezery mezi fotkami karuselu?<\/p>\n\n\n\n

Zarovn\u00e1n\u00ed:<\/strong> Tato mo\u017enost ur\u010duje, jak bude kontejner karuselu zarovn\u00e1nn na str\u00e1nce. Mo\u017enosti Vlevo, Vpravo a Na st\u0159ed vy\u017eaduj\u00ed nastaven\u00ed maxim\u00e1ln\u00ed \u0161\u00ed\u0159ky. Mo\u017enost Pln\u00e1 vy\u017eaduje \u0161ablonu str\u00e1nky bez postrann\u00edho panelu. <\/p>\n\n\n\n

Maxim\u00e1ln\u00ed \u0161\u00ed\u0159ka:<\/strong> Nastavuje maxim\u00e1ln\u00ed \u0161\u00ed\u0159ku kontejneru karuselu. P\u0159\u00edklady hodnot: 500, 500px, 50%,<\/p>\n\n\n\n

Titulky:<\/strong> Maj\u00ed se zobrazovat titulky u obr\u00e1zk\u016f v kontejneru? ANO \/ NE Pokud d\u00e1le zvol\u00edte, \u017ee se obr\u00e1zky budou zobrazovat po kliknut\u00ed v Lightboxu, tak tam titulky uvid\u00edte.<\/p>\n\n\n\n

\u0160ipky (doleva \/ doprava):<\/strong> Povolit \u0161ipkami navigaci – posun fotek v kontejneru karuselu vlevo\/vpravo? ANO \/ NE<\/p>\n\n\n\n

Te\u010dky (str\u00e1nkov\u00e1n\u00ed)<\/strong>: Povolit navigaci (str\u00e1nkovat) v kontejneru pomoc\u00ed te\u010dek? ANO \/ NE<\/p>\n\n\n\n

Odkaz na: <\/strong>Kliknut\u00edm na obr\u00e1zek m\u016f\u017eete spustit akci: \u017d\u00e1dn\u00e9 (nic se ned\u011bje) | Obr\u00e1zek v pln\u00e9 velikosti (nezobraz\u00ed se n\u00e1zev) | Lightbox<\/strong> (obr\u00e1zek se otev\u0159e v extra okn\u011b. Doporu\u010duji, proto\u017ee se zobrazuje i n\u00e1zev a d\u00e1 se listovat mezi obr\u00e1zky<\/strong>) | Vlastn\u00ed odkaz ( zat\u00edm jsem nepou\u017eil a nev\u00edm zat\u00edm jak na to) | Str\u00e1nka p\u0159\u00edlohy (tak\u00e9 nev\u00edm co s t\u00edm) | URL \u010dl\u00e1nku (tak\u00e9 nev\u00edm co s t\u00edm).<\/p>\n\n\n\n

Jak se maj\u00ed odkazy otev\u00edrat:<\/strong> Otev\u0159\u00edt v nov\u00e9 z\u00e1lo\u017ece (tabulce) prohl\u00ed\u017ee\u010de | Otev\u0159\u00edt ve stejn\u00e9 z\u00e1lo\u017ece (tabulce) prohl\u00ed\u017ee\u010de.<\/p>\n\n\n\n

Automaticky za\u010d\u00edt hr\u00e1t:<\/strong> posuvn\u00edkem nastavte \u010dasov\u00fd interval mezi automatick\u00fdmi p\u0159echody mezi sn\u00edmky v sekund\u00e1ch. Nastaven\u00edm na 0 automatick\u00e9 p\u0159ehr\u00e1v\u00e1n\u00ed vypnete.<\/p>\n\n\n\n

Rychlost p\u0159echodu:<\/strong> V menu si nastavte rychlost p\u0159echodu mezi sn\u00edmky p\u0159i automatick\u00e9m p\u0159ehr\u00e1v\u00e1n\u00ed.<\/p>\n\n\n\n

Velikost (kvalita) obr\u00e1zk\u016f:<\/strong> Volba ovliv\u0148uje pouze kvalitu obr\u00e1zku, nikoli skute\u010dnou velikost sn\u00edmku<\/strong>. Doporu\u010duji ponechat „P\u016fvodn\u00ed velikost obr\u00e1zk\u016f“.<\/p>\n\n\n\n

Osnova v centru pozornosti:<\/strong> ANO\/ NE Tato mo\u017enost povol\u00ed obrys, kdy\u017e se karusel dostane do fokusu. Obrys vylep\u0161uje navigaci na kl\u00e1vesnici.<\/p>\n\n\n\n

N\u00e1hodn\u00e9 po\u0159ad\u00ed<\/strong>: Chcete n\u00e1hodn\u00e9 po\u0159ad\u00ed obr\u00e1zk\u016f? ANO \/ NE<\/p>\n\n\n\n

Speci\u00e1ln\u00ed CSS t\u0159\u00edda:<\/strong> dosud nevyu\u017eito.<\/p>\n\n\n