Tabs organization blueprint questions!

Kirby 3 Questions 🤔
1

Hey everyone!

So here’s what I’m trying to build. I’m re-building my 10+ year old blog in Kirby. The main content folder is “FEATURES”. With that main folder are subfolders made up of categories of “Features”.

So, what I’m trying to do is build a main features blueprint page that shows tabs for each category of features that will then show a list of features within that tab. I will then + or edit the featured posts from there.

Here’s what I’m looking to accomplish :

feature_tabs
feature_tabs2920Ă—768 51 KB

I cannot wrap my head around this for anything. For some reason, blueprints and the panel are becoming super confusing and I’m struggling, especially after over a decade using WP. Hope you guys can help!

Scott

2

Are you looking for a function to automatically read and list the subfolders?
If there are only 4 categories, the following blueprint can help you in a hurry.

Please note: You have to enter the exact names of your categories, otherwise you will get an error message.

title: Features
icon: page
tabs:
  tab_fooddrink:
    label: Food & Drink
    icon: angle-right
    sections:
      childpages1:
        label: '{{ page("fooddrink").index.count }} Subpages "Food & Drink"'
        parent: kirby.page("fooddrink")
        type: pages
        status: published
        image:
          cover: true
  tab_people:
    label: People
    icon: angle-right
    sections:
      childpages2:
        label: '{{ page("people").index.count }} Subpages "People"'
        parent: kirby.page("people")
        type: pages
        status: published
        image:
          cover: true
  tab_places:
    label: Places
    icon: angle-right
    sections:
      childpages3:
        label: '{{ page("places").index.count }} Subpages "Places"'
        parent: kirby.page("places")
        type: pages
        status: published
        image:
          cover: true
  tab_photogallery:
    label: Photo Gallery
    icon: angle-right
    sections:
      childpages4:
        label: '{{ page("photogallery").index.count }} Subpages "Photo Gallery"'
        parent: kirby.page("photogallery")
        type: pages
        status: published
        image:
          cover: true
3

If this needs to be dynamic, you could achieve it with a programmatic blueprint, similar to the approaches described here:

You’d get the parent page and then loop through the children, creating a new tab with a section for each child.

/site/plugins/programmable-blueprints/index.php

<?php

use Kirby\Cms\App as Kirby;

Kirby::plugin('cookbook/programmable-blueprints', [
	'blueprints' => [
		'pages/features' => function ($kirby) {
			return include __DIR__ . '/blueprints/pages/features.php';
		},
	]
]);

/site/plugins/programmable-blueprints/blueprints/pages/features.php

<?php

$tabs = [];

if ($page = page('features')) {
	// create a new section array for each unique tag plucked from the children pages
	foreach ($page->children() as $page) {
		$tabs['tab_' . $page->slug()] = [
			'label'  => $page->title(),
			'sections' => [
				$page->slug() => [
					'label' => $page->title(),
					'template' => 'post', // template you use for the posts in the categories
					'type' => 'pages',
					'status' => 'all',
				]

			]
		];
	}
}

// create the array for the page blueprint with the tabs
$yaml = [
	'title'   => 'Features',
         // set options for categories as required
	'options' => [
		'changeStatus' => false,
		'changeSlug'   => false
	],
	'tabs' => $tabs
];

return $yaml;