Load More Ajax Problems

Hello everyone,

Im trying to get my head around Kirby and its fantastic.

But I have been trying to implement load more ajax on my blog, and everything is going right except for receiving a 404 with my json… Ive looked all over forums for my same problems and have not been able to find a solution.

This is the error message on my console:

“GET http://localhost:8000/james-oh/journal.json?limit=2&offset=2 404 (Not Found)”

It seems to be a routing problem to the journal.json.php file. Please help! issues been bugging me all week!


Journal template:

    <?php snippet('header') ?>

      <main class="journal-container" role="main" data-page="<?= $page->url() ?>" data-limit="<?= $limit ?>">

            <?php if($articles->count()): ?>
              <?php foreach($articles as $article): ?>
                <?php snippet('journal-entry', compact('article')) ?>
              <?php endforeach ?>
            <?php else: ?>
              <p>No articles yet.</p>
            <?php endif ?>

          <button class="load-more">Load more</button>

    <?php snippet('footer') ?>

Journal Snippet:

<div class="journal-group">

  <header class="article-header">

      <a href="<?= $article->url() ?>">
      <span class="article-date">
      <?= $article->date('d m Y') ?>
      <a class="article-title" href="<?= $article->url() ?>">
        <?= $article->title()->html() ?>


  <span class="article-image">
    <?php snippet('coverimage', $article) ?>
  <div class="article">

    <div class="article-body">

      <p><?= $article->text()->kirbytext() ?></p>



Journal Json:


$html = '';

foreach($articles as $article) {

  // reuse the project snippet to create the HTML for each project
  // we need to set the third parameter to true, to return the
  // snippet content instead of echoing it
  $html .= snippet('journal-entry', compact('article'), true);


// add $html and $more to the $data array
$data['html'] = $html;
$data['more'] = $more;

// JSON encode the $data array
echo json_encode($data);

Journal Controller:


return function($site, $pages, $page) {
  $articles = $page->children()->visible();
  $count    = $articles->count();

  if(r::ajax() && get('offset') && get('limit')) {
    echo "yo!";
    // convert limit and offset values to integer
    $offset = intval(get('offset'));
    $limit  = intval(get('limit'));

    // limit projects using offset and limit values
    $articles = $articles->offset($offset)->limit($limit);

    // check if there are more projects left
    $more = $count > $offset + 1;

    // otherwise set the number of projects initially displayed

  } else {
    $offset   = 0;
    $limit    = 2;
    $articles = $articles->limit($limit);

  return compact('offset', 'limit', 'articles', 'more');



var element = $('.journal-container');
  var url     = element.data('page') + '.json';
  var limit   = parseInt(element.data('limit'));
  var offset  = limit;

  $('.load-more').on('click', function(e) {

    $.get(url, {limit: limit, offset: offset}, function(data) {

      if(data.more === false) {


      offset += limit;



Thank you! I look forward to hearing your help!


What do you get if you type that url directly into the browser’s address bar?

Looks like you are trying to do this on the home page?

Hello! No Im doing it on my Journal (blog) page.

My homepage response is:

“The requested resource /james-oh/journal.json was not found on this server.”


Is the filename of the json template correct, i.e. journal.json.php?

Yes it is, and all my php files are named journal. The thing is, I tried this with the code exactly shown on load more and it still didnt work. So Im quite sure it is a routing problem. Other thing to note, Im booting localhost from terminal, maybe that could be an issue?

Could you please remove that bit and try again?

still the same error :frowning2:

Works in my Mamp environment, but not using the built-in server…

@lukasbestle, any idea?

Yes: The built-in PHP server does not support dots in the URL. It’s just a limitation we can’t get around.
The Panel has a fix for this (by using a different character for the dot), but this won’t really work for this feature.

no worries, I am using mamp and its working fine! thank you guys!


Just as information: Further to this topic on Stackoverflow, I came across this script in the Drupal issues. Seems it is possible to pass a script to the server startup call to take care of this issue… if anyone cares.

1 Like

Thanks again! will keep it in mind!