Home Forums WoodMart support forum Some problems

Some problems

Viewing 29 posts - 1 through 29 (of 29 total)
  • Author
    Posts
  • #159194

    arturs4
    Participant

    Hi!

    I have renewed support, and I would like you to fix these problems ASAP:

    1. Theme’s “Custom CSS for tablet” starts from 1024 px width, but Wpbakery responsive options for tablets starts at 991 px width. This makes a gap 991px – 1024px, where your theme’s custom css is in effect, but column design from Wpbakery is not. How can I synchronize these widths so that they took effect at same window/screen width?

    2. “Infinite scrolling’s” (https://woodmart.xtemos.com/infinite-scrolling/?opt=layout_infinite) main slider on Android phone, Chrome browser, doesnt load 2nd slide’s background image – neither in your site, neither in mine.

    Regards,
    Arturs

    #159286

    Hello,

    1) As you said that the theme custom CSS for tablet starts from 1024 px width but the WP Bakery responsive options for tablets starts at 991px width. To synchronize these widths requires customizations and this is beyond our limitations and support policy.

    But we will try to consider this in the nearest future coming release of theme.

    2) Your problem is resolved. I have test your slider and noticed that that the second slide background image not shown in android chrome browser. But when I edit your second slide and change the order of slide to “1” and edit the fist slide and change the order to ‘0’ then It shown alright in android mobile chrome browser.

    Video for clarification: https://jmp.sh/9fGfn71

    Best Regards.

    #159461

    arturs4
    Participant

    1) It would be great if you could synchronize them in future, because if I’m increasing font size for tablet and if column width is not changing to wider as well, then with window/screen sizes between 991px – 1024px it looks quite awful – big letters in narrow columns.

    2) Yep, now it works. Thanks!

    Best regards,
    Arturs

    #159462

    arturs4
    Participant

    There is another thing I would like to ask.

    #159499

    arturs4
    Participant

    4) There is also problem with lazyload – product images are not loading. Screenshot attached.

    Attachments:
    You must be logged in to view attached files.
    #159543

    Most Welcome,

    Tablet and desktop are two different screens. So it is not possible to use the desktop view also for the tablet screens in the product page. It requires customization and this is beyond our limitations and support policy.

    Yes, the product images loads after a while because you enabled the lazy loading feature. So if you want to disable the lazy loading feature in your site you need to go to the theme settings >> Performance >> Lazy loading for images.

    I have test your site after disabling the lazy loading and the products images loads just fine.

    Best Regards.

    #159712

    arturs4
    Participant

    2) Slider problem solution was temporary – the second slider’s img is not showing again. I changed slider order, and it worked for a while, bet then again second slider’s img was gone. Please, give me a more permanent fix for this.

    3) That’s sad. I hope you will add product image styling variants for tablets in future.

    4) Lazyload should load ALL images, that are in browser window’s visible area, when a page is loaded, no? But that doesnt happen – page loads with white blank spaces where should be images (see screenshot!). That is clearly a bug!

    #159798

    Hello,

    2) I noticed that you again revert the slide order. Kindly used the same order as it before which I have set in your site. Just use the second slide as number first and the first slide will be used as a second slide. You can check back now it is again working just fine.

    3) Sure, We will try to consider it in the nearest future update of theme.

    4) The actual purpose of lazy loading is to optimize your images loading on the website. They will be loaded only when user will scroll the page.

    Its default behavior of WooCommerce that the other content loads first and then the images loads. Also its seems that your website is quite slow that’s why it loads the images not suddenly after a while. Might be your third party plugins is the cause of the issue but its not related to the theme. Lazy loading is working just fine.

    You can check in the below video that your further images loads with scroll.
    Video for clarification: https://jmp.sh/HhrpCjj

    Best Regards.

    #159868

    arturs4
    Participant

    2) I switched order because the order you set wasn’t working anymore. Now you’re order is working again, but I will see if it will work after some time.

    3) Thanks.

    4) Your example video has too small height! Window/screen height must bee at least so that you could see first line of products without scrolling. Then you will see that banner image loads, but product images do not.

    Best regards,
    Arturs

    #159888

    Hello,

    Here is another video in which product images loads just fine with scroll because lazy loading is enabled and you contain banner before products.

    Video: https://jmp.sh/lLQ4HFk

    Because you are using banner in first row in all the categories that’s why the product images loads with scroll. Because the product images part comes exist in the part of page which needs scroll.

    So If you did not want this behavior and want to load your images without scrolling then go to theme options >> Performance >> Lazy loading for images and disable the lazy loading.

    I also test your site by removing a banner from one of you category from the description just for testing purposes, Products>> Categories and then the first line of products loads without scrolling on that category because it did not contain any banner.

    Page URL: https://www.birojamebeles.lv/test2019/lv/kategorija/konferencu-galdi/
    Video for clarification: https://jmp.sh/R7m7L7s

    Best Regards.

    #159930

    arturs4
    Participant

    In your 1st video look at 0:35 where you can see that product images DOESNT load until you make a scroll. That is not right! All images inside visible area should load and be visible even if you dont scroll. Lazyload shouldnt load only images that are outside visible area. That is the basic principle for lazyload.

    P.S. Please, dont make changes to the site. This is not a test site.

    #159985

    Hello,

    Yes, you are right. I have test the same thing on my test site, by using the banner image on category page also the lazy loading is enabled but still it works just fine on my test site.

    Kindly check your site after deactivating all the third party plugins. Because it is clear that the issue is not in the theme.

    Best Regards.

    #159988

    arturs4
    Participant

    I disabled all plugins, except Woocomerce, Woodmart Core and WpBakery. I removed all custom code from functions.php. And the problem was still there.

    Then I disabled WpBakery, and all images were loading ok. But your theme doesnt work without WpBakery, so if it is a compatibility issue, then you must fix it.

    #160002

    arturs4
    Participant

    I think I found the problem. It is the Lazyload option “Generate previews”: If its OFF then it leaves blank spaces. If its ON, then all is good.

    I don’t know if it is working as it should, but leaving blank spaces doesnt seem right to me.

    #160083

    Hello,

    Yes, might be possible it is due to “Generate previews” option.

    But now I test your site again and everything works just fine, banner and images loads without scroll and on scrolling down the further images load that means lazy loading working just fine now.

    Video for clarification: https://jmp.sh/dapp62F

    Best Regards.

    #160093

    arturs4
    Participant

    Yes, now images are loading ok, because I enabled “Generate previews” – before it was OFF.

    But main slider’s 2nd image is not loading again, though. Can you, please, check it on your android chrome?

    #160138

    Hello,

    I’m glad that images are loading fine now.

    Could you please deactivate all of your third party plugins and check with default theme plugins. Because Jquery errors shown in the console in only chrome browser which did not let the background image loads in the android chrome.

    Screenshot for clarification: https://jmp.sh/zv2D2B5

    Also try with different resolution image for background and for the temporary fix you can switch the slides order and update both the slides.

    Best Regards.

    #160169

    arturs4
    Participant

    Hi!

    I deactivated all plugins, except Woocomerce, Woodmart Core and Wpbakery, and I still got the same problem. Screenshot attached.

    Regards.

    Attachments:
    You must be logged in to view attached files.
    #160472

    Hello,

    Yes,In the chrome browser the warnings still shown.

    Screenshot for clarification: https://jmp.sh/ZJNgvuN

    Its seems the issue with in the chrome browser settings and not with the theme. Because on all the other browsers the slides works just fine.

    You can check the below article to fix it: https://github.com/bevacqua/dragula/issues/468

    And these warnings are harmless and you can simply ignore it, these warnings do nothing bad.

    Best Regards.

    #160495

    arturs4
    Participant

    Hi!

    I don’t care much about the warnings. The problem is that the 2nd image is not showing!

    So, what is the solution? To add a CSS rule touch-action: none;? Well, I added this:
    .woodmart-slider-wrapper, .woodmart-slider, .owl-stage-outer, .owl-stage, .owl-item, .owl-nav {
    touch-action: none;
    }
    and it didn’t work.

    Any other solutions?

    Regards,
    Arturs

    #160575

    Hello,

    The only way to fix this is to use those background images as a row background except of just using as just a featured image. Because due to some reasons the chrome browser did not able to display the second slide featured image.

    All you have to do is to remove the featured image of slide and edited the very first row which contains all the content and upload the same image for row background from “Design Options” tab.

    Screenshot for clarification: https://jmp.sh/GjDAvHh
    Screenshot for Row Background: https://jmp.sh/URZBiw9

    Or if you do not want to do this. Then allow me to troubleshoot your site by disabling all your third party plugins and by removing all of your custom code. You can take a backup of your site.

    Best Regards.

    #160616

    arturs4
    Participant

    I tried your solution, but it didn’t work very well – with img as background there are white gaps around img. Screenshot attached. Red borders are the size of featured image.

    Ok, I made a backup. You can do troubleshooting.

    Regards.

    Attachments:
    You must be logged in to view attached files.
    #160708

    Hello,

    Your problem is resolved. I test your site by deactivating all the third party plugins and switch to the parent version of theme.

    Then I edit your second slide named as “BIROJA MĒBELES slide 2” and use the same image for background with .png format and by changing the resolution of image. Then the image loads in the chrome browser of android phone.

    You can check in any android phone after clearing your site and browser cache.

    Video for clarification: https://jmp.sh/q3KL9zE

    Best Regards.

    #160987

    arturs4
    Participant

    Hi!

    Thanks for trying, but come on, man! PNG image? Really? It weights 339 KB, which, first of all, is a lot of data to load for mobile device; second, the quality of image is quite terrible; and, third, Google for such big images gives SEO penalties, which causes a drop in Google search results. Since Google is our main source of clients, a Google penalty and a drop in results is unacceptable. And the big file size also seems too big of a sacrifice for slider fix.

    I’m sorry to say this, but this solution isn’t going to work. Can you, please, find a solution that doesnt include big file sizes with low quality?

    Regards,
    Arturs

    #161005

    Most Welcome,

    Sorry but there is no other way to fix this issue. I have tried everything and then using the png format for image and finally it fixed the slides issue in chrome browser of android.

    If you want to increase the quality of image. Then simply increase the image resolutions with some photo editing tool and you can also compress the image to avoid big file size without losing quality of the image with any photo editing tool.

    Best Regards.

    #161014

    arturs4
    Participant

    Who is the developer of this slider?

    Regards,
    Arturs

    #161080

    Artem Temos
    Keymaster

    Hello,

    We are using OWL Carousel library for this slider.

    Try to add the following PHP code snippet to the child theme functions.php file and check how it works

    function woodmart_get_slide_class( $id ) {
    		$class = '';
    		$v_align = get_post_meta( $id, 'vertical_align', true );
    		$h_align = get_post_meta( $id, 'horizontal_align', true );
    		$full_width = get_post_meta( $id, 'content_full_width', true );
    		$without_padding = get_post_meta( $id, 'content_without_padding', true );
    		$class .= ' slide-valign-' . $v_align;
    		$class .= ' slide-halign-' . $h_align;
    		$class .= ' woodmart-loaded';
    		$class .= ' content-' . ( $full_width ? 'full-width' : 'fixed' );
    		$class .= $without_padding ? ' slide-without-padding' : '';
    		return $class;
    	}
    #161117

    arturs4
    Participant

    This fixed the problem! Thank you very much!

    Best regards,
    Arturs

    #161205

    Artem Temos
    Keymaster

    Great, you are welcome!

Viewing 29 posts - 1 through 29 (of 29 total)

The topic ‘Some problems’ is closed to new replies.