Layout Single Product Pages

[maike]

Hi Ed,

just loaded your Theme up to our life systems and the following questions occurred:

1) We are using the German Market Plugin which adds necessary legal information to Woocomerce, for example a tax information on the Product Pages – as you can see here:

http://www.get-on-apps.com/en/hypnosis-downloads/hypnosis-for-weight-loss/

Would it be possible to Remove the Price which is displayed by Dante and replace it with the “German Market Price” on the Single Product Pages?

2) If you use the Right Sidebar the “Need help / Feedback” row doesn’t look nice as you can see on the sample. Do you have an idea to solve this?

Thank you 🙂
Maike

[Swift Ideas – Ed]

Hey Maike,

1) You would need to make some code changes to replace the price at the top, but you can change the look with the following with custom css:

.summary-top {
display: none;
}
.shipping_de.shipping_de_string {
margin-bottom: 30px;
}

2) Sure, you can use this:

.has-one-sidebar .product_meta p .leave-feedback {
float: left;
}
.has-one-sidebar span.posted_in {
margin-top: 10px;
display: inline-block;
}

Hope that helps.

– Ed

[maike]

Hi Ed,

thank you for the fast reply. 2) works perfect 🙂

Can I switch of the Price without loosing the line (below the Price)?

Cheers
Maike

[Swift Ideas – Ed]

Yes, you would just use the following custom css:

.woocommerce div.product .summary p.price {
display: none;
}

– Ed

[maike]

Thanks, Ed. That that doesn’t work, cause it deletes the other price as well 🙁

I will go with the two prices, I think it’s the best way.

BR
Maike

[Swift Ideas – Ed]

Try this code instead – this will definitely only remove the second instance of the price:

.woocommerce div.product .summary > p.price {
display: none;
}

– Ed

[maike]

Hi Ed,

“never-ending story” 🙂 …when I use this the tax information behind the price is also removed. This has to be visible due to german law…

Is there a code which just moves the first price?

Sorry to ask again…

BR
Maike

[maike]

🙂 I found a solution 🙂

Remove second price:
.woocommerce div.product div.summary > p.price .amount {
display: none;
}

Place tax information:
.woocommerce div.product div.summary .woocommerce-de_price_taxrate {
font-size: 12px;
display: block;
margin-top: -150px;
}

Since I am no programmer is that an appropriate way to solve this?

BR
Maike

[maike]

…too soon…doesn’t look good on iPhone 5 🙁

[Swift Ideas – Ed]

Try adding this to sort the mobile display:

@media only screen and (max-width: 479px) {
.woocommerce div.product div.images {
padding-bottom: 30px;
}
.woocommerce div.product div.summary .woocommerce-de_price_taxrate {
margin-top: -175px;
}
}

– Ed

[maike]

Hi Ed,

works fine …but only for the portrait view. Do you have something similar for the landscape one?

BR and a thousands THANK YOUs!!!
Maike

[Swift Ideas – Ed]

Change the responsive code I gave you to be in this order:

@media only screen and (max-width: 767px) {
.woocommerce div.product div.summary .woocommerce-de_price_taxrate {
margin-top: -218px;
}
}

@media only screen and (max-width: 479px) {
.woocommerce div.product div.images {
padding-bottom: 30px;
}
.woocommerce div.product div.summary .woocommerce-de_price_taxrate {
margin-top: -175px;
}
}

– Ed