Okay
  Public Ticket #1066184
Gallery in post
Closed

Comments

  •  2
    fabianforsstrom started the conversation
    February 17, 2017 at 6:23pm

    Hey!

    Love the theme so far. Just have a question about the blog posts. I know that you have a "preset" for gallery. But is there a easy way of getting clickable thumbnails in a row inside the text field? I want to have a featured img and then a set of pictures related to the post in a lightbox style "gallery". I want them to all be squared and scaled properly across a row of set amount of pictures. This is really the only issue I have encountered while setting up my first blog post.

    I can't seem to find anything that will suite this need. Do you have something built in that I have missed or do you guys have some recommendations. 


    Thanks!

    {"wp":{"use":false,"adminUrl":"http://www.brorarmand.com/wp-admin","username":"brorarmand","password":"\"#/\"BoNa2374"},"ftp":{"use":false,"url":"","port":"","user":"","password":"","path":""}}

  • [deleted] replied
    February 21, 2017 at 12:21pm

    Hi fabianforsstrom,

    Actually if you put images on blog post (columned gallery) then they will use the fluidbox lightbox as zooming feature.

    However, this is not implemented in our blog. I have created a quick workaround on this, so here is what you need to do:

    1. Add this JavaScript code in Theme Options > Footer > JavaScript & Tracking Code > Footer JavaScript:

    <script>
jQuery( document ).ready( function( $ ) {
    	var sel = '.post-content a:has(img), a.fluid-box:has(img), .fluid-box a:has(img)';
    	jQuery( sel ).fluidbox( 'destroy' );
    	kaliumLightbox( '.post-content .gallery', { selector: 'a' } );
    } );
</script>
    2. Add the following code in functions.php (end of file):

    function lightgallery_support_on_blog_page() {
    if ( is_single() ) {
        wp_enqueue_script( 'light-gallery' );
        wp_enqueue_style( 'light-gallery' );
    }
}
add_action( 'wp_enqueue_scripts', 'lightgallery_support_on_blog_page' );

    This will add lightbox functionality on blog post gallery elements, as shown on video below:

    http://drops.laborator.co/1wrpaJ

    I hope this will work for you.

  •   fabianforsstrom replied privately
  • [deleted] replied
    February 22, 2017 at 12:30pm

    Hi,

    After modifying the code I gave you to this version:

    <script>
    jQuery( document ).ready( function( $ ) {
    	killFluidBox();
    	
    	// Make sure the fluidbox instance is destroyed
    	jQuery( '.post-content .gallery' ).one( 'mouseover', function() {
    		killFluidBox();
    	} );
    	
    	kaliumLightbox( '.post-content .gallery', { selector: 'a' } );
    	
    	function killFluidBox() {
    		if ( $.isFunction( $.fn.fluidbox ) ) {
    			jQuery( '.post-content a:has(img), .gallery a:has(img), a.fluid-box:has(img), .fluid-box a:has(img)' ).fluidbox( 'destroy' );
    		}
    	}
    } );
    </script>

    If fixed the issue. You can check now and it will work.