Using KirbyComments by Jonas Marx

[hendrik]

Hi everyone, I’m trying to add this comment plugin: Jonas Marx / KirbyComments · GitLab

I added the folder as described. Now I would like to insert the form into the corresponding php file. For me this should be this:

<?php snippet('head'); ?>

<main id="main" class="main">
  <?php snippet('breadcrumbs');
    snippet('page-header'); ?>

<div class="content clearfix">
  <?php 
    snippet('toc', $page->pagebuilder()->headlinesFromBuilderBlocks());

    // Builder Blocks
    $blocks = $page->pagebuilder()->toBuilderBlocks();
    foreach($blocks as $block):
      snippet('blocks/' . $block->_key(), ['data' => $block]);
    endforeach; 

    snippet('tooltip');
    snippet('share');
    snippet('author');

    // See controller for $section
    if ($section->previousnext()->bool() and $page->depth() > 1) {
      snippet('previous-next'); 
    }
  ?>
</div>

<?php if ($section->submenu()->bool()) {
  snippet('submenu'); 
} ?>
</main>

<?php snippet('footer'); ?>

So I changed the middle part like this:

snippet('tooltip');
snippet('share');
snippet('author');
        
<div class="comments">
    <?php snippet('comments') ?>
</div>

My result looks like this:

ParseError
syntax error, unexpected ‘<’, expecting end of file

That was an early failure even by my standards. Who can help me?

[texnixe]

@hendrik

snippet('tooltip');
snippet('share');
snippet('author');

You have to close your php tag after snippet('author'), because you start with HTML after that.

[hendrik]

Thanks texnixe. I got it this way:

    snippet('tooltip');
    snippet('share');
    snippet('author'); ?>

    <div class="comments">
      <?php snippet('comments') ?>
    </div>

    <?php // See controller for $section
      if ($section->previousnext()->bool() and $page->depth() > 1) {
        snippet('previous-next'); 
    }
  ?>
</div>

Now all I have to do is adjust the terrible, unformatted layout. I will get in touch again for sure. :o)

[hendrik]

Hello again,
As expected, I have two questions:

1. How do I make the form look more appealing than so:
   

   

2. I would have expected the saved comments to be displayed in the panel as the subpage of the respective article. But this is not the case. Did I have wrong expectations or something wrong now?

Oh, as a bonus question: The email notification doesn’t work either. This may be because I don’t know where to put the appropriate command in this file (I put it at the end.):

