Unexpected horizontal lines between widgets in translations

This thread is resolved. Here is a description of the problem and solution.

Problem:
The Woodmart theme shows horizontal lines in widgets when we display language specific widgets/block elements using “Display on languages” option.

Solution:
The issue is solved by adding the below CSS:

/* Remove horizontal lines between widgets */
.widget:empty {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    border-bottom: none !important;
}

in the custom CSS section of the theme.

This is the technical support forum for WPML - the multilingual WordPress plugin.

Everyone can read, but only WPML clients can post here. WPML team is replying on the forum 6 days per week, 22 hours per day.

Tagged: Not WPML issue

This topic contains 6 replies, has 2 voices.

Last updated by Noman 1 year, 7 months ago.

Assisted by: Noman.

Author	Posts
November 3, 2023 at 9:40 am #14724009
marikaK	Hello! I launched my site with default language and English translation. I saw already then, that in English translation there is one unexpected horizontal line in single product page sidebar widget, but the visual issue was not so big. Now I am translating page in one more language and doing as was told before by WPML support: adding widgets for each language separately, but I am getting some ununexpected horizontal lines between those elements. It seems it comes from separate language widgets. And now those lines are in my original language as well. How to get rid of those lines in widget translations? This was my previous post, when languages didn't show at all, but the problem was solved, only there was one horizontal line.. So I left this as was, because main problem was solved 🙂 https://wpml.org/forums/topic/color-swatches-layouts-html-block-sidebar-widget-translations-in-wpml/
November 5, 2023 at 3:08 pm #14733375
Noman WPML Supporter since 06/2016 Languages: English (English ) Timezone: Asia/Karachi (GMT+05:00)	Hi, Thank you for contacting WPML Support. To take a closer look at horizontal lines issue, please provide temporary access (WP-Admin and FTP Login info) to your site (preferably staging site), so that I can look into your setup and debug the issue. Your next answer will be private which means only you and I have access to it. === Please backup your database and website === ✙ I would additionally need your permission to deactivate and reactivate Plugins and the Theme and to change configurations on the site. This is also a reason the backup is really important. ✙ Please provide the example product link where I can see this issue. Thank you
November 6, 2023 at 8:21 am #14735301
Noman WPML Supporter since 06/2016 Languages: English (English ) Timezone: Asia/Karachi (GMT+05:00)	I’m able to fix this issue by adding/overriding a small CSS code in the custom CSS section of the theme: hidden link and now it seems to be working correctly now, could you please check and confirm? Thank you
November 6, 2023 at 8:38 am #14735501
marikaK	Thanks, Norman! This looks better, but the problem is still not fully solved and it makes another problem.. English looks ok (even there are still one line on the top, which should't be there), but in Latvian and Estonian there are still lines. Less than before, but they are there. And this css removes lines from the catalog pages with widget filters as well and everything looks messy - no lines, no spaces betweeen filters.. Before this css, those pages looked ok and there was no problem..
November 7, 2023 at 3:59 pm #14749841
Noman WPML Supporter since 06/2016 Languages: English (English ) Timezone: Asia/Karachi (GMT+05:00)	Thanks for your feedback. I have removed the CSS that was previously added by me. I have tried a basic troubleshooting steps but none of them worked so far. I suspect it might be a compatiblity conflict with Woodmart theme and Display on languages option in a widget. When we spot compatibility conflict we need to reproduce it on fresh WP site in order to escalate it to our compatibility team, so, I’m going to reproduce this issue at fresh WP site with WPML and Woodmart theme and will let you know the results, Thank you for cooperation and patience
November 8, 2023 at 6:12 am #14752877
marikaK	Ok, thanks, Norman! Will wait, but pause with next translations till this is solved! 🙂
November 8, 2023 at 4:07 pm #14758933
Noman WPML Supporter since 06/2016 Languages: English (English ) Timezone: Asia/Karachi (GMT+05:00)	I’m able to replicate the issue at fresh WP site by following the below steps: 1. Install/activate the Woodmart theme. 2. Install/activate the Woodmart core, WPML Multilingual CMS, WPML String Trasnlation, WooCommerce, and WooCommerce Multilingual plugins. 3. Created a product in the default language and translated it into a secondary language. 4. Went to Appearance >> Widgets section and added the widgets/blocks to “Single Product page widget area” and it all works good. 5. When I enabled the “Display on languages” option then it starts arising horizontal line issues with the block elements. 6. Then, I tried to use the below CSS: /* Remove horizontal lines between widgets / .widget:empty { margin-bottom: 0 !important; padding-bottom: 0 !important; border-bottom: none !important; } In the custom CSS section of the theme and it start showing correctly. Here is the fresh site Auto login URL where I’ve tried it: hidden link* Default language single product link: hidden link Secondary language single product link: hidden link Could you please try to use the same CSS on your site and see if this resolves your issue. If the issue still persists, could you please try to add those blocks/widgets on the above fresh WP site in which you are still facing issues. Thank you for your cooperation and patience
November 9, 2023 at 9:59 am #14764241
marikaK	Thanks, Noman! 🙂 You have found right solution! Thanks a lot! Now everything looks as it should in all languages! 🙂 Have a nice day! 😉