Hi,
I followed the article creating a blog post Creating a Kirby-powered blog | Kirby CMS but it is not working correctly.
On the article page, it just shows the text without any formatting or the header and footer which it does show on the blog page. There are no error messages, and when you look at the page source view it does not show any of the code for the header, footer and text.
The blog page only shows the blog articles if they are numbered in the content section which I don’t want because it lists them in the navigation.
Blog.php
<?php snippet("meta-blog"); ?>
<?php snippet("header"); ?>
<main class="main-columns-one">
<article class="columns-two flow">
<section>
<h1><?= $page->title()->html() ?></h1>
<?= $page->text()->kirbytext() ?>
<?php foreach($page->children()->listed()->flip() as $article): ?>
<h1><?= $article->title()->html() ?></h1>
<p><?= $article->text()->excerpt(250) ?></p>
<a href="<?= $article->url() ?>">Read more…</a>
<?php endforeach ?>
</section>
</article>
</main>
<?php snippet("footer"); ?>
article.php
<?php snippet('header'); ?>
<main class="main-columns-one">
<section>
<article class="columns-two flow">
<h1><?= $page->title()->html() ?></h1>
<?= $page->text()->kirbytext() ?>
<a href="<?= url('blog') ?>">Back…</a>
</article>
</section>
</main>
<?php snippet("footer"); ?>
They are probably showing in the navigation because of the use of listed()in the for each loop. If you take that out or change it to unlisted() youll get everything or the ones without numbers.
You have used double qoutes there rather than single ones, got a feeling that might be causing it not show up on one page. although it doesnt seem to make a difference when I try that. Maybe you have an error in those snippets?
If i recall correctly, excerpt() strips the html from the feild, which is why there is a hardcoded paragraph tag there. You need to set the strip flag to false $field->excerpt() | Kirby CMS
<?= $article->text()->excerpt(250, false) ?>
No, that’s irrelevant, but you should stick with one way of doing it instead of using different styles, and using single quotes is the standard:
Like here you use single quotes
<?php snippet('header'); ?>
And then for the footer, you use double-quotes:
<?php snippet("footer"); ?>
Wondering what you have in this snippet, which you output even before the header…
And then for the footer, you use double-quotes
I am using double quotes on both for some reason it is just showing single quotes.
Wondering what you have in this snippet, which you output even before the header…
It is just the metadata, stylesheets, and doctype which are used on other pages and outputs ok.
But whats that actual code in that snippet? Please post the full snippet code.
That doesn’t make sense somehow, because since you use the same header, that would then be missing on the article pages…
So please post the header and the meta-blog snippet code here
I also changed the quotes to single ones - no difference.
meta-blog snippet
!doctype html>
<html lang="en-GB">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<?php if ($page->isHomePage()): ?>
<title><?= $site->title() ?> | Helen Chinn | Trauma Recovery | Neurodiversity</title>
<?php else: ?>
<title><?= $page->seoTitle()->or($page->title()) ?> <?= $site->title() ?></title>
<?php endif; ?>
<!-- stylesheet -->
<link rel="stylesheet" href="/content/assets/css/mindful.css">
<link rel="stylesheet" href="/content/assets/css/responsive-nav.css">
<script src="/content/assets/js/responsive-nav.js"></script>
<!-- meta data -->
<meta name="description" content="Helen is a specialist mental health Occupational Therapist with over 25 years experience and an interest in complex trauma recovery and neurodiversity.">
<link rel="copyright" href=https://mindfulsensoryot.co.uk/privacy">
<meta name="author" content="Helen Chinn">
<meta name="robots" content="Index,Follow">
<meta name="apple-mobile-web-app-title" content="Mindful Sensory Occupational Therapy Services">
<meta name="msvalidate.01" content="">
<link rel="search" href="/opensearchdescription.xml" type="application/opensearchdescription+xml" title="Mindful Sensory Occupational Therapy Services">
<link rel="canonical" href="https://mindfulsensoryot.co.uk/about">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
<meta name="application-name" content="Mindful Sensory OT">
<meta name="msapplication-TileColor" content="#2d89ef">
<meta name="theme-color" content="#ffffff">
<link rel="icon" type="image/png" sizes="192x192" href="/android-chrome-192x192.png">
<meta property="article:author" content="Helen Chinn">
<meta name="robots" content="index, follow">
</head>
Header snippet
<body>
<header>
<a class="skip-link" href="#main">Skip to main</a>
<div class="wrapper site-header__wrapper">
<span class="site-name">
<a href="<?= $site->url() ?>"><img src="/content/assets/images/ot-logo.webp" alt="Occupational Therapy logo"></a></span>
<?php
// nested menu
$items = $pages->listed();
// only show the menu if items are available
if($items->isNotEmpty()):
?>
<nav aria-label="Main Navigation">
<nav class="nav-collapse">
<ul class="header-links">
<?php foreach ($items as $item) : ?>
<?php
// get all children for the current menu item
$children = $item->children()->listed();
// display the submenu if children are available
if ($children->isNotEmpty()): ?>
<li class="dropdown">
<!-- aria-expanded needs managed with Javascript -->
<button <?php e($item->isOpen(), 'class="active"') ?> type="button" class="dropdown__title" aria-expanded="false" aria-controls="<?= $item->title()->html() ?>-dropdown">
<?= $item->title()->html() ?>
</button>
<ul class="dropdown__menu" id="="<?= $item->title()->html() ?>-dropdown"">
<?php foreach ($children as $child) : ?>
<li>
<a<?php e($child->isOpen(), ' class="active"') ?> href="<?= $child->url() ?>"><?= $child->title()->html() ?></a>
</li>
<?php endforeach ?>
</ul>
</li>
<?php else : ?>
<li>
<a<?php e($item->isOpen(), 'class="active"') ?> href="<?= $item->url() ?>"><?= $item->title()->html() ?></a>
</li>
<?php endif ?>
<?php endforeach ?>
</ul>
</nav>
<?php endif ?>
</div>
</header>
Ok, so that means that since your article.php template starts with the header snippet, it doesn’t contain a proper html document, because the meta-blog.php snippet withthe doctype, etc is missing.
They both start the same. It is missing on the actual page (blog/article) but it is there in the article.php file
<?php snippet('meta-blog'); ?>
<?php snippet('header'); ?>
Fixed it. The default.php page was not up to date from when I first started building the site.
Aha, so you showed us the article.php template, while the page you were talking about was actually using the default.php template. Then why show the article template, if it is unrelated?
On a side note, if you quote what other people wrote, please use the quote markup button from the toolbar
, so it’s clear you are quoting someone. Thank you.
No, I was using the article.php template. But I looked at the default.php page some of the snippets were not there which are on every page.
This is still not working correctly as I thought it was. In the article.php file, the CSS class names are not showing in the page source code. It just has the paragraph text without and h1 headings or class names. On the blog.php when you look at the page source code it shows all the css.
Please be more specific, I don’t understand the problem. What class names are missing? Where are they supposed to be, and where are they supposed to be coming from.
In the article.php file, I have this code:
<main>
<section>
<article class="article-column flow">
<h1 class="article-head"><?= $page->title()->html() ?></h1>
<?= $page->text()->kirbytext() ?>
<a href="<?= url('blog') ?>"><span class="article-more">Back</span></a>
</article>
</section>
</main>
And when you look at the page source code you just have the text without anything else. So
<main>, <section>,
<article class="article-column flow"><h1 class="article-head">
<a href="<?= url('blog') ?>"><span class="article-more">Back</span></a>
do not show at all in the page source.
Then your article doesn’t use this template, I guess.
Not sure what you mean?
The text from the blog.php page is there. It’s not showing the elements to format the text, that’s the issue.
I think it might be best to zip up the ‘site’ and ‘content’ folders and send them in a DM to me, might be quicker to help you resolve it.
Ok so looking at the code you sent over to me, here are the issues i found.
You have a syntax issue on line 37 of header.php:
<ul class="dropdown__menu" id="="<?= $item->title()->html() ?>-dropdown"">
Should be
<ul class="dropdown__menu" id="<?= $item->title()->html() ?>-dropdown">
In header.php and header_nav.php you have several occurences of a malformed anchor tag:
<a<?php e($child->isOpen(), ' class="active"') ?> href="<?= $child->url() ?>"><?= $child->title()->html() ?></a>
You need a space right before the php statement
<a <?php e($child->isOpen(), ' class="active"') ?> href="<?= $child->url() ?>"><?= $child->title()->html() ?></a>
Lastly, your blog pages have the wrong file name which means they are using the default template. Either rename the text files to article.txt or change the templates file name to blog_article.php.
On a side note, the assets folder should not be in your content folder. The best place for this is a level above, at the same level the content folder is.
