Adding a gallery block within kirbyText

The CMS Questions
1

I don’t use Kirby Blocks at the moment in my blog posts, I was thinking about it but I kinda prefer just being able to write markdown, it’s fast and simple instead of creating many blocks per post.

The one thing I do like is the gallery block, I use it for a few posts by simply adding a gallery to my template and then inserting it at the bottom of the blog post outwith the kirbytext content. Works fine but I would like the option to insert that gallery wherever I like in the post.

Is there any way I can have the gallery block in my template as I have now but then add that gallery within my markdown text wherever I want, probably as a kirbyTag?

2

Yes, you can do this either via a KirbyTag or via a string template {{gallery_from_block}} which you would then replace.

3

Thanks, will look into that.

4

I am trying to think this through in my head first before I try anything, a KirbyTag seems the most logical step but I have a couple of issues.

See my template below for clarity.

Screenshot 2022-03-20 at 20.44.29
Screenshot 2022-03-20 at 20.44.29858×916 304 KB

As mentioned the gallery block is there and I can easily add that to the page. What I want to do is add that gallery anywhere in the text block so that the gallery appears anywhere I chose in the post rather than at the bottom.

Is a KirbyTag the most sensible way to approach this? Assuming it is. How in the tag do I link that specific gallery on the page so that the tag knows what it needs to put in there? That is the bit I am scratching my head over.

5

You could fetch the block via its id, but to see the block id, you would need a custom preview. You could just reference the block by number (1, 2, 3) if you have multiple gallery blocks and then fetch the block using nth(x).

1 Like
6

Thanks, @texnixe but I am going to have to admit my lack of knowledge is going to stop me on this. Taken up coding far too late in life :). Although I really like what I have achieved so far which is miles better than my old WP site.

To be able to do these things I would have to learn a lot more about PHP before I can really help myself with Kirby. I think my best solution at this point is to pay someone to do this for me.

7

Can there be multiple galleries in a page or only one?

There is never a too late to learn :upside_down_face:

8

Just one. It would be for specific blog posts relating to property for sale. For everything else I can add images as needed with the textarea.

9

Then all you need is to fetch the first block in your kirbytag. Can post example code tonight, if you can’t figure it out yourself.

10

I would really appreciate an example @texnixe, but only if you have time. I don’t want to put you out. Keen to learn how to do these things.

11

I’m looking at the screenshot you uploaded, that doesn’t look like a gallery “block”, but simply a files field. Could you post the page blueprint file?

12

Yes, I am being careless with terminology. I am currently using a files field. Which if I could insert that into the text area then that would be fine. It was only when I looked at the blocks and saw a gallery block that using it may have been the better option.

13

perfect.
In your case I’d suggest against a KirbyTag. Kirby tags are meant to be valid everywhere, while your gallery can only function inside of your page with a gallery, e.g. what happens when your editor uses a gallery tag in a page that doesn’t use galleries?

I’d suggest to create a special word, like {{gallery}}, that you then go and replace with the appropriate HTML, but only when you actually expect to show a gallery.

Put your gallery code in a snippet:

site/snippets/gallery.php

  <ul>
    <?php foreach ($images ?? [] as $image): ?>
      <li>
        <img <?= attr([
          'src' => $image->url(),
          'alt' => $image->alt(),
          'width' => $image->width(),
          'height' => $image->height(),
        ]) ?>>
      </li>
    <?php endforeach ?>
  </ul>

in your page template, first create the HTML for your gallery:

site/templates/pagewithgallery.php

<?php 

// generate the HTML code for the gallery
$gallery = snippet('gallery', ['images' => $page->galleryfield()->toFiles()], true);

// generate the HTML code for the text content
$content = $page->text()->kirbyText();

// replace {{gallery}} with the gallery html and echo result
echo str_replace('{{gallery}}', $gallery, $content);

?>
1 Like
14

I’m not 100% d’accord. It’s not very different from using an image tag even when there are no images. If you pass some parameters to your kirbytag, you could even include galleries from other pages if you wanted to or pass a field name as attribute. But yes, a string replacement would be fine for this particular use case.

2 Likes
15

@SCC Is the solution fine for you?

16

Apologies kept getting distracted by my day job! And I wanted to type in the suggested approach manually rather than copy-paste so I understood what was happening.

But yes, works perfectly, an example, but still working on the format.

Screenshot 2022-03-21 at 19.04.02
Screenshot 2022-03-21 at 19.04.02986×701 105 KB

But as you can see I can put the gallery of images anywhere I like in the text which is perfect.

This has also given me a fantastic head start in thinking of a couple of other things I would like to do.

@rasteiner - Thank you very much, really appreciate your time. And as always @texnixe for never giving up on me :slight_smile:

2 Likes
17

No worries, couldn’t answer sooner due to my day job :woman_shrugging:

1 Like