PrestaShop description in full width

To display product descriptions in full width on PrestaShop, you’ll typically need to make adjustments to your theme’s template files or use a custom CSS solution, depending on your specific theme and version of PrestaShop. Here are the general steps you can follow:

1. Backup Your Files: Before making any changes, it’s crucial to back up your PrestaShop files and database to avoid any data loss or issues.
2. Access Theme Files:
   • Log in to your PrestaShop admin panel.
   • Navigate to Design > Theme & Logo (or a similar section depending on your PrestaShop version).
   • Find your currently active theme and click on the “Advanced Settings” or similar option to access the theme’s template files.
3. Edit Product Template:
   • Locate the template file responsible for displaying product descriptions. In most PrestaShop themes, this file is named something like product.tpl or product-description.tpl. The exact file name and location may vary depending on your theme and version.
   • Click on the file to edit it. PrestaShop often provides a built-in code editor, or you can use an external text editor and upload the modified file.
4. Adjust the Width:
   • Look for the section of code that defines the width of the product description container or element. It may include CSS properties like width, max-width, or float.
   • Modify these properties to make the description display in full width. For example, you can set the width to 100%:
     CSS

4. • width: 100%;

5. Save and Test:
   • Save the changes to the template file.
   • Clear your PrestaShop cache to ensure the updated template is loaded.
   • Test your product pages to confirm that the product descriptions are now displayed in full width.

If you are not comfortable editing template files directly, or if your theme’s structure makes it challenging to modify the width, you can use custom CSS to override the default styles. Here’s how you can do that:

1. Access Custom CSS:
   • In your PrestaShop admin panel, navigate to Design > Theme & Logo (or a similar section).
   • Find an option for adding custom CSS. This can vary based on your PrestaShop version and theme.
2. Add Custom CSS:
   • Insert the following CSS code to make the product description full-width:
     CSS

2. • .product-description {
width: 100%;
/* You can add additional CSS rules to style the description container as needed */
}

3. Save and Test:
   • Save the custom CSS.
   • Clear your PrestaShop cache.
   • Test your product pages to ensure that the product descriptions now appear in full width.

Please note that the exact steps and CSS class names may vary depending on your PrestaShop theme and version. If you encounter any issues or are unsure about making these changes, consider seeking assistance from a web developer or PrestaShop expert to ensure the changes are applied correctly and do not negatively impact your website’s functionality.