Customise the sidebar on Kirby 4

Kirby 4 Solved ✔️
1

Hey folks,

In this video, at around 01hr 07mins and 30secs, Bastian demos how to customise the sidebar. I’d love to do this on my site, but I can’t seem to find the documentation anywhere, or a demo in GitHub. Does it exist anywhere so I can reference it please?

Thanks,

Kev

2
1 Like
3

One detail that I don’t see covered on that page and that Bastian also mentioned was adding a button to say open a new create dialog along with custom fields defined in a blueprint. The following works but I haven’t figured out how to include custom fields.

'create' => [
      'label' => 'New Post',
      'dialog' => 'pages/create?parent=/pages/blog&view=site&section=pages',
      'icon' => 'add'
],

I thought maybe adding &customFields=true to the params might work but no dice. I’m probably missing something obvious.

4

Thanks both, this is just what I needed. Bastian was referring to it as “the side bar” in the video, so that’s what I was searching for.

5

The additional fields should be defined in the blueprint for the page type to create via the create property, see Page blueprint | Kirby CMS

1 Like
6

Hmm, so I shouldn’t need to do anything additional to get the customized version of the create dialog to appear from that menu code is what I understand you’re saying. I’ve done that and added the custom fields in the blueprint. It works as expected from elsewhere the panel but not when I open a create dialog using the example I shared so I was wondering if I did something wrong.

7

Ok, let me look into this…

8

[quote=“scottboms, post:3, topic:30286”]

Ok, from checking the example in the video again, this works for me in the Starterkit

  1. In note blueprint, add
create:
  title:
    label: Article title
  fields:
    - date
    - tags
  redirect: false
  1. In config
'panel' => [
	'menu' => [
		'site',
		'system',
		'users',
		'-',
		'post' => [
			'icon'    => 'add',
			'label'   => 'New note',
			'link' => 'dialogs/pages/create?parent=pages/notes&template=note',
		],
    ],
]

So the important part is to load the correct template/blueprint.

3 Likes
9

Just a quick question: is it still not possible to hide the search icon in the menu?

Menu customization only concerns Site, System, Languages, Users and New Custom item?

10

Not via the panel.menu option, maybe you can overwrite the Menu.vue component (or just hide the search via CSS).

11

Thank you Sonja, that worked! I had one further question but seem to have solved it. In case it’s helpful for anyone else, for a page with multiple template options (e.g. article.text, article.video, article.image), to include the template selector dropdown in the create dialog, this works:

'create' => [
    'label' => 'New Post',
      'link' => 'dialogs/pages/create?parent=pages/blog&view=site&section=blog&template=article.text',
    'icon' => 'add'
],
12

This is quite cool, but when you copy/paste this piece of code to your config.php, the menu items in the bottom of the panel’s menu disappear. What are the values to get the “personal profile”, “edits” and “logout” buttons back?

[edit]
Never mind. Fixed! :hammer:
[/edit]