Define first image for social media content cards

Plugins Plugin Questions
1

Hi,
I have been asked by a friend for help to solve a problem on their website that has been designed by someone, whom they cannot contact anymore. that’s why I am here hoping to find a solution for their question.

Right to the question: The website has a SEO plugin that works fine. They can add descriptions to each entry and that would appear right under the page title in google results. Each entry has a thumbnail image that appears right next to the entry’s title on the home page, where all the entries are listed. I want to make sure, that these thumbnails would also show up when I the respected entry is shared on social media. There is a snippet that handles the mentioned list that contains this code to fetch the thumbnails:

<?php if ($img = $item->thumbnail()->toFile()): ?>
                <a href="<?php echo $item->url() ?>">
                    <picture class="">
                        <img src="<?php echo $img->thumb($thumbSettings)->url() ?>" class="object-contain block" />
                    </picture>
                </a>
                <?php endif ?>

How can I use this code as a clue to make sure the thumbnails will be fetched while sharing links to each entry on social media?

Please let me know where I can find the information you need in order to help me out on this. I am not very familiar with php or Kirby, though I have watched the tutorials online to get an idea of how it works and differentiates from other cms.

Thanks a lot in advance!

2

What you are looking for is Open Graph images, I guess? The OG image would be defined in the head of the single entry page.

3

Thank you for your reply!
I looked into it and subsequently into the metatags.php of seostarter and found the following:

<meta itemprop="image" content="<?php echo $socialThumb ?>">

and socialThumb is defined as such:

    if($img = $page->socialThumb()->toFile()) {
        $socialThumb = $img->url();
    } elseif($img = $site->socialThumb()->toFile()) {
        $socialThumb = $img->url();
    } else {
        $socialThumb = '';
    }

It seems that the plugin fetches the same image for all of the links, regardless of the hierarchy. Am I correct? if so, is it possible to change the code so, that the plugin fetches the thumbnail of each entry (in the case of this website the template is called work.php) for the content card? How would one address that in the code?

I am sorry if the questions are too naive. I am trying my best to teach myself on the go.

4

I don’t even know what plugin you are referring to.

But $page->socialThumb()->toFile() always refers to the current page, so what makes you think it’s using the same image? This fetches the file stored in the socialThumb field on each page.

1 Like
5

The plugin is called seostarter.
You are right! I misunderstood the if construct.
I will keep looking for answers and will come back if needed. Thank you very much!!

6

Hm, seems to be something custom, at least I cannot find it in our plugin list.

7

Maybe share the the plugin code? does feel custom. Thats not a plugin name i recognise.