[lars]

I was wondering how to modify a theme from marketplace, for example a template file, without loosing the possibility of updating the theme.

For a client I used the persona_free theme with some modifications. I took the persona_free v.1.2.1.0 theme, crated a new theme from it and applied my modifications to it. That way I lost the possibility to easily update the theme and get i.e. latest bug-fixes (v.1.2.3.0). The only way I can apply changes is do it manually … or create a diff from persona_free v.1.2.1.0 with v.1.2.3.0 and apply that patch to my modified theme.

I am new to publii and might have overlooked something. Is there something like sub-theming, which allows theme customization without losing updateability?

[Bob]

Just override the files you want: https://getpublii.com/dev/theme-overrides/

--
Do you appreciate the support you've received today? If so, consider donating to the Publii team by clicking here; we'll be sure to use your donation to make Publii even better!

[lars]

Thank you Bob, for pointing to the tutorial. Maybe it’s worth to get it’s own entry in the dev documentation menu.

The tutorial was very helpful, I was able to change my current implementation to use theme overrides. The only thing I did not expect is, that the the build process modifies the file input/themes/persona_free/assets/css/style.css. It’s not a big deal, I just realized it, while I put the complete website project under git version control.

[shaun2k]

lars wrote:

The only thing I did not expect is, that the the build process modifies the file input/themes/persona_free/assets/css/style.css.

Take a look at this post.

You should not be modifying style.css.  Essentially,

The theme CSS is a sum of five CSS sources:
`theme-variables.js output + main.css + GDPR popup CSS + visual-overrides.js output + custom CSS`

[lars]

Thank you shaun2k. I did not modify the style.css, but the input/themes/persona_free-override/assets/css/main.css, which is a modified copy of input/themes/persona_free/assets/css/main.css.

Is that fine or should I better add my changes to “custom CSS” or somewhere different?

[shaun2k]

lars wrote:

Is that fine or should I better add my changes to “custom CSS”?

If the modifications are theme-specific, I would override main.css rather than custom css.
Whatever you put in custom css remains even when you decide to switch to a different theme for the website.
The custom css may or may not be applicable in that new theme.

[lars]

For now I decided to put changes into custom-css.css as overriding main.css may makes it difficult to get css updates of original theme, although custom-css.css is global.

[candidexmedia]

lars wrote:

For now I decided to put changes into custom-css.css as overriding main.css may makes it difficult to get css updates of original theme, although custom-css.css is global.

This is a good point, however, there are cases when Custom CSS falls short for me, or when I need a proper code editor.

To maintain a “sane”, upgrade-ready modified main.css file, I make sure to add comments every time I make an edit or addition. Then, when I update a theme, I run a git diff with VS Code of the modified CSS against the update theme’s CSS to quickly merge or ignore new changes.

[Author]

Posts