How can I stack MRP and sale price vertically on my product page?

[azaraashs]

https://azaraa.in/products/silver-pearl-necklace-chocker

On my product page i would like to stack the mrp and sale price vertically and add MRP and sale text too.

Also on the product description tab i would like it to be opened by default. 

Regards,

Thanks

[saim007 · Accepted solution]

@azaraashs Please copy and paste below code in the theme.liquid before </body> tag

<style>
.price--on-sale .price__sale{
flex-direction: column-reverse;
}
</style>

[Artzen_tech]

Hello @azaraashs 

Its Artzen Technologies! We will be happy to help you today.

I understood your problem and i have come up with a solution that will help you in achieving the desirable result.

Please follow the below steps for the results.

Step 1 . To stack the mrp and sale price vertically and add MRP and sale text too you have to change the css like this.

.price--on-sale .price__sale {

 display: inline;

}

Step 2. Now add the following html code in the product price snippet before the product price  span in your theme .

<span>MRP:</span>
<span>SALE PRICE:</span>

Step 3. To  open the product description tab  by default add the below code in the theme.liquid file of your theme.
<script>
$( document ).ready(function() {
$(".toggle-content").css("display","block");
});
</script>

If this solution helped you then please mark it as accepted.

Let me know if need further assistance
Regards,
Artzen Technologies

[sevensol898]

On my product page i would like to stack the mrp and sale price vertically and add MRP and sale text too.

yes i work on shopify get 

i sell on best dslr camera in use