How to Create a Blog with Laravel

Laravel is the most popular PHP framework. People prefer this framework to build their web applications. While building a website with Laravel, you probably want a blog on your website. In general, Laravel is not a blogging platform like WordPress where you get all the backend stuff ready to manage your articles. Building the blog system from scratch is quite time-consuming work. Thanks to the Canvas package which makes Laravel developer’s life easy by providing a cool publishing platform for Laravel.

Using the Canvas package, we can easily build our blog in Laravel without investing a lot of time. Canvas already did hard work for managing the blog’s backend stuff. All you need to do is just get the data and display it on the frontend matching your design.

Having said that, let’s take a look at how to create a blog with Laravel using the Canvas package.

Create a Blog with Laravel using Canvas Package

In order to get started, you need to install the Canvas package through the command:

composer require austintoddj/canvas

After this, publish the assets and configuration file by running the next command.

php artisan canvas:install

This command will create a few tables in your database with the prefix ‘canvas_’. It also creates a dummy user whose credentials should change immediately. Visit the SITE_URL/canvas.login URL, enter dummy credentials: email@example.com / password. Once logged in, change your email and password.

Next, create a symbolic link to ensure file uploads are publicly accessible using the Artisan command:

php artisan storage:link

Now you will find your images inside the public/storage directory.

Inside the Canvas dashboard, you will see options for Posts, Users, Tags, Topics, etc. You can play with the system and get familiar with it. It’s very easy and self-explanatory.

Go to Posts and create a few articles. You can add it by clicking on 3 dots->New post.

canvas-new-post

When you are adding content, Canvas saves it automatically. You don’t need to save it explicitly. Again under the 3 dots, you will find a few options to add featured images, general information. Click on ‘General settings’, it will open a pop-up where you can insert a summary, tags, etc. I’ll recommend that you sync your slug with the post title. For this, you have to click on the icon next to SLUG and it will generate a slug as per the post title.

canvas-slug

If you want to see where all these posts are stored then navigate to your database. Check out the table canvas_posts. This is the table that holds the record of posts. Using this table, we will display the posts on the front end.

Display Posts on Website

As we want to fetch records from the canvas_posts table, we will require a Model for it. But we don’t need to create it separately. The Canvas package already created a model Post which you will find at vendor/austintoddj/canvas/src/Models/Post.php.

I am going to show you how to display all posts in a listing and also a single post view. I am not adding any styling stuff as everyone has their own design. The user should adjust the styling matching to their website.

Create a PostController using the command:

php artisan make:controller PostController

Define the routes for the listing and single post view.

Route::get('/blog', 'PostController@index');
Route::get('/post/{slug}', 'PostController@view');

Here for the listing page, I used the URL slug as ‘blog’. In the case of a single post, I passed ‘post/{slug}’. The {slug} will be the actual slug of a post. This slug will be used to fetch records of a single post.

Write the below code in PostController.php file.

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Canvas\Models\Post;

class PostController extends Controller
{
    public function index()
    {
        $posts = Post::all();
        return view('blog', ['posts' => $posts]);
    }

    public function view(Request $request, $slug)
    {
        $post = Post::where('slug', $slug)->first();
        return view('post', ['post' => $post]);
    }
}

It’s time to create a view and insert code to it. You will require 2 Blade files: blog.blade.php and post.blade.php.

blog.blade.php

@if (count($posts) > 0)

    @foreach ($posts as $post)
        <div>
            <h3>
                <a href={{ url('post/'.$post->slug) }}>{{ $post->title }}</a>
            </h3>
            <p>{{ $post->summary }}</p>
        </div>
    @endforeach

@endif

post.blade.php

<div>
    @if ($post->featured_image)
        <img src="{{ asset($post->featured_image) }}" />
    @endif
    <h3>{{ $post->title }}</h3>
    {!! $post->body !!}
</div>

Head over to the browser and run the URL SITE_URL/blog. You will see a listing of posts you have added in Canvas. On click of any post title, you will redirect to the post detail page where you will see the post information.

I hope you understand how to create a blog with Laravel using a Canvas package. Please share your thoughts and suggestions in the comment section below.

Related Articles

If you liked this article, then please subscribe to our YouTube Channel for video tutorials.

7 thoughts on “How to Create a Blog with Laravel

  1. Very thank you for this article.
    in the last part, when we use:
    url($data[‘post’][‘featured_image’])
    if featured_image was null, we got an error.
    better to use this:
    $data[‘post’][‘featured_image’] ? url($data[‘post’][‘featured_image’]) : ”

Leave a Reply

Your email address will not be published. Required fields are marked *