DEV Community

websilvercraft
websilvercraft

Posted on β€’ Edited on

3

Using Helper Functions to Convert Markdown to HTML in Laravel 11

In this tutorial, we'll create a helper function in a Laravel application to convert Markdown content to HTML using the league/commonmark library. We'll cover the steps to create a helper file, include it in our Laravel project, and use it in a Blade template. This mechanism is used in Laravel 11 to make functions globally available.

Optional: Handling Markdown Conversion in Controller

The alternative is to handle the Markdown conversion in controller before passing the data to the view, so we no longer need to create a helper file:

use League\CommonMark\CommonMarkConverter;

public function show($id)
{
    $course = Course::find($id);
    $converter = new CommonMarkConverter();

    $post->description = $converter->convertToHtml($post->description);

    return view('post.show', compact('post'));
}
Enter fullscreen mode Exit fullscreen mode

Creating a Helper File to Make the Conversion Function Available in the Blade Template

Step 1: Install league/commonmark

First, we install league/commonmark library via Composer:

composer require league/commonmark
Enter fullscreen mode Exit fullscreen mode

Step 2: Create the helpers.php File

Next, we'll create a helpers.php file to define our helper function. This file can be placed in the app directory or any other preferred location.

touch app/helpers.php
Enter fullscreen mode Exit fullscreen mode

Open app/helpers.php and add the following content:

<?php

use League\CommonMark\CommonMarkConverter;

if (! function_exists('markdownToHtml')) {
    function markdownToHtml($markdown) {
        $converter = new CommonMarkConverter();
        return $converter->convertToHtml($markdown);
    }
}
Enter fullscreen mode Exit fullscreen mode

Step 3: Including the Helper File in Composer

To ensure Laravel automatically loads the helpers.php file, we need to modify the composer.json file to add the path to helpers.php under the autoload section:

"autoload": {
    "files": [
        "app/helpers.php"
    ]
}
Enter fullscreen mode Exit fullscreen mode

Step 4: Regenerate Composer Autoload Files

After modifying composer.json, regenerate the Composer autoload files by running:

composer dump-autoload
Enter fullscreen mode Exit fullscreen mode

Step 5: Use the Helper Function in Blade Templates

With the helper function defined and loaded, we can now use it in the Blade templates to convert Markdown to HTML:

<div>
    {!! markdownToHtml($post->description) !!}
</div>
Enter fullscreen mode Exit fullscreen mode

This tutorial is provided to show how we can make custom functions available in blade templates.

πŸš€ Interested to learn more πŸ› οΈπŸ€–πŸ’»? Then don't forget to πŸ“¬βœ‰οΈ, πŸ‘‡

πŸš€ If you are interested in learning more about programming, πŸ› οΈ building applications, or in general about AI πŸ€– and tech πŸ’», you can subscribe to my newsletter at websilvercraft.substack.com βœ‰οΈ to get the posts delivered directly to you as soon as I publish them! πŸ“¬
β €β €β € β €β €β €β € β €β € β €πŸ‘†πŸ‘†πŸ‘†πŸ‘†
β €β €β €β €β €β €β €β € πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†
β € β € πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†
πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†πŸ‘†

Hostinger image

Get n8n VPS hosting 3x cheaper than a cloud solution

Get fast, easy, secure n8n VPS hosting from $4.99/mo at Hostinger. Automate any workflow using a pre-installed n8n application and no-code customization.

Start now

Top comments (0)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs

πŸ‘‹ Kindness is contagious

Please leave a ❀️ or a friendly comment on this post if you found it helpful!

Okay