Shopping Bag On Mobile

[Kibana]

Hi,

I’m experiencing an issue on my iPhone when testing the Cart page. Please refer to the provided screenshot. How can I fix this?

Thank you in advance.

Attachments:

You must be logged in to view attached files.

[David Martin – Support]

Hi,

What theme version are you?

Please add a WP login.

Thanks.

[Kibana]

This reply has been marked as private.

[David Martin – Support]

Yes, please first update all available plugin/theme upgrades.

[Rui Guerreiro – SUPPORT]

Hi,

You can press in theme details.
https://www.dropbox.com/s/pyz39vzzec6v00p/Screenshot%202016-11-14%2011.42.17.png?dl=0

Try to purge the cache plugin.

we don’t have any reported issue with the latest Woocommerce version.

-Rui

[Kibana]

Ok. So as you’ve probably seen already I’m running the latest version of Neighborhood and just updated WooCommerce. After that I emptied all caches but the issue still exists.

You can also see this issues happening in a web browser on a computer when making the screen horizontally smaller. When the screen real estate is gets smaller than approx. 770px it messes up the layout.

[David Martin – Support]

Please can you disable all plugins leaving only WooCommerce active whilst we take a look. This is not the default theme style so something else is causing this.

Thanks.

[Kibana]

Hi David,

I’ve deactivated all plugins except WooCommerce. The issue still remains.

[Kibana]

@David: could you update me on the status for this request?

[David Martin – Support]

It seems the latest WooCommerce is forcing a CSS override on the cart.

Here is our demo:

If I remove the WooCommerce small screen CSS, yours then looks like so:

Please install and activate the supplied child theme, inside the child theme functions.php file please paste this:

// Remove each style one by one
add_filter( 'woocommerce_enqueue_styles', 'jk_dequeue_styles' );
function jk_dequeue_styles( $enqueue_styles ) {
	unset( $enqueue_styles['woocommerce-smallscreen'] );	// Remove the smallscreen optimisation
	return $enqueue_styles;
}

[Kibana]

Hi David,

Thanks for this solution. It works but introduced white space on the left and right side. How can I fix that?

Attachments:

You must be logged in to view attached files.

[David Martin – Support]

Hi,

Please update the code to this:

// Remove each style one by one
add_filter( 'woocommerce_enqueue_styles', 'jk_dequeue_styles' );
function jk_dequeue_styles( $enqueue_styles ) {
   if( is_checkout() ) {
      unset( $enqueue_styles['woocommerce-smallscreen'] );	// Remove the smallscreen optimisation
   }
   return $enqueue_styles;
}

[Kibana]

Hi David,

I figured out it’s not your code generating the white space but activating the child theme causes the issue. I tested this by removing the child theme and upload and activate it from scratch without your code and it still gives me the white space on the sides. Any idea which could cause this? I’ve deactivated all plugins except WooCommerce but that didn’t make any difference.

PS: This issue is only visible on my iPhone 7 Plus and iPhone 6S. Not on my iPad Mini.

[David Martin – Support]

Did you use the updated code?

Please add your FTP details.

[Kibana]

This reply has been marked as private.