Blog setup

In this guide we will setup your neleto instance to easily publish blog posts.

Prerequisites

Your instance user needs to have the role developer or admin to be able to manage the settings and components.

You need to finish your initial setup of your neleto instance before you can start using blog posts. For more information see setup.

You should also familiarize yourself with Components and Pages.

Create a component to render a post

You will first need to create a component specifically to render a blog post. Luckily your neleto instance already comes with a preset for this. To use this preset, navigate to the components page in the admin ui and click on + New from template. You should see a list of available presets, with one of the being called Post content. Click on the preset named Post content to create a component based on this preset. You can now edit this new component to match the styling of your website, or just click Save and close to close the modal. This component will now render a post, if included in the correct page.

Create a page to display any post

In addition to the post content component, you will need a page, which serves as a path to render posts on.

To create this page, navigate to the pages page in the admin ui and click on + New. You should land on the pagebuilder, where we need to do a few things.

First, the route of this page must have a parameter called slug. You can achieve this with a path similar to this: /post/:slug. Notice the :slug part, this is the path parameter, indicated by the : and its name is slug. The first part (/post) can be anything you want, it can also be more than one word, separated by a /. We recommend to at least use one word before the parameter, to reduce the risk of collisions with other pages, since the :slug parameter will be replaced with the slug of the post being visited. For example when someone visits a post with a slug of my-new-blog-post, and the post page has a route of /post/:slug, the resulting url will look like this: /post/my-new-blog-post.

The second thing you need to do is include your new Post content component in this page. To do this, switch to the elements tab in the pagebuilder and click on + Create element. You should see a popover with a list of all the components on your instance. One of them should be the Post content. If you can't see it, feel free to use the search at the top of the popover to search for it. When you found it, click on it to create an element with this component. If you're using the preset component without modifications, you don't need to change anything on the element itself.

The third thing you need to do is set the status to Public, otherwise visitors won't be able to see your posts.

And the last thing, you need to set the render mode to Dynamic, since the slug parameter will be different for each post. If it stays on Prerendered, you might encounter issues with visitors not seing the post they clicked on.

You can now add additional elements to this page or nest your post content component inside other elements. When you're done, save this page and it will be ready to display posts.

Link the post page in the settings

Your newly created page now needs to be registered in the settings, for neleto to know how to generate post links. To do this, navigate to the settings page, you can find this in the bottom left corner of the admin ui (if you're not inside a builder). On the settings page, you should'nt need to scroll down, since the page section is all the way at the top. In this section, you should find a drop down called Blog post page. If your post page's status is Public, you should see its title in this drop down when clicking on it. Click on your post page in the drop down to register it for rendering posts.

You can now save your settings. Your neleto instance is now ready to display posts. Although we recommend also creating a page to show an overview of all your posts, which we'll do in the next section.

Create a page to display a list of posts

The only requirement for this page is that it will need an element with the component Post list.

Create a post list component

neleto also provides a preset for this component, to use it navigate to the components page in the admin ui and click on + New from template again. You should see a preset named Post list, click on it to create it. This is a really simple component by default, it only has one property, where you can specify the list of posts shown. In the template we iterate over all posts in this property with the {{#each ...}}...{{/each}} block and render a simple link for each post. The helper post_path turns the post into a link to the post page using the page you registered in the settings.

You could leave the component as is, but you might want to extend it to additionally show the title and hero image of each post.

When you're done editing the component, click on Save and close.

Using the post list component

To use your new post list component, either create a new page dedicated to a list of posts, or include it in an existing page.

In both cases you just need to switch the the Elements tab in the pagebuilder and click on + Create element at the position you want your list of posts to show up. Then select the component Post list and you're essentially done. You can now also narrow down the list of posts using the rules input on the element, because by default it will show every post you create and publish.