In case you want to have the galleries in a post in a masonry format, you may find an instruction here:

Candidexmedia's instructions

... just add the following CSS rule via the Custom CSS tool:

.gallery__item {
   flex-grow: 0 !important;
}

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:

"postConfig": [
    { 
    "name": "featuredImageWidth", 
    "label": "Featured Image Width", 
    "value": "post__image--wide", 
    "type": "select", 
    "options": [ 
    { 
    "label": "No Image", "value": "post__image--none" }, 
    { 
    "label": "Normal", "value": "post__image--normal" }, 
    { 
    "label": "Wide", "value": "post__image--wide" }, 
    { 
    "label": "Full", "value": "post__image--full" } ] },

The essential part is { “label”: “No Image”, “value”: “post__image–none” }.

Next, you need to add custom CSS in the Publii app (Tools & Plugins > Custom CSS):

.post__image--none { display: none; }

Once you’re in the post editor, you’ll see an option for the Featured image to display “None” images

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:

"postTemplates": {
  "portfolio": "portfolio filter"
},

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:

{{#each @website.contentStructure.tags}}

Then, add the following code:

{{#checkIf this.name '==' 'TAGNAME'}}
    {{/each}}
    {{#if this.postsNumber}}
    {{#each this.posts}}

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:

{{#is "index,tag,tags,author,post,post-mallorca"}}
	<script defer src="{{js "isotope.pkgd.min.js"}}"></script> 

Put the footer.hbs in the override folder in a sub folder partials.

If you don't want the posts in this collection to appear on the homepage, mark them in Publii as "Exclude from homepage."

Damit im Menü die links, die nach außerhalb der site führen, mit einem Symbol versehen werden, habe ich den folgenden Code (CSS) in Publii unter Additional CSS eingefügt:

.external-link {
  display: flex;
  align-items: center; /* Zentriert die Items vertikal, falls nötig */
}

.external-link a {
  flex: 0 1 auto; /* Erlaubt dem Link, zu schrumpfen und zu wachsen */
}

.external-link:after {
  content: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1' stroke-linecap='round' stroke-linejoin='round' %3e%3cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'%3e%3c/path%3e%3cpolyline points='15 3 21 3 21 9'%3e%3c/polyline%3e%3cline x1='10' y1='14' x2='21' y2='3'%3e%3c/line%3e%3c/svg%3e");
flex: 0 0 auto;
      /* Adjust scale as necessary */
  transform: scale(0.6);
margin-left: 4px;
}

Da das mobile Menu anders gebaut ist, bekommt es ein eigenes CSS: 

@media (max-width: 600px) {
    .mobile-menu li a {padding-right: 0px;}
  .external-link:after {
    margin-left: 4px; /* Reduziert den Abstand in der Mobile-Ansicht */
    transform: scale(0.5); /* Macht das SVG kleiner auf Mobilgeräten */
  }
}