-
Posts
-
I have registered a new image size in my child-theme functions.php:
add_image_size(‘slider’, 1600, 470, true);I am using the plugin Manual Image Crop.
With this plugin the user of the site can use this image size to make a custom cut-out from a photo to use for the slider.
(they do not have Photoshop to upload perfectly sized images)How can I change the settings of Layerslider WP to use this new image size?
What PHP file can I add to the child-theme and which lines can I edit to make Layerslider WP use the new ‘slider’ image size?PS. I love your theme and your support. So far I have bought it 8 times already. Keep up the good stuff! :)
Hey envis!
we recommend to work with this plugin: https://wordpress.org/plugins/simple-image-sizes/
Cheers!
AndyAndy,
That doesn’t really answer my question.
My solution creates “Iris-1600×470.jpg” from the uploaded “Iris.jpg”.
How can I force Layerslider WP to use this generated thumb.Layerslider now just loads Iris.jpg.
Hey!
Can you please post the link to your page and point out the image you would like to edit?
Regards,
YigitYigit,
I have put these links in the private content of this message.
Really appreciate your help :)
Hi!
Please add following code to Functions.php file in Appearance > Editor
function my_custom_image_size(){ ?> <script> jQuery(window).load(function(){ jQuery('img.ls-bg.ls-preloaded').each(function(){ jQuery(this).attr('src', jQuery(this).attr('src').replace(/\.jpg/, '-1600×470.jpg')); }); }); </script> <?php } add_action('wp_footer', 'my_custom_image_size');and then add following code to Quick CSS in Enfold theme options under General Styling tab
img.ls-bg.ls-preloaded { margin-left: 0!important; margin-top: 0!important; width: 100%!important; height: 100%!important; }Cheers!
YigitOk that is great, I change the CSS to
img.ls-bg.ls-preloaded { margin-left: 0 !important; margin-top: 0 !important; width: 100% !important; height: auto !important; }Since my images are resized to 1600×470 and the current slider is 1600×360.
But the strange thing is (and this happens with height: 100% as well) is that the image disappears after 4 seconds?
It’s a slider with only 1 slide right now.
Any idea what is causing this?Fixed it, it was the same problem you had.
The x in the source code you send me was wrong.
But now it’s working.However the slider first load “Iris.jpg” and the instantly switches to “Iris-1600×470.jpg”.
This produces a flash in the screen. Can this be fixed? :SHey!
I can’t see the flash personally but we modified the code above a bit:
function my_custom_image_size(){ ?> <script> jQuery('img.ls-bg.ls-preloaded').each(function(){ jQuery(this).attr('src', jQuery(this).attr('src').replace(/\.jpg/, '-1600×470.jpg')); }); </script> <?php } add_action('wp_footer', 'my_custom_image_size');Please remove browser cache or hard refresh the page.
Best regards,
IsmaelHi,
Please send us a temporary admin login so that we can have a closer look. You can post the details in the Private Content section of your reply.
Thanks,
RikardI now manually inserted the image url ********-1600×400.jpg in the slider.
This is not the solution I was looking for, but somehow I can not inform layerslider that it should use a specific cut from the image.Nevertheless, thanx for your help guys :)
Hey!4
The issue with the previous code is that it will only trigger once the page has been fully loaded. We fixed it on the modified code. Please try this:
function my_custom_image_size(){ ?> <script> (function($) { $('img.ls-bg.ls-preloaded').each(function(){ $(this).attr('src', $(this).attr('src').replace(/\.jpg/, '-1600×470.jpg')); }); })(jQuery); </script> <?php } add_action('wp_footer', 'my_custom_image_size');Regards,
Ismael
- You must be logged in to reply to this topic.