Create an override theme folder (https://getpublii.com/dev/theme-overrides/). Copy the config.json file into it. Open the config.json file in your override folder using your preferred editor. Look for “postConfig” and edit the “featuredImageWidth” section so that it looks like this:
If you are creating a custom theme for Publii, you might want to list all posts with a specific tag on a dedicated page. Here's how to do it:
First, create an override folder as described here: https://getpublii.com/dev/theme-overrides/ For the Mercury theme, the folder would be named mercury-override.
Then, copy the config.json file from the original theme folder into the override folder and add the following:
Replace the word "portfolio" with the tag you want to filter by. For example, if you have multiple posts tagged as 'Mallorca,' it would look like this: "postTemplates": { "mallorca": "mallorca filter" }, Note the use of lowercase letters.
A detailed guide can be found here: https://cv.domagic.site/posts/alternative-post-template-with-filter-for-publii-cms
Now duplicate the index.hbs file and move the copy to the previously created override folder. Rename the file to post-newname.hbs. In this example, the file should be named post-mallorca.hbs. Further details can be found here: https://getpublii.com/dev/how-to-create-custom-templates/
In the file, locate the {{#each post}} helper and replace it with:
Replace TAGNAME with the desired tag (the name, not the slug). In this case, use 'Mallorca' instead of 'mallorca.'
Finally, locate the closing {{/each}} helper (from the original {{#each post}}) and insert the following code just before it:
{{/each}}
{{/if}}
{{/checkIf}}
Additional information on this topic can be found here: https://getpublii.com/dev/how-to-display-posts-connected-with-a-specific-tag-name/
The post-newname.hbs file is now available as a post template. See the screenshot below. Create a new post and select this template:
For the masonry effect, ensure that in the footer.hbs, the script functionality is extended to the new template. In this case, add 'post-mallorca' as follows:
By default Live preview in Brackets is set to Google Chrome Browser. To change this - Go to Debug - Open Preferences file and - change this line from “livedev.multibrowser”: false to “livedev.multibrowser”: true.
Close the Brackets App and open it again.
Clicking on “Live Preview” should now start in your default browser (like Safari or any other browser).