Covers for blog posts

Hello everyone. I’m currently building my first kirby page, it’s a blog based on the baseblog theme, with templates for article.text.php, article.video.php etc.
I would like to have a cover image for each blog article, they will not show in the blog feed, only on the article page, by grabbing ‘header.jpg’ from the folder (assuming that each article folder will contain one)

I tried making a model for models/article.text.php
<?php class ArticlePage extends Page { public function cover() { return $this->files()->findBy('name', 'header'); }}

And calling it in the template templates/article.text.php
<header class="article-header container-fluid" role="banner"> <img src="<?php echo $page->cover()->url() ?>" /> </header>

Needless to say, that’s not working, on inspecting the element I get
img src="http://localhost:8888"
where I would like my cover to be

Not an expert in PHP, so any tips will be very much appreciated

1 Like

Your class naming is incorrect, should be

<?php
class ArticleTextPage extends Page {
public function cover() {
return $this->files()->findBy('name', 'header');
}}
1 Like

Also you are looking for an image specifically:

<?php
class ArticleTextPage extends Page {
  public function cover() {
    return $this->image('header.jpg');
  }
}
1 Like

One more thing: You should also check if the image exists to prevent errors if not:

<header class="article-header container-fluid" role="banner">
<img src="<?php e($cover = $page->cover(), $cover->url() ) ?>" />
</header>

Or put the if-statement around the image tag, if you don’t want to display an image if the header image is missing.

Edit: If your image always has the same extension, I would also prefer @lukasbestle’s variant. If your header image can have other extensions, you should use your original code or just check within images $page->images()->findBy('name', 'header').

Thank you both, that was extremely helpful!