[Resolved] Potential Store Page Bug

[Garth Dryland]

Hey Tom,

I wrote up some support posts on Simple CSS about 20 hours ago which I felt in some way relates to that plugin but its been deleted. If it has nothing to do with Simple CSS then it potentially has to do with Generatepress and or WooCommerce.

Its certainly one or more of the three. Automattic claim WooCommerce is Gutenberg ready as I know you have with GP however someone has clearly missed something. I’ve linked to the WooCommerce post however the majority of the content is also posted below in case said posts also go missing.

“Immediately after converting my store page to blocks the formatting went out. All other pages converted perfectly. To fix the format of the main store page I have to alter the site wide CSS by 30px to correct the position of the title, headers, paragraphs etc.

So I decided to install the Simple CSS plugin (which I use on other sites) so I could alter the CSS for the store page only. Problem being is that Simple CSS won’t work on the store page. It works on every other page, just not the store page despite the fact it should.

I suspect there’s a bug impacting store page layout and stopping plugin from working.

If you go to my live site you’ll see that the title, header and paragraphs are spaced differently from the rest of the site. Prior to converting from classic to blocks all pages were formatted the same using the exact same CSS across the entire site.

It also appears to only impact the main page content area of the store, not widgets etc as far as I’m aware. Do you have any idea why I’m experiencing said issues?”

[Tom]

Hey Garth,

The Simple CSS metabox doesn’t/can’t work on index pages (like the shop) in WP.

The issue seems to be an excessive amount of empty paragraphs in your content: https://www.screencast.com/t/nY7EcqNzuIi

You can go into the HTML of your page to remove those completely. Maybe something glitched out when you converted your content to blocks. Very strange.

[Garth Dryland]

Hummmm that is odd because the code editor doesn’t contain the extra <p></p> tags like you see when viewing the source. I also tried the WooCommerce Storefront theme on my staging site to see if that helped and I still see the extra paragraph tags in the source only. So I tried checking the database but that just looks identical to what I see in the code editor which is correct.

I also tested WooCommmerce with the Storefront theme on a fresh WordPress 5.0.2 install and threw some random text into the store index page and this happened which clearly isn’t right. You only see these extra tags from the page source though, not within the editor or DB.

<div class="page-description">
<p><!-- wp:heading --></p>
<h2>xccvcvsdcvdcvd</h2>
<p><!-- /wp:heading --></p>
<p><!-- wp:paragraph --></p>
<p>nsdnnndndnvdcv</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:paragraph --></p>
<p>ddkfdnfkdnfndf</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:heading {"level":4} --></p>
<h4><strong>xcdvdvdvd</strong></h4>
<p><!-- /wp:heading --></p>
<p><!-- wp:paragraph --></p>
<p>xcxvxvxvxvvx</p>
<p><!-- /wp:paragraph --></p>
<p><!-- wp:paragraph --></p>
<p>xvxvxvxvxvxvx</p>
<p><!-- /wp:paragraph --></p>
</div>

So the way I see it now, this issue must be a bug in WooCommerce itself, unless you can think of anything else?

PS: Where is the best place to post a support issue re bugs for WooCommerce? I’m using the free version so support gets somewhat lost in the forum with tonnes of less important support requests.

Cheers

[Leo]

Looks like it’s either WooCommerce or Gutenberg conversion.

I’d say start with their support forum anyways and see if they will notice. If not then maybe try their Github Page?
https://github.com/woocommerce/woocommerce/issues

[Garth Dryland]

Okay I might go post as link there back to this thread.

I don’t really see it being conversion related now because the clean site was not converted from classic to blocks given it was already using Gutenberg blocks at install (which at the time was WordPress v5.0.2) so any content was new and going straight into brand new block fields.

I found a workaround to get the format back. I had to delete all the paragraph tags including the block identifiers as follows. I cant remove the extra paragraph tags any other way. Not an ideal solution.

The only thing above the example below is the main page title which you don’t see code of within editor.

<h4><strong>header</strong></h4>
paragraph text
<h4><strong>header</strong></h4>
paragraph text
<h4><strong>header</strong></h4>
paragraph text

[Leo]

Let us know if you hear back and it is a legit bug 🙂

[Garth Dryland]

As of today the status labels were updated and I have a reply.

I’ve since added a post here back to the others.

[Leo]

Thanks for following up!

[Garth Dryland]

I’m closing this topic – You can see the proposed solution #22326 to this issue linked down the page a little.

[Leo]

Thanks for reporting back 🙂

[Author]

Posts