Title customization with Pedro Borges meta tags plugin

Hi friends,

Disclaimer: I know very little PHP :slight_smile:

I’m using Pedro Borges’ meta tags plugin. This is what I have in /site/config/config.php:

<?php

return [
    'debug' => true,
    'smartypants' => true,
    'markdown' => [
        'extra' => true
        ],
    'pedroborges.meta-tags.default' => function ($page, $site) {
        return [
            'title' => $page->isHomePage() ? site()->title() : $page->title(),
            'meta' => [
                'description' => $site->description()
            ],
            'link' => [
                'canonical' => $page->url()
            ],
            'og' => [
                'title' => $page->isHomePage()
                    ? $site->title()
                    : $page->title(),
                'type' => 'website',
                'site_name' => $site->title(),
                'url' => $page->url()
            ],
            'twitter' => [
			    'card' => 'summary_large_image',
			    'site' => $site->twitter(),
			    'title' => $page->title()
		]
        ];
    }
];

Currently this returns “Cameron Moll” as the for every page on my site. I would like the homepage to have the title “Cameron Moll” and then every other page to be “[page title] – Cameron Moll”.

How can I configure this?

P.S. please tell me if anything else looks amiss!

Hm, what you posted above should actually work, with only the little addition that you add the site title after the page title:

'title' => $page->isHomePage()
    ? $site->title()
    : $page->title() . ' - ' . $site->title(),
1 Like

Beautiful. Thank you!

@texnixe – how can I add a description to the OG and Twitter cards in the code at the top of this post?

When I add 'description' => $site->description() to either card it breaks my site.

What exactly did you add where and what is the error message. Could you please post the code that breaks the page?

Of course, now I can’t replicate it breaking :slight_smile:

In /site/config/config.php here’s the code I’ve added for description:

return [
    'debug' => true,
    'smartypants' => true,
    'markdown' => [
        'extra' => true
        ],
    'pedroborges.meta-tags.default' => function ($page, $site) {
        return [
            'title' => $page->isHomePage()
				? $site->title()
				: $page->title() . ' - ' . $site->title(),
            'meta' => [
                'description' => $site->description()
            ],
            'link' => [
                'canonical' => $page->url()
            ],
            'og' => [
				'title' => $page->isHomePage()
					? $site->title()
					: $page->title() . ' - ' . $site->title(),
				'description' => $site->description(),
                'type' => 'website',
                'site_name' => $site->title(),
                'url' => $page->url()
            ],
            'twitter' => [
			    'card' => 'summary_large_image',
			    'site' => $site->twitter(),
				'title' => $page->isHomePage()
					? $site->title()
					: $page->title() . ' - ' . $site->title(),
				'description' => $site->description()
		]
        ];
    }
];

However no description is returned in the HTML:

<meta property="og:title" content="A Beginner&rsquo;s Guide to Mental Health &amp; Mental Illness - Cameron Moll">
<meta property="og:type" content="website">
<meta property="og:site_name" content="Cameron Moll">
<meta property="og:url" content="http://cm.test/journal/beginners-guide-to-mental-health">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="A Beginner&rsquo;s Guide to Mental Health &amp; Mental Illness - Cameron Moll">
<link rel="canonical" href="http://cm.test/journal/beginners-guide-to-mental-health">
<meta name="twitter:image" content="http://cm.test/media/pages/journal/beginners-guide-to-mental-health/2463091230-1583186949/cameronmoll.jpg" />
<meta property="og:image" content="http://cm.test/media/pages/journal/beginners-guide-to-mental-health/2463091230-

In the plugin /site/plugins/feed/index.php I see this default code:

 // set all default values
            $defaults = [
                'url'         => page()->url(),
                'title'       => 'Feed',
                'description' => '',
                'link'        => url(),
                'datefield'   => 'date',
                'imgfield'    => 'coverimage',
                'subfield'    => 'subtitle',
                'textfield'   => 'text',
                'modified'    => time(),
                'excerpt'     => true,
                'generator'   => kirby()->option('feed.generator', 'Kirby'),
                'header'      => true,
                'snippet'     => false,
            ];

Notice the description value is blank. Does this have anything to do with it?

Does $site->description() have any content? Looks like this is only rendered if not empty.

Good point. With each blog post I include an intro (summary). This is called in the panel:

intro:
    type: editor
    size: large

And then on the blog home page it’s rendered with desc:

<?php snippet('notes', ['notes' => $page->children()->listed()->sortBy('date', 'desc')]) ?>

I’d prefer desc be the description included in the OG and Twitter cards. (It’s more of a page description than site description.)

Then you probably want to use the intro field for pages and the site descriptions on the homepage. Where is desc defined as a field, to me that looks more like youre are sorting in descending order (desc):

'description' => $page->isHomePage()
  ? $site->description() //if that field exists, otherwise replace with the field name that you use in the `site.yml` blueprint for the site's description.
  : $page->intro(),

Fantastic. Except it renders a lot of extra entities:

<meta property="og:description" content="[
    {
        &quot;attrs&quot;: [],
        &quot;content&quot;: &quot;Mental health and mental illness are tough subjects to talk about. This five-part series aims to ignite greater awareness of mental health issues at home and in the workplace, encourage more candid conversation on the topic, reduce the stigma associated with mental illness, and improve mental performance at home and in the workplace. Written for everyday people by everyday people.&quot;,
        &quot;id&quot;: &quot;_dorbiblbf&quot;,
        &quot;type&quot;: &quot;paragraph&quot;
    }
]">

Ah, ok, that comes from the editor, because it stored the content in json, so you have to transform that properly.

$page->intro()->blocks()

Almost there! Still a few extra entities such as &lt;p&gt;

<meta property="og:description" content="&lt;p&gt;Mental health and mental illness are tough subjects to talk about. This five-part series aims to ignite greater awareness of mental health issues at home and in the workplace, encourage more candid conversation on the topic, reduce the stigma associated with mental illness, and improve mental performance at home and in the workplace. Written for everyday people by everyday people.&lt;/p&gt;
">

I don’t see anything in the editor that would be adding these entities:

Because the block in this case is rendered as a paragraph. I’m not too familiar withe the block methods, because I haven’t used it that often, but I guess there is a way to output just the raw text.

It probably makes sense to only get the first block anyway.

$page->intro()->blocks()->first()->content()

Excellent. Thanks for all your help!