Úvodní stránka › Fórum podpory WordPressu › Problémy s WordPressem › Fancybox bez pluginu – nefunguje mi jako galerie
Štítky: fancybox
Zvolené téma obsahuje celkem 8 odpovědí. Do diskuze (4 účastníci) se naposledy zapojil uživatel hamil1 a poslední změna je stará 8 let, 7 měsíců.
-
AutorPříspěvky
-
25. března 2014 (10:18) #6774
Dobrý den,
prosím o radu, chtěl bych na svém webu používat fancybox, ale nechci plugin.
To se mi podařilo rozchodit, tak že po kliknutí na obrázek se zobrazí v fancyboxu, ale nefunguje mi galerie, pokud mám na stránce vloženo několik obrázků, tak musím na každý kliknout zvlášť, pokud do stránky vložím galerii, tak také nefunguje, pouze po kliknutí na jednotlivý obrázek.
Ještě jsem se chtěl zeptat, kde je dáno, že když vložím obrázek do stránky, tak se mi otevírá přímo v té stránce-což potřebuji, ale pokud vložím galerii, tak mi to hodí na single.php – to nechci, potřeboval bych, aby se mi v té samé stránce zvětšíl obrázek z té galerie a já mohli jenom šipkami posouvat.
Předem děkuji za radu.
, podle návodů na netu. jsem vložil tento kód do functions.php
function my_eneque() {
wp_register_style( 'fancybox', get_template_directory_uri() . '/assets/js/fancybox/jquery.fancybox.css' );
wp_enqueue_style( 'fancybox' );
wp_register_script( 'fancybox-pack', get_template_directory_uri() . '/assets/js/fancybox/jquery.fancybox.pack.js', null, null );
wp_enqueue_script( 'fancybox-pack' );
wp_register_script( 'gallery', get_template_directory_uri() . '/assets/js/fancybox/jquery.mousewheel-3.0.6.pack.js', null, null );
wp_enqueue_script( 'gallery' );
wp_register_script( 'fancybox', get_template_directory_uri() . '/assets/js/fancybox/jquery.fancybox.js', null, null );
wp_enqueue_script( 'fancybox' );
wp_register_script( 'main', get_template_directory_uri() . '/assets/js/main.js', null, null );
wp_enqueue_script( 'main' );
add_action('wp_enqueue_scripts', 'my_eneque');
wp_deregister_script( 'jquery' );
wp_register_script( 'jquery', 'http://code.jquery.com/jquery-1.8.0.min.js', null, null);
wp_enqueue_script( 'jquery' );Vytvořil nový soubor main.js, kde mám kód
jQuery(document).ready(function($) {
// Initialize the Lightbox for any links with the 'fancybox' class
$(".fancybox").fancybox();
// Initialize the Lightbox automatically for any links to images with extensions .jpg, .jpeg, .png or .gif
$("a[href$='.jpg'], a[href$='.png'], a[href$='.jpeg'], a[href$='.gif']").fancybox();
// Initialize the Lightbox and add rel="gallery" to all gallery images when the gallery is set up using [gallery link="file"] so that a Lightbox Gallery exists
$(".gallery a[href$='.jpg'], .gallery a[href$='.png'], .gallery a[href$='.jpeg'], .gallery a[href$='.gif']").attr('rel','gallery').fancybox();
// Initalize the Lightbox for any links with the 'video' class and provide improved video embed support
$(".video").fancybox({
maxWidth : 800,
maxHeight : 600,
fitToView : false,
width : '70%',
height : '70%',
autoSize : false,
closeClick : false,
openEffect : 'none',
closeEffect : 'none'
});
})(jQuery);25. března 2014 (10:37) #18114Do kódu stačí přidat
a href="obrazek.jpg" rel="galerie"
a všechny ty odkazy, které budou mít stejný rel, budou fungovat jako galerie.
25. března 2014 (11:16) #18115Mohl by jste mi prosím ještě poradit, jak tam ten kód vložit tak, aby se mi všechny obrázky co mám na stránce zobrazovaly jako galerie, nechci nic zadávat v dashboordě navíc, prostě, aby to bylo automatický.
Našel jsem na Vašich stránkách tento kód týkající se náhledových obrázků
<a class="fancybox" href="<?php echo get_the_post_thumbnail($post->ID, 'large'); ?>">
Dal by se tento kód upravit pro tu galerii.
Omlouvám se, jsem začátečník a php se učím.
Moc děkuji
25. března 2014 (12:26) #18116Zajímalo by mě, proč nechcete používat žádný plugin (zejména pokud jste začátečník)? Pro tyto účely je to asi nejlepší řešení a existuje jich několik, např. Easy FancyBox.
25. března 2014 (12:44) #18117No už mi to skoro funguje, tak proč tam dávat plugin, to bych ho mohl používat na všechno
25. března 2014 (13:03) #18118Ano, ale ušetřil byste si tím spoustu času. Někdy je zbytečné používat pluginy, ale zrovna v tomto případě tam vidím jenom výhody:
– Po aktivaci pluginu vše automaticky funguje (obrázky i galerie) a nemusíte nic řešit nebo upravovat šablonu a její funkce.
– Autor pluginu pravidelně aktualizuje všechny načítané Javascriptové soubory (což nevěřím, že budete dělat také).
Nevidím tam jedinou nevýhodu pro použití kvalitního pluginu? Zatím se pouze pokoušíte simulovat jeho funkce, upravujete soubory šablony (co se bude dít při případné aktualizaci šablony) a nevidím v tom moc smysl. Jediné, co mě napadá je snaha naučit se to :-) Ale i v tomto případě doporučuji nainstalovat plugin a prohlédnout jeho zdrojové kódy, kde zjistíte podrobnosti…
25. března 2014 (13:43) #18119No jediný důvod proč to dělám, že se to chci naučit, šablonu jsem si udělal vlastní a je možné, že tam nakonec ten plugin dám, jak píšete má to spíše výhody, ale zajímalo by mě, jak tam vložit ten kousek kódu – plácám se s tím nějakou dobu, tak bych z toho měl radost, že se mi to podařilo rozchodit:-)
25. března 2014 (16:35) #18120Tak já to trochu rozvedu.
V js souboru zavoláte metodu $(“.fancybox”).fancybox(); a všechny odkazy, které budou mít třídu class=”fancybox”, budou se otevírat v popup okně.
Každý odkaz se otevře ve svém okně.
Pokud do odkazů vložíte rel, bude je fancybox seskupovat podle hodnoty rel.
<a rel="group1" href="image_big_1.jpg"><img src="image_small_1.jpg" alt=""/></a>
<a rel="group1" href="image_big_2.jpg"><img src="image_small_2.jpg" alt=""/></a>
<a rel="group2" href="image_big_3.jpg"><img src="image_small_3.jpg" alt=""/></a>
<a rel="group2" href="image_big_4.jpg"><img src="image_small_4.jpg" alt=""/></a>Zde je kód přímo z tutoriálu. Vidíte, že pro rel, tam jsou dvě hodnoty, group1 a group2.
Proto budete moci přecházet šipkami pouze mezi dvěma obrázky, které mají group1 a nebo group2, záleží na tom, který právě otevřete. Pokud by jste vše sjednotil na group1, budete moci listovat mezi čtyřmi obrázky.
Pokud tedy ten odkaz doplníte, tak jak jsem vám psal
<a class="fancybox" href="obrazek" rel="galerie">
budete moci listovat mezi všemi obrázky na stránce, které mají class=”fancybox” a rel=”galerie”.11. září 2015 (16:07) #24667 -
AutorPříspěvky
Pokud chcete odpovědět na toto téma, musíte se nejdříve přihlásit.