Image that I'm using in a bar on the frontpage shows up unexpectedly on a linked page. Why is that?

[robbertdam]

I have defined this bar on my frontpage (inspired by the one from the ComboStrap homepage ;) )

<bar hero="lg"  >
    <background opacity="0.4">{{ :bar_background.svg |}}</background>
    <grid>
    
    <box spacing="ps-lg-5" width=75%>
        <box>

<heading d4 spacing="mb-3">**Disciples of Jesus**, let's **Collect** all things that are  **Honorable** and **Pure**, everything **Commendable**, **Lovely** and **Right** *.</heading>

<text h3 boldness="light">Welcome to The Last Reformation Wiki! A place to find everything around the movement, to get inspired and to inspire others.</text>
<text lead width="500">* Based on Philipians 4:8</text>

         </box>
     </box>
            
     </grid>
</bar>

But when I now navigate to a sub page in my Wiki, the image bar_background.svg appears, but I don't understand why.

• Example page where the image appears unexpectedly
• Homepage with the bar

Any idea why this is happening?

[gerardnico]

This is a standard functionality from the page image that shows you the first image that it found (ie the ancestor)
https://combostrap.com/content/page-image-component/renders-the-illustrative-image-of-your-page-jq488r8a

It comes from the default page header slot:
https://combostrap.com/layout-elements/page-header-layout-element-cohybej1

[robbertdam]

Thank you for this. I'm trying to understand how the framework works. One things I wasn't able to figure out is how the default template is determined for a page.

• For my main page 'hamburger' is selected as default (https://wiki.thelastreformation.com/)
• For a sub page 'index' is selected as default (https://wiki.thelastreformation.com/doku.php?id=artwork%3Aartwork)
• For another sub page 'holy' is selected as default (https://wiki.thelastreformation.com/doku.php?id=guide%3Aget_started)

..but I don't understand how this selection process work. Can I define somewhere these defaults?

[gerardnico]

I have just added it in the doc:
https://combostrap.com/theme/what-is-a-template-z9tl87hg#what_are_the_default_templates

These are just default that takes into account the type of content.
Defaults cannot be changed.

You can customize them / create your own:
https://combostrap.com/howto/how-to-create-your-own-theme-m092ki81

[robbertdam]

Thanks for this. I'm trying to find the easiest way to remove this image from all my pages and to have that as the default. I prefer not to have an image on my pages, unless I explicitly define it.

Approach 1 - change the template

I think the easiest way would be to override the existing templates and change them. Although it's not the nicest solution, because when I update ComboStrap it would override those changes.
I've tried this approach, but I get stuck in the main-header-partial.hbs template file. It refers to a 'main-header-html' element, but I cannot find anywhere the implemenation of this:

Approach 2 - get Combostrap to pick another ancestor image

Another thing I thought about it to override the ancestor image and put a blank/empty SVG file on the frontpage so that we be picked as the ancestor image. I've tried that, but can't get this to work.

• how do I reset the ancestor image for existing pages? It seems to be cached somewhere?
• how can I make the system choose a blank image as ancestor image.

Maybe there is a more elegant solution to this problem that I've overlooked?
Thank you very much

[gerardnico]

For the point 1, the customized themes are not overwritten because they are in the data directory.
See https://combostrap.com/howto/how-to-create-your-own-theme-m092ki81#creation_of_your_theme_directory

For the point 2, the page image of the home page is the ancestor image of all pages by default.
You can set it via the metadata. As of today, there is no gui, you need to copy/paste the path of the image.
https://combostrap.com/page/image-wjr37pe9#set

[gerardnico]

Note that the easiest way is to customize the main header by creating a main header slot.
https://combostrap.com/slot/main-header-slot-l49u26nj

[robbertdam]

Note that the easiest way is to customize the main header by creating a main header slot. https://combostrap.com/slot/main-header-slot-l49u26nj

Perfect, this is what I was looking for. Thanks! I've simply created a header slot and removed the image from the predefined page and saved.