Sir Trevor JS in Laravel project


Integrate the tool Sir Trevor JS in a Laravel 4/5 project.


This package is available through Packagist and Composer.

For Laravel >= 5.1 version js & amp, use the branch master : "caouecs/sirtrevorjs": "~2.4.0"

For Laravel >= 5.1 version fb articles, use the branch v2.3 : "caouecs/sirtrevorjs": "~2.3.0"

For Laravel >= 5.1 version view & amp, use the branch v2.2 : "caouecs/sirtrevorjs": "~2.2.0"

For Laravel >= 5.1 version base, use the branch v2.1 : "caouecs/sirtrevorjs": "~2.1.0"

For Laravel 5.0, use the branch v2 : "caouecs/sirtrevorjs": "~2.0.0"

For Laravel 4, use the branch laravel4 : "caouecs/sirtrevorjs": "~1.4"

Please read in the choosen branch.


In your app/config/app.php, add in aliases :

'SirTrevorJs' => 'Caouecs\Sirtrevorjs\SirTrevorJs',
'STConverter' => 'Caouecs\Sirtrevorjs\SirTrevorJsConverter'

Service Provider

If you want to use routing, controllers, views directly in your project, in your app/config/app.php, add "Caouecs\Sirtrevorjs\SirtrevorjsServiceProvider" to your list of providers.


To get tweets, this project uses thujohn/twitter. Please visit the page of the project to know how to install and configure.

Configuration file

Next, you must migrate config :

php artisan vendor:publish caouecs/sirtrevorjs

After installation, the config file is located at app/config/packages/caouecs/sirtrevorjs/sir-trevor-js.php.

You can define :

  • the path for image upload
  • the route for upload image
  • the route for tweet
  • the path of Sir Trevor files
  • the list of block types
  • custom blocks
  • the language
  • the paths for Eventable.js and Underscore.js
  • the view
  • configuration for blocks
    • soundcloud
    • gettyimages
  • etc...

SirTrevorJs class


For stylesheets :


For scripts, in your Blade files :


Fix for image block

Function to fix a problem with image block when you add a new image :

    $text = SirTrevorJs::transformText($text);

Find first image

Get first image in text with findImage method :

    string SirTrevorJS::findImage(string $text);

In return, you have url of image or empty string.

Find elements by blocktypes

Get all elements in text, in specified blocktype with find method :

    mixed SirTrevorJS::find(string $text, string $blocktype [, string $output = "json"])

In return, you can have :

  • array, if you choose "array" for $output
  • json, if you choose "json" for $output
  • false, if the script doesn't find an occurence of blocktype



This trait proposes two things :

  • upload image where you want
  • get tweets

Upload image

This project proposes a system for upload image, nothing to configure, just the directory_upload value in config file.

    "directory_upload" => "img/uploads"


This project proposes a system to get tweets. I use thujohn/twitter project.

SirTrevorJsConverter class


Convert text from Sir Trevor Js to html :

    $convert = new SirTrevorJsConverter();

Or via SirTrevorJS class :

    {{ SirTrevorJs::render($text) }}

These methods return a string with html and js codes.


Convert text from Sir Trevor Js to Amp:

    $convert = new SirTrevorJsConverter();

All modules have an amp's version, if it exists an equivalence.

This method returns an array ( text and js).

Facebook Instant Articles (very experimental)

Convert text from Sir Trevor Js to Facebook Instant Articles:

    $convert = new SirTrevorJsConverter();

All modules have an FBArticles's version, if it exists an equivalence.

This method returns a string with html and js codes.

Define views

By default, you can define views in config file. But if you want to use multi views in your project, you can define a new view in the constructor of STConverter.

$convert = new SirTrevorJsConverter('sirtrevor::amp');

Adding custom blocks

You can choose to add custom blocks in config file or add them by extending SirTrevorJsConverter class.

'customBlocks' => [
    'image_extended' => '\App\SirTrevorConverters\ImageExtendedConverter',
namespace App\SirTrevorConverters;

use \Caouecs\Sirtrevorjs\SirTrevorJsConverter as Converter;

class SirTrevorJsConverter extends Converter
    public function __construct($view = null)
        $this->customBlocks = [
            'image_extended' => \App\SirTrevorConverters\ImageExtendedConverter::class,



For the moment, the code can convert :