New User - little (a lot confused)

overcat · April 30, 2020, 4:01pm

Hi, i am normally pretty versed with php and html, normally working with wp / processwire/ drupal, now i want to set up a simple page with kirby.
I have bought the license, installed a page, and now pretty stuck.
I understand that the kirby is very powerful in itself,
and the preinstalled gallery version is exhausting, also the documentation seems fine,
but i can’t seem to find the simple stuff. Therefore my question, please, enlighten me:

1 - i need to define a template.php AND a blueprint.yml for ONE kind of pages (like projects) to be able to add new pages in the panel.
So like project.php and project.yml

Is this right?

2 - In these pages - I need a special image field (which will be repeated through these pages, lets say ONE image per page) - like “headerimage”
Where do i define this?
Do i have to make a new headerimage.yml blueprint and headerimg.php template for this?

i do not know if i am to use the image, or do i have to use the file method, where can i define this?

3 - text - How do i define multiple simple text fields for the panel and use it in the template.php for this kind of pages? Let’s say i want to have 3 column block with an icon and a text field in every column, which will be filled in every page of this kind.

If i have the 3 - i understand this will be a ?field? do i get to use it in other template too?

Perhaps my questions are stupid, but somehow i feel the documentation covers complicated issues, while abandoning the basics. For somebody green to this kind of work it is sadly maddening^

Thanks a lot for any help, as i really need it.
Best

texnixe · April 30, 2020, 4:08pm

I will try to answer you detailed questions later, but this recipe should give you a greater picture of how Kirby works, how blueprints, templates etc. play together.

Basically, a page type has a part for the form fields in the Panel (the blueprint), the text file that stores the content and the php template to display that content in the frontend.

Welcome to our community!

overcat · April 30, 2020, 4:33pm

Thanks a lot! I’Ve already been reading that.
I managed to create a block with 3 columns and 3 text files there:

My structure.yml blueprint:

    title: Structure
    status:
      draft: true
      unlisted:
        label: Hidden Page
        text: The page is not listed in the main menu
      listed:
        label: Menu Page
        text: The page is listed in the main menu
    columns:
      - width: 2/2
        fields:
          Cover:
            label: Cover
            type: files
            template: cover
            info: "{{ file.dimensions }}"
            max: 1
            size: small
          headimg:
            label: Headimg
            type: files
            template: image
            info: "{{ file.dimensions }}"
            max: 1
            size: small
      - width: 2/2
        fields:
          text:
            label: Text
            type: textarea
            size: large
      - width: 1/3
        fields:
          erste3er_1:
            label: erste3er_1
            type: textarea
            size: small
      - width: 1/3
        fields:
          erste3er_2:
            label: erste3er_2
            type: textarea
            size: small
      - width: 1/3
        fields:
          erste3er_3:
            label: erste3er_3
            type: textarea
            size: small

And i can get the text fields (the last 3) with my structure.php template like this:

      <div class="container">
        <div class="row">
          <div class="column"><?= $page->erste3er_1() ?></div>
          <div class="column"><?= $page->erste3er_2() ?></div>
          <div class="column"><?= $page->erste3er_3() ?></div>
        </div>
      </div><!-- container -->

I just can’t seem to wrap my head around the image stuff. It will probably be very easy and basic, and ill laugh about it later, but please help me understand here. So what if i would need to define 2 different images in my page template?

Let’s say i need a cover img (with a text field) and a headerimg.
I tried to define them both in my yml,
but i can’t call them.
The only way i get an image here is
WORKS, gets one image:

<?php //image ?>
  <div class="image">
    <?php if($image = $page->image()): ?>

    <?php endif ?>
  </div>

NOTHING:

  <?php //cover ?>
  <div class="cover">
    <?php if($cover = $page->files()->findBy('template', 'cover')): ?>

    <?php endif ?>
  </div>

NOTHING:

<?php //headimage ?>
  <div class="headimg">
    <?php if($headimg = $page->files()->findBy('template', 'headimg')): ?>
 
    <?php endif ?>
  </div>

I haven’t defined a special template for headerimg or coverimg yet, how to i do this? Do i need to?
Thanks!

texnixe · April 30, 2020, 5:00pm

Since these are textarea fields and you are probably going to use markdown or Kirbytags, you might want to call the kirbytext() method here:

 <div class="column"><?= $page->erste3er_1()->kirbytext() ?></div>

Let’s start with your cover field. This is a files field that can store one or multiple images. To get a single image (max: 1) from such a field:

