Sergio
Sergio

Reputation: 822

Creating a Child Theme using PrestaShop 1.7.3.2

Hi I am trying to create a Child Theme based on an existing theme. I managed to get the child theme registered and inheriting the parent theme's dom structure, stylings and scripts.

The issue I am running into is, if I create a custom.css inside child-theme/assets/css it does register nor do I see any changes on the frontend from that file. I then modified the config yaml file to include:

assets: use_parent_assets: true css: all: - id: product-extra-style path: assets/css/somestyle.css media: all priority: 100000 and still nothing is happening on the frontend. BUT it completely breaks the backend! Error 500 on every page of the backend. Once I remove everything from css: on down, then the backend comes back to life.

Any ideas on what's happening and how I can get this sorted out?

Thanks so much!

-S

UPDATE:

I have fixed the styles not showing up on the frontend by changing a few things in the yaml file... I changed the file name to custom.css and priority to 1000

assets: use_parent_assets: true css: all: - id: product-extra-style path: assets/css/custom.css media: all priority: 1000 But the backend issue still remains. Here's a more thorough explanation:

Once I have added the css: and below portion of the yaml file, saved it and went back to the backend, all is ok. I can navigate to any page with no issues. However, if I visit the theme selection page and click on the "Select This Theme" button of my child theme, it then breaks the entire backend. Not sure what and why this is happening, Even if my child theme is already selected and hit "Select This Theme" button again, it still breaks. Kinda weird.

I really would appreciate any insight on this issue.

Thanks,

-S

Upvotes: 2

Views: 4002

Answers (1)

MayaE
MayaE

Reputation: 31

It might be a little late but if it's any help to someone.

First of all, in Performance section in administration (Advanced settings > Performances) make sure you enabled the debug mode to see the errors.

To add a custom CSS file in Prestashop 1.7 :

  1. Create a custom.css file in the assets/css folder of your theme.

  2. Edit your theme.yml file located in the config folder of your theme

In your theme.yml file, don't forget to indent path, media and priority so that it's aligned with id, that's what caused your error :

assets: use_parent_assets: true css: all: - id: product-extra-style path: assets/css/custom.css media: all priority: 1000

  • Enable cache in performance section in administration

In my case, after refreshing, it worked fine from this point, but after researching some people had to:

Upvotes: 3

Related Questions