Niall a11n

Hi @freelylw,

Hope you managed to get the code working. We haven’t heard back from you for a while, so I’m going to mark this post as resolved. If you have any further questions or need additional help with the Storefront theme, please start a new thread and we’ll be able to help you out there.

Thanks!

Hi @lodoka,

Hope you managed to map your products. We haven’t heard back from you for a while, so I’m going to mark this post as resolved. If you have any further questions or need additional help with the Facebook for WooCommerce plugin, please start a new thread and we’ll be able to help you out there.

Thanks!

Hi @mariograsso87,

We haven’t heard back from you for a while and it sounds like you have fixed the media breakpoint issue you were having, so I’m going to mark this post as resolved. If you have any further questions or need additional help with the Storefront theme, please start a new thread and we’ll be able to help you out there.

Thanks!

Hi @boppar,

Sorry for the late reply, I seem to have missed your reply.

I had a look at your request and it looks like that will require quite a bit of customization, which we would not provide. I will leave this thread open for a bit to see if someone else can chime in and help you out.

I can also recommend the Storefront developer documentation for help with Storefront code.

I also recommend visiting the WooCommerce Facebook group or the #developers channel of the WooCommerce Community Slack for further help.

We’re lucky to have a great community of open-source developers for WooCommerce, and many of our developers hang out there, as well.

Hi @lodoka,

Thanks for reaching out to us!

Technically, it is possible to map the product category automatically. What you could do is assign a default Google Product Category to all products in your catalog on the Marketing > Facebook > Product Sync tab with a minimum of two category levels: https://docs.woocommerce.com/document/facebook-for-woocommerce/#how-to-manage-your-woocommerce-catalog.

That would save you from specifying product categories manually on an individual product level: https://docs.woocommerce.com/document/facebook-for-woocommerce/#how-to-manage-your-woocommerce-catalog

Please let us know if you have further questions!

Thanks for the link @freelylw.

It looks like you have added some custom CSS to your site using the Simple Custom CSS and JS plugin.

I see you have added this code to increase the left padding for the columns:

.hentry .entry-content .wp-block-columns .wp-block-column:not(:last-child), .columnborder { padding-left: 100px; }

Link to image: https://d.pr/i/KFllUc

We would need to change that column padding for mobile devices, as it prevents the button from displaying correctly. The button width was also set to 50% in the WP-Admin, which works great on desktop but not so much on mobile it seems.

Please add the following code to the Appearance > Customize > Additional CSS section of your WP-Admin dashboard or via the Simple Custom CSS and JS plugin you seem to be using:

/* Fix button width and spacing on mobile | wpniall-wporgforums */
@media only screen and (max-width: 767px) {
  .hentry .entry-content .wp-block-columns .wp-block-column:not(:last-child), .columnborder {
      padding-left: 55px!important;
      padding-right: 45px!important;   
  }
   .wp-block-buttons>.wp-block-button.wp-block-button__width-50 {
       width: calc(100% - .5em);
   }
}

It should look something like this on an iPhone, for example:

Link to image: https://d.pr/i/QpDjDJ

Please let us know if you need any further help!

Hi @pinecones,

Hope you managed to change your site’s design! We haven’t heard back from you for a while, so I’m going to mark this post as resolved. If you have any further questions or need additional help with the Storefront theme, please start a new thread and we’ll be able to help you out there.

Thanks!