I have the same question like this guy:How to add a header image and customize it Have no idea where should I put this code. Any help? [image] I just put it here and looks like I am wrong about it. [image] Or is there any more simple component to add a banner picture to my discourse? Thanks in advance.

Yes, I install and put it in use.

I want to use the versatile banner just to insert the background image but the image only shows a little bit. I need to type words to show more of it but I don’t need words.

It’s very difficult to understand the issue with so little info. Could you share images to show what is going wrong?

Hi @Sherran :wave: if you are just wanting to insert a banner image, the Vesatile banner component may not be ideal. Perhaps try having a look at this topic: [image] How do I add a giant header image? Support [image] or have look at the various banner components in the #theme-component category https://meta.discourse.org/search?q=banner%20%23theme-component%20order%3Alatest_topic

@Moin kindly just reminded me of this: [image] Create a an image banner Support try this in a theme component. in common css: #homepage-banner { width: 100%; height: 300px; } you can adjust the height to however you like. put the following around the image in the versatile banner component where you have your image URL, probably the main heading content field. put image here you can add other CSS code to format it more. you can look at the versatile banner on my site (see profile) and get an idea of what can be done with oth… They clearly have a much better memory than I do :stuck_out_tongue:

I delete all the content in columns and insert a background picture: [image] But the picture is only shown like this: [image] And I want it to be shown in full size. So I tried to put the code in the above given by the support or whoever it is in the theme‘s CSS (I don’t know if this is the right place. Looks like not.) [image] [image] I don’t know how to customize HTML. If I have the banner image URL, how can I make it a banner?

Did you look at the link I posted above? It has the solution for you: [image]

Thanks. I will try. When you say use this CSS, I don’t know where exactly shall I put that thing in {}. Let me see.

Where shall I put this code for a top banner?

Product Support

Moin March 22, 2024, 8:24am 2

Did you also install the Versatile Banner which is mentioned in that topic? The adjustment for that component won’t do anything without the component.

Topic		Replies	Views
Create a an image banner Product Support versatile-banner	2	499	May 27, 2023
Adding a new banner just above the logo Product Support	4	1215	March 7, 2021
Custom banner for discourse channel Product Support	1	1081	January 19, 2021
How to add a simple Banner Product Support	2	3327	January 8, 2021
Using an Image for a Global Banner Topic - Dimensions? Product Support	3	1481	December 7, 2020

Where shall I put this code for a top banner?

Related topics