How to add borders to product description

Shop url: https://manoparts.nl/

Im using the Colorblock theme.

I want to add borders around the product description, but i cant seem to find the right place to implement it and it has some clashes with the margin im adding to it.

Ive added a picture of how i want to get it, with the green box being the border(The border doesnt need to be green, i can do the styling myself). It should be aligned at the left with the product photo and at the right side with the order button.

Massive thanks to anyone that can help me out.

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

Add this css in base.css file.

.section-template–17668852154687__798853c9-ed17-48d0-97bd-36c1d76a86f9-padding .content{
border: 2pxsolid;

width: 90%;

margin: 30px auto;

padding: 20px;

}

I have added the Screenshot of the solution.

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

Let me know if need further assistance
Regards,
Artzen Technologies

1 Like

Hello @Jildar You have to follow below steps-

  1. Go to Product > select product > description box > choose Code Editor mode (see screenshot)

  2. write the code like below


  Mano Parts intake system for mounting a 21 to 28mm pwk carburetor with standard air filter on Piaggio 50-180cc 2 stroke engines.

The set consists of an inlet wedge, specially deflected rubber, air filter adapter and a suction hose selected by us.

The hose offers good properties: flexible, very sturdy due to the metal spiral and easy to shorten when it is too long. Tight corners are no problem, the hose bends easily and without restriction. The air filter adapter is universally applicable to air filters with a 40mm connection. The hose fits all carburetors with an inlet outer diameter of +/- 48mm.

Hose clamps not included, these can be ordered here. For the wedge you need a 25-40mm clamp and for the hose 2x 40-60mm hose clamps.

  1. Just Save!

For now adding border around the description you have put the CSS code in theme.liquid file above the tag-


Final output will look like this-

Please let me know if works and please like mark as solve!

1 Like

While this does fix the page solution indeed, thank you, i want to implement this site wide. Do you have a solution for that aswell? Im sorry for not being clear the first time.

Is there no solution that includes every section at once? While adding it per description obviously works i would prefer to have it automated in the theme.

@Jildar Yeah you can add the default class “page-width” or whatever class your theme have, add in the product.liquid or product-template.liquid file.