if ( $image = $page->cover()->toFile() ) {
  echo $image->url();
}

So with toFile() we convert the value that is stored in the content file into a file object and can then call all file methods on that object.

Similarly, we can use toFiles() instead of toFile() when multiple files are stored in such a field.

If you just call $page->image() this will get the first file that exists in the folder, but not what you store in your field.

Fetching files by template makes sense if they are not stored in a field but just uploaded via a files section. A files section doesn’t store the id of the file in your content.

It is important to understand this difference between fields and sections, since that is something that is confusing for people new to Kirby.

On a side note: for repeating stuff like your 3 textarea fields, it might make sense to use a structure field with a max of 3 items. This is particularly useful if you want to let the user select an icon for each if the fields.

overcat · April 30, 2020, 5:36pm

hmmm thanks a lot - great new ideas.
But please help me with the cover field.
So i have a blueprints/files/cover.yml

with:

title: cover
accept: image/png
fields:
description:
label: Description
type: text
alt:
label: Alt Text
type: text

I am calling this in my page’s yml - blueprints/pages/structure.yml like this:

  cover:
    type: files
    template: cover 
    max: 1

Somehow, i can set the image in the panel, but the template is " - ". So my cover.yml is not being read?

texnixe · April 30, 2020, 5:50pm

How did you upload the file? Via the cover field’s upload action?

To set a template to a file uploaded via this field, the field has to be defined like this:

cover:
  type: files
  max: 1
  uploads: cover

overcat · April 30, 2020, 6:08pm

hi! nope, there has to be a problem with me calling the template cover.yml
i am very thankful for your time. I hope i can understand this and proceed with the work

Page blueprint structure.yml

title: Structure
status:
  draft: true
  unlisted:
    label: Hidden Page
    text: The page is not listed in the main menu
  listed:
    label: Menu Page
    text: The page is listed in the main menu
columns:
  - width: 1/2
    fields:
      cover:
        type: files
        template: cover
        uploads: cover
  - width: 1/2
    fields:
      headimg:
        type: files
        template: headimg
        max: 1
        uploads: headimg

I can upload the img, but when editing the file (yes i have uploaded through panel), the template is not being read. Not even the default.

texnixe · April 30, 2020, 6:15pm

Keep in mind that the file blueprint is only assigned at upload, not for already uploaded files.

overcat · April 30, 2020, 6:50pm

Oh now you’ve killed me!
This was it
Yeah, i was so used to the database functions that i totally forgot

I think i’ve got it now. You should add this little piece of information for the people with extra long cable such as myself

Thanks also for the other tips, ill be reading on it. I think i have now a greater understanding of how stuff works.
Any good reads on extending the (home)page with repeatable sections or other pages?
Also, how do i create nested menu’s?

Thank you very much, you showed me that kirby’s community is really worthwhile!

texnixe · April 30, 2020, 6:56pm

No worries!

The One-pager cookbook could be helpful for this: One-pager site | Kirby CMS

Basically, there are two approaches to creating sections:

using subpages like explained in the recipe
using the Builder plugin which allows you to create pre-defined building blocks

Any of these approaches can also be combined with the Editor: https://getkirby.com/plugins/getkirby/editor

overcat · April 30, 2020, 6:59pm

.)

One more question:
where would i be using the upper definition?

texnixe · April 30, 2020, 7:02pm

That is a bit out of context…

You can use that in a template if you want to check if there is a file that has the cover blueprint/template assigned. But note that you would not necessarily fetch the file that you selected via the files field.

Say, you have uploaded multiple files via your files field, but you only select one (because of max: 1). Still, there would be several of these files.

With your assignment, you would fetch the first image with that template that lives in the folder.

overcat · April 30, 2020, 7:04pm

Ah so nothing to worry about right now

thx a lot & have a nice evening/day/whenever you are!

texnixe · April 30, 2020, 7:05pm

Thank you, you too, it’s evening where I live (Germany).

overcat · April 30, 2020, 7:13pm

Dann alles Liebe aus Wien

Topic		Replies	Views
BASICS: Understanding Blueprints Solved ✅	5	3554	May 15, 2015
Looking for help with Project Workflow, 1st Time Kirby user Questions 🤔	2	780	November 13, 2017
Blueprint source question Solved ✅	8	538	March 20, 2018
Blueprints vs Templates? Solved ✅	2	2992	March 28, 2015
How to assign blueprints to pages Solved ✅	30	1708	June 17, 2019

New User - little (a lot confused)

Related topics