How to create a blog with Toolset

With the Toolset Plugins it’s easy to create any type of content, searches and lists. Anyone can do it, and you don’t need to hire a programmer to achieve great results.

Using WordPress, we already have a great tool for bloggers, but it is limited, the design of your website will be determined by the Theme and the WordPress search functionalities are rather limited. WordPress comes with some default content type, such as Blog Posts and Pages, as well two default taxonomies (Categories and Tags), which is great, and we will use the inbuilt post type “Posts” in our blog example. Additionally we will create a search for our blog, so visitors can quickly find content they are looking for, without scrolling through eventually hundreds of posts.

We will also give the blog a nice design and layout, so it looks appealing.

Assuming you already have some content created (posts), we will jump straight to the task of listing those posts in the Website and add a search form to find posts by text searches, category and tags filters.

Install Toolset and create a View

First, you will need to download and install Toolset Plugins (for this task we only need the Toolset Blocks Plugin). It works like any other WordPress Plugin, so you can easily upload it to your WordPress install and activate it in the Dashboard > Plugins area as used to from other WordPress plugins. Since this is a premium plugin you will have to register your website with Toolset to get automatic Updates, however you can also skip this step and jump straight to the developing and designing part.

Once the Toolset Blocks plugin is installed, head to create a new Page in WordPress, lets call it “Blog”. When you use the WordPress Blocks Editor (Gutenberg) you will notice that a bunch of new blocks has been added to the Blocks Navigator, offering several blocks such as View, Heading, Grid, Container and so on. The Blocks of Toolset have a red color, which makes them easy to find.

Let’s start off by inserting a Container block. As the name suggests, this is a block that allows you to “bundle” other content within it. It is a good idea to start off with a Container for several reasons. You can for example drag and drop the Container Block into any other section of your page easily, and it will move all nested contents in that block as well. This is useful when your content becomes complicated and has nested levels, instead of moving each part you can move the entire Container at once. Also it offers several features such as Container link (where the entire container can be transformed to a clickable element, it offers background colours, padding and margin settings, and much more.

Insert a Container

Next we will already start to create the list of posts and the search. In Toolset, a list of things is generally created with the View block. This block is one of the most advanced blocks in the entire WordPress World Of Blocks, and it can be a bit intimidating to work with it. Just follow the post to get your Blog with Search ready in no time!

We made a small image slider below that illustrates the first steps to take, in order to create the View Block and configure to get started with the more particular details such as design and search.

The User Interface of the Toolset View is pretty straight forward up to this point and most likely you will feel comfortable adding a View and select the options as per your needs. Once you are done, the Interface will get a little more complicated, because there are lots of options in a list with a search, however we will guide you thru all the necessary steps and also provide some ready-to-go content which you can download and use at any time, saving your time creating.

Some of the Container Settings

Configure the View Layout and add a Search

You should now see something like this on your Block editor

The View editor

We will first configure the View Loop section, which is where you add the content that will show in the list. We are going to use a pre-made Card for this, which you can download for free here. We use this to jumpstart the development, and can later make changes to this Card to adapt it to the look and design of any particular website.

This is where the real power of Toolset becomes visible. We can for example populate the Title of the card(s) with the name of each blog post we have in our website, by simply applying a setting in the block (Dynamic Heading). If we where to code this with PHP, we would need to create a loop and pull the data from the database, then pass this data to HTML and style this with CSS. In Toolset, we just added all of this very complex content with a few clicks. Using the Dynamic Input of Toolset we don’t need to worry about PHP Loops or there like, but can focus entirely on the design.

In the image below you can see how I changed the static example text of our example blog lists card to a dynamic field that will automatically pull all the Blog Posts Content and show it on each of the cards in our Blog! I did the same with the Cards Heading Image (Using the Blog Posts Featured Images) and with the Card Title, which now links to each particular post without any further ado.

I can as well pull comment numbers, author, taxonomies, and much more by only using the Block Settings. Compared to Custom Code approaches, this way I can create a dynamic list in literally no more than a few minutes, and spend much more time on styling and finesse.