Change header on different sections

I have made a new header element (Appearance - Elements) with this css code:

<h1>
	{{post_title}}
</h1>

<div class="hero-meta">
	{{post_author}} | {{post_date}}
</div>

and Display Rule: Location: Post - All posts

Nothing happens still.

Hi there,

It doesn't look like you have any Posts published ... can you make sure one of them is published then let me know.

Hi David!

I have published one test post but it doesn't appear where I wanted to. It should be found under "Artikkelit" menu.

Now I managed to publish another test post which can be found from the right place. How come the other post didn't end up there?

However the test post now contains a larger header just like I wanted. But it is too low. I wanted it to be higher. Also the main page for all the posts should also contain a high banner. Can I customize each banner as a individual?

OK - so you have Header Element for your Single Posts and that is working :)
To make it taller, edit the Header Element and increase the Top and Bottom Padding.

For your Blog / Artikkelit Page - create a New Header Element give it a title e.g

<h1>Artikkelit</h1>

NOTE: This {{post_title}} does will not work correctly on the Blog.

For the Display Rules choose: Blog

Thank you very much David! I think that solved my problem :)

Can you in this same thread tell me is it possible that each post would appear as images and not as text? For example in my Artikkelit page my test post appear as text but is it possible to change to appear as image?

If you add a Featured Image to your Posts and in Customizer > Layout > Blog --> Featured Images make sure Display Featured Images is checked

https://docs.generatepress.com/article/adjusting-the-featured-images/