<?php
return [
  'debug' => true,
  'panel' => ['install' => true],
  'sitemap.ignore' => ['error', 'search', 'home/assets'],
  'languages' => false,
  'smartypants' => true,
  'markdown' => [
      'extra' => true,
  ],

  'thumbs' => [

    'driver' => 'gd',
    'quality' => 76,

    'presets' => [
      'xsmall'  => ['width' => 300, 'quality' => 76],
      'small'   => ['width' => 400, 'quality' => 76],
      'normal'  => ['width' => 800, 'quality' => 76],
      'large'   => ['width' => 1200, 'quality' => 76],
      'default' => ['width' => 800, 'quality' => 76],
      'columns' => ['width' => 400, 'quality' => 76],
      '3-2'     => ['width' => 800, 'height' => 533, 'crop' => 'center', 'quality' => 76],
      '16-9'    => ['width' => 800, 'height' => 450, 'crop' => 'center', 'quality' => 76],
      '2-1'     => ['width' => 800, 'height' => 400, 'crop' => 'center', 'quality' => 76],
      '3-1'     => ['width' => 800, 'height' => 267, 'crop' => 'center', 'quality' => 76]
    ],

    'srcsets' => [

      'default' => [
        '320w'  => ['width' => 320, 'quality' => 76],
        '600w'  => ['width' => 600, 'quality' => 76],
        '800w'  => ['width' => 800, 'quality' => 76],
        '1000w' => ['width' => 1000, 'quality' => 76],
        '1200w' => ['width' => 1200, 'quality' => 76]
      ],

      'small' => [
        '320w' => ['width' => 320, 'quality' => 76],
        '400w' => ['width' => 400, 'quality' => 76],
        '600w' => ['width' => 600, 'quality' => 76]
      ],
      '3-2' => [
        '400w'  => ['width' => 400, 'height' => 267, 'quality' => 76, 'crop' => 'center'],
        '600w'  => ['width' => 600, 'height' => 400, 'quality' => 76, 'crop' => 'center'],
        '800w'  => ['width' => 800, 'height' => 533, 'quality' => 76, 'crop' => 'center'],
        '1000w' => ['width' => 1000, 'height' => 666, 'quality' => 76, 'crop' => 'center'],
        '1200w' => ['width' => 1200, 'height' => 800, 'quality' => 76, 'crop' => 'center']
      ],
      '16-9' => [
        '400w'  => ['width' => 400, 'height' => 225, 'quality' => 76, 'crop' => 'center'],
        '600w'  => ['width' => 600, 'height' => 338, 'quality' => 76, 'crop' => 'center'],
        '800w'  => ['width' => 800, 'height' => 450, 'quality' => 76, 'crop' => 'center'],
        '1000w' => ['width' => 1000, 'height' => 562, 'quality' => 76, 'crop' => 'center'],
        '1200w' => ['width' => 1200, 'height' => 675, 'quality' => 76, 'crop' => 'center']
      ],
      '2-1' => [
        '400w'  => ['width' => 400, 'height' => 200, 'quality' => 76, 'crop' => 'center'],
        '600w'  => ['width' => 600, 'height' => 300, 'quality' => 76, 'crop' => 'center'],
        '800w'  => ['width' => 800, 'height' => 400, 'quality' => 76, 'crop' => 'center'],
        '1000w' => ['width' => 1000, 'height' => 500, 'quality' => 76, 'crop' => 'center'],
        '1200w' => ['width' => 1200, 'height' => 600, 'quality' => 76, 'crop' => 'center']
      ],
      '3-1' => [
        '400w'  => ['width' => 400, 'height' => 134, 'quality' => 76, 'crop' => 'center'],
        '600w'  => ['width' => 600, 'height' => 200, 'quality' => 76, 'crop' => 'center'],
        '800w'  => ['width' => 800, 'height' => 267, 'quality' => 76, 'crop' => 'center'],
        '1000w' => ['width' => 1000, 'height' => 334, 'quality' => 76, 'crop' => 'center'],
        '1200w' => ['width' => 1200, 'height' => 400, 'quality' => 76, 'crop' => 'center']
      ],

    ],
  ],

  'srcset-sizes' => [
    'default' => '(max-width: 671px) 100vw, (max-width: 959px) 63vw, (max-width: 1260px) 65vw',
    'small' => '(max-width: 671px) 400px, 600px',
  ],

  'cache' => [
    'pages' => [
      'active' => false,
        'ignore' => ['search']
    ]
  ],
  'routes' => [
    [
      'pattern' => 'sitemap.xml',
      'action'  => function() {
          $pages = site()->pages()->index();
          $ignore = kirby()->option('sitemap.ignore', ['error']);
          $content = snippet('sitemap', compact('pages', 'ignore'), true);
          return new Kirby\Cms\Response($content, 'application/xml');
      }
    ],
    [
      'pattern' => 'sitemap',
      'action'  => function() {
        return go('sitemap.xml', 301);
      }
    ]
  ],
  'community.markdown-field.buttons'  => [
    'headlines' => [
      'h2', 'h3', 'h4', 'h5', 'h6'
    ], 
    'bold', 
    'italic',
    'code',
    'strikethrough',
    'divider',
    'ul',
    'ol',
    'horizontal-rule',
    'divider',
    'image',
    'file',
    'divider',
    'pagelink',
    'link', 
    'email'
  ],
  'community.markdown-field.font' => [
    'family'  => 'sans-serif',
    'scaling' => false,
    'size'    => 'regular',
  ],
  'community.markdown-field.blank'      => true,
  'community.markdown-field.invisibles' => true,

  'hooks' => [
    'kirbytags:before' => [
      function (string $text = null, array $data = []) {
        return preg_replace_callback('!<(box)>(.*)<\/(box)>!siU', function (array $matches) use ($data) {
          $type = $matches[1];
          $html = '<div class="' . $type . '">';
          $html .= $this->kirbytext($matches[2], $data);
          $html .= '</div>';
          return $html;
        }, $text);
      },
    ]
  ]
];

c::set('comments.email.enabled', true);
c::set('comments.email.to', array('xxx@yyy.net'));

[texnixe]

@hendrik

How do I make the form look more appealing than so:

Use appropriate styles in your stylesheet. Nothing Kirby specific.

@hendrik

I would have expected the saved comments to be displayed in the panel as the subpage of the respective article.

Then you have to add a section to your blueprint that lists those comments.

@hendrik

c::set('comments.email.enabled', true);
c::set('comments.email.to', array('xxx@yyy.net'));

That is Kirby 2 syntax, add those options inside your return array.

There are other comments plugins that are still under development, just saying.

[hendrik]

@texnixe

There are other comments plugins that are still under development, just saying.

What are the promising candidates here? “Done” doesn’t seem to be one yet, does it?
How about this one here: GitHub - mauricerenck/komments: A Kirby 3 comment plugin

[texnixe]

Sorry, I didn’t express myself well, what I really meant was there are other plugins that are still being actively developed.

The Komments plugin is one, but there’s this one as well: https://github.com/sebastiangreger/kirby3-commentions, which I recommend you check out.

[mauricehh]

Hey,

I built that “komments” plugin, and it comes with some (very) basic styling which works at least for the starterkit. But you should be able to adjust it with some simple css.

It’s working stable and I use it on my site (https://maurice-renck.de) for some time now. It comes with all the base functionality you might need. And it support webmentions and encrypts email addresses.

[hendrik]

Hello Maurice, thanks for reporting. I just tried it on your site.

[mauricehh]

I answered you over there