Create webs to publish your content with custom templates.

dev-master 2020-03-25 20:59 UTC

This package is auto-updated.

Last update: 2020-04-01 19:05:02 UTC


Folio for Laravel logo.

Display your web content with custom templates.

Live Examples


Require using Composer:

composer require nonoesp/folio:dev-master

Most packages should be auto-discovered by Laravel.


Add the following middleware to app/Http/Kernel.php:

    protected $middlewareGroups = [
        'web' => [
            /// nonoesp/folio


  • Remove Laravel's default migration files from database/migrations as they can collide with Folio's migrations. (TODO - Check if this is necessary or Folio's users table works.)
  • Setup your database connection in the .env file.
  • Publish rtconner/tagging migrations:
php artisan vendor:publish --provider="Conner\Tagging\Providers\TaggingServiceProvider"
  • Run the migrations
php artisan migrate --path=vendor/mpociot/versionable/src/migrations
php artisan migrate

Note: Revert migrations with php artisan migrate:reset, but tables and contents will be removed.


Folio supports optional configuration.

To get started, publish the configuration file to config/folio.php.

php artisan vendor:publish --provider="Nonoesp\Folio\FolioServiceProvider" --tag=config

Compile Web Assets

  • Publish the assets with:
php artisan vendor:publish --provider="Nonoesp\Folio\FolioServiceProvider" --tag=dev-assets

This will copy Folio stylesheets and JavaScript files to the resources folder, in sass and js, respectively.

  • Copy the following code into webpack.mix.js.
const mix = require('laravel-mix');

mix.sass('resources/sass/folio.scss', 'public/nonoesp/folio/css')
// .sourceMaps()
   .js('resources/js/folio.js', 'public/nonoesp/folio/js')

// Use versioning and cache busting in production (i.e. npm run prod)
if (mix.inProduction()) {

// mix.copy('node_modules/folio-scss/vendor/icons-links-gwern', 'public/img/icons');

// BrowserSync when watching (i.e. npm run watch)
// mix.browserSync('localhost:8000');
  • Install dependencies with npm.
npm install nonoesp/folio-scss bourbon@4.3.4 font-awesome vue vue-resource vue-focus lodash jquery jquery-lazy validate-js vuedraggable
npm install
  • Build with:
    • npm run prod · to build for production
    • npm run dev · to build for development
    • npm run watch · to rebuild on changes with BrowserSync

Publish Translations

php artisan vendor:publish --provider="Nonoesp\Folio\FolioServiceProvider" --tag=lang

Publish Views

php artisan vendor:publish --provider="Nonoesp\Folio\FolioServiceProvider" --tag=views

File Uploader

  • Create storage/public/uploads folder.
  • TODO: Give permissions to uploads folder.
  • Symlink uploads folder to public/img/u.
ln -s global/path/to/storage/app/public/uploads global/path/to/public/img/u

Subscribers Notifications

Optionally, you can receive new subscriber notifications via email.

  • Setup Amazon SES in config/services.php:
	// Amazon SES
	'ses' => [
        'key' => 'your-api-key',
    	'secret' => 'your-secret',
    	'region' => 'us-east-1',
  • The activate notifications in config/folio.php:
'subscribers' => [
    'should-notify' => true,
    'from' => [
        'email' => '',
        'name' => 'John McFrom'
    'to' => [
        'email' => [''],
        'name' => ['Jane McTo']


Folio uses spatie/laravel-backup to do full app backups containing a database dump and/or all local files.

        'dropbox' => [
            'driver' => 'dropbox',
            'authorization_token' => 'your-token'


Folio is licensed under the MIT license.


Hi. I'm Nono Martínez Alonso (Nono.MA), a computational designer with a penchant for simplicity.

I host Getting Simple—a podcast about how you can live a meaningful, creative, simple life—sketch things that call my attention, and write about enjoying a slower life.

If you find Folio useful in any way, reach out on Twitter at @nonoesp. Cheers!