- This topic has 10 replies, 3 voices, and was last updated 4 years ago by David.
-
AuthorPosts
-
April 26, 2020 at 3:08 am #1256111Sebastian
Hi,
I found a strange behavior on single product pages. On safari is a gap before the product meta-data (description). See the screenshot where Chrome is on the left and Safari on the right.
I did a new installation on a different domain and face the same problem. The Test Page is on Chrome okay and Safari not. The new installation has no additional plugins activated.
I hope you can help me.
April 26, 2020 at 3:13 am #1256117SebastianOh yes … I forgot to mention that this effect only happens if the product is out of stock.
April 26, 2020 at 3:37 am #1256142SebastianAnother comment: when the GP Premium module is deactivated it looks okay.
April 26, 2020 at 10:14 am #1256689TomLead DeveloperLead DeveloperHi there,
What version of Safari are you using? I’m not able to see the issue on my end.
Let me know ๐
April 26, 2020 at 10:20 am #1256697SebastianHi Tom
Safari 13.1 on Catalina 10.15.4
First loading seems fine. Please try a reload. Then it starts becoming weird. I tested on 3 different Macs.
iPad OS 13.4.1 same behavior.
Thanks
April 26, 2020 at 3:55 pm #1256966TomLead DeveloperLead DeveloperTough one to debug – it snaps back whenever something in dev tools is changed.
Was trying to replicate on one of our Woo sites with no luck: https://gpsites.co/seller/product/happy-ninja/
Is it happening there for you?
April 26, 2020 at 5:15 pm #1257035SebastianOkay, now it gets really weird.
What I did:
1. I checked your page and your page looked fine for me.
2. I deactivated my child theme and switched to basic GP. Looked fine.
3. Back to child theme > broken.
4. Deactivated my functions.php modifications > broken
5. Fresh child theme style.css > broken
6. Checked and turned on every custom css line by line. Then I saw that I had some css left from the product page sidebar I once used. Removed it > broken
7. Turned in GP customizer “Layout – Woocommerce – Single Product” content/right sidebar on > not broken
8. Switched back in GP customizer “Layout – Woocommerce – Single Product” to content/no sidebar > worksSince the last step it works. I had “Layout – Woocommerce – Single Product” to content/no sidebar all the time, but somehow turning it off and on again fixed my issue.
Okay, so I went back to the test page and tried to replicate it.
Seems it has something to do with the customizer setting combined with the template’s css code (template Merch). Again, only Safari. I guess David is the template author.
/*-- Right Sidebar --*/ @media (min-width: 768px) { #right-sidebar { border-left: 1px solid rgba(0,0,0,0.1); } #right-sidebar .widget { margin-bottom: 0; } #right-sidebar aside:first-child { padding-top: 0; } #right-sidebar aside:not(:first-child) { border-top: 1px solid rgba(0,0,0,0.1); } } /* Single Product Sidebar position */ @media (min-width: 768px) { .single-product #right-sidebar { float: right; } .single-product div.product .woocommerce-tabs, .single-product div.product .related.products, .single-product div.product .upsells.products { width: 66%; display: inline-block; } } @media (max-width: 768px) { .wc-columns-container .products, .woocommerce .related ul.products, .woocommerce .up-sells ul.products { grid-gap: 20px; } .slideout-navigation.do-overlay .slideout-exit { position: static; text-align: center; } }
Sorry for the long posting. But your test page helped me on my search to replicate it. Removing above CSS code and going for no sidebar on the single product page (which I wanted) fixed it.
April 27, 2020 at 3:34 am #1257454DavidStaffCustomer SupportHi there,
Merch used a GP Hook Element to add the Sidebar inside of the Woo Single Product template and that CSS is required to create the Merch single product layout.
Where do you want to add the Sidebar : In the default layout or the Merch layout ? Let me know.
April 27, 2020 at 7:27 am #1257819SebastianHi David
I use the Merch template as basis and wanted to get rid of the sidebar on the single product page. So I deactivated it in the customizer settings, but didn’t delete the CSS for it. This caused this weird rendering on Safari.
For me it’s good now and we can close this ticket.
Thanks
April 27, 2020 at 7:28 am #1257822SebastianOh, I can mark this topic as resolved by myself.
April 27, 2020 at 7:34 am #1257837DavidStaffCustomer SupportGlad to hear that ๐
-
AuthorPosts
- You must be logged in to reply to this topic.