[CherylwoodmanParticipant]

Hi Themeco,

I think these changes we’ve made have affected the main shop page.

When you roll a mouse over the name of the product here (http://honestyforyourskin.co.uk/index.php/shop/?orderby=popularity) the price has shifted off-line.

Do you see what I mean?

How can I stop this from happening?

Cheryl

[FriechModerator]

Hi Cheryl,

Please add this to your Custom CSS in Customizer.

.woocommerce .price {
	float: none;
}

Thanks.

[CherylwoodmanParticipant]

Hi Friech – I’ve added the code, but there is no change on the page. I’ve left the code in the customizer so you can take a look at it if you need…

Cheryl

[Rue NelModerator]

Hello Cheryl,

Please have the css code updated and make use of this code instead:

.woocommerce .price, 
.woocommerce .quantity, 
.single_add_to_cart_button {
    float: none;
}

Hope this helps. Kindly let us know.

[CherylwoodmanParticipant]

Hi Rue – unfortunately that hasn’t changed anything either. I’ve left the new code on the site, so you can take a look.

[JoaoModerator]

Hi There,

Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password
– FTP credentials

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

Thanks

Joao

[CherylwoodmanParticipant]

This reply has been marked as private.

[ChristopherModerator]

Hi there,

Find this code:

.woocommerce .price, .woocommerce .quantity, .single_add_to_cart_button {
    float: left;
    margin: 0 10px p;
}

And update it to :

.woocommerce .price {
    padding: 0 22px;
    text-align: left;
}

Hope it helps.

[CherylwoodmanParticipant]

Thankyou – that’s sorted it!

At the moment the price is very large & the product name is small on this float menu. Can I adjust the price to be a smaller font size?

[CherylwoodmanParticipant]

Hi Christopher – I’ve actually just checked the shop page and although the code sorted out the front display. Its changed the product page layout of the quantity, add to cart & price button which were all nicely spaced on one line. You can see here…

http://honestyforyourskin.co.uk/index.php/product/the-natural-cleanse-100ml/

[JoaoModerator]

Hi There,

Update the code above provided to :

.post-type-archive-product.woocommerce .price {padding: 0 22px; text-align: left;}

And

add the following code:

.woocommerce .price, .woocommerce .quantity {
    float: left;
    margin: 0 10px;
}
.single-product .summary.entry-summary .quantity {
  margin-bottom: -100px;
}

.post-type-archive-product.woocommerce  .single_add_to_cart_button {
  float: right;
}

Hope that helps,

Joao

[CherylwoodmanParticipant]

Hi Joao,

That’s reversed the challenge. Now the page buttons look ok, but again the floating price option on the shop front is not aligned correctly (take a look —> http://honestyforyourskin.co.uk/index.php/product/the-natural-cleanse-100ml/). The quantity box has also disappeared (which I’m actually not too fussed about, but just thought I’d mention.

Do you want my logon details so you could go in and take a look yourself?

Cheryl

[Paul RModerator]

Hi Cheryl,

Kindly remove the code that reads

.single-product .summary.entry-summary .quantity {
  margin-bottom: -100px;
}

Then add this in custom css

.archive.woocommerce  .entry-product .price {
   float:none !important;
}

Hope that helps.

[CherylwoodmanParticipant]

Thanks Paul, you are a hero – that works!

There was just one other thing I’d asked before we got caught in the seesaw between the product page and the shop page. Can I change the size of the font that displays the price on the shop front page?

Its much larger than the product name at the moment and I’d like to make it smaller…

Cheryl

[JoaoModerator]

Hi There,

Please add the following code to Appereance Customizer Custom CSS

.woocommerce li.product .entry-header .price>.amount, .woocommerce li.product .entry-header .price>ins>.amount {
font-size: 17px;
}

Hope that helps,

Joao

[Author]

Posts