-
AuthorPosts
-
January 17, 2015 at 7:16 pm #381283
Hi,
I wonder, is it possible to change the action in image gallery from mouseover to click? What I want is to keep the Tooltip when mouseover at thumbnails however I want the bigger image to change on top with a click and not with mousover. Sorry for my bad english.January 19, 2015 at 7:40 pm #382049Hi vonhektor!
Open up /enfold/js/shortcodes.js and change line 2287 from this.
gallery.on('mouseenter','.avia-gallery-thumb a', function()
To this.
gallery.on('click','.avia-gallery-thumb a', function()
Regards,
ElliottJanuary 23, 2015 at 12:00 pm #384294great thanks alot! just a “make sure” question: do i have to copy that directory & file into the child-theme to be permanently applied? I meen I work with the child theme.
January 23, 2015 at 6:01 pm #384486Hi!
Yes, please move modified file to your child theme to the same path and then please add following code to Functions.php file of your child theme
function wp_change_shortcodesjs() { wp_dequeue_script( 'avia-default' ); wp_enqueue_script( 'avia-default-child', get_stylesheet_directory_uri().'/js/shortcodes.js', array('jquery'), 2, true ); } add_action( 'wp_print_scripts', 'wp_change_shortcodesjs', 100 );
Best regards,
Yigit- This reply was modified 9 years, 11 months ago by Yigit.
January 23, 2015 at 6:27 pm #384514thanks alot, will try this out. It looks like as it is a general code to enqueue the avia.js file from the parent theme. would that mean that I can also do other changes in that script (I actually did) and with your code above I ensure it will be loaded and never overwritten by a theme update? If I have to specify my changes (from avia.js) in the child-function.php, I better take a course on it. but maybe that’s it? anyhow thanks so much for your help and i can really understand when some user write you are a hero. ;)
January 23, 2015 at 6:33 pm #384518Hey!
I edited the code and changed the function name but yes, you can adjust the code and change it to following
function wp_change_aviajs() { wp_dequeue_script( 'avia-default' ); wp_enqueue_script( 'avia-default-child', get_stylesheet_directory_uri().'/js/avia.js', array('jquery'), 2, true ); } add_action( 'wp_print_scripts', 'wp_change_aviajs', 100 );
to load avia.js file from your child theme :)
Regards,
YigitJanuary 23, 2015 at 11:52 pm #384715All right, I could have you misunderstood because with my changes all images disappear (mansory and easy slider). I used another way of showing the images but in general I would like to know about that option and how to set it up to work:
When you say: “to load avia.js file from your child theme ” do you mean I have to copy that file with the changed code into the Child Theme Folder? Or should I leave the avia.js file in the parent directory as the child function.php tells it how to deal with the changes? If I do that the images in mansory and easy slider disappear as mentioned. Sorry I am not into php and in which direction the code is working. so I’d very happy if you can help once more please. Thanks alot!January 26, 2015 at 9:59 am #385314Hey!
You need to create a js folder inside the child theme directory then place the modified avia.js file inside. This means that update can break the theme if there is a significant changes on the avia.js scripts.
Regards,
IsmaelJanuary 26, 2015 at 10:58 am #385334thanks for your patience! it perfectly worked for my avia.js and shortcodes.js! so this issue is resolved.
However I have got one suggestion for the gallery that works with thumbnails and a bigger picture above. one of my clients did not choose that gallery style as the thumbs do not grow in size when the screen gets smaller. so if it behaves similar to the mansory thumbnails, being responsive to the screen, it might be more attractive for using it. what do you think?January 28, 2015 at 10:56 am #386875Hi!
You can change the gallery thumbnail column size on mobile view using media queries. For example, set the Gallery Columns to 6. Add this on Quick CSS to adjust the size of the thumbnail columns on mobile view:
@media only screen and (max-width: 767px) { #top #wrap_all .avia-gallery-1 .avia-gallery-thumb a { width: 25%; } }
Best regards,
Ismael -
AuthorPosts
- You must be logged in to reply to this topic.