muath-ye/Turbolinks + Laravel.MD

Forked from yaza-putu/Turbolinks + Laravel.MD

Created June 29, 2023 13:08

Star (0) You must be signed in to star a gist
Fork (0) You must be signed in to fork a gist

Select an option

Learn more about clone URLs
Clone this repository at <script src="https://gist.github.com/muath-ye/1e58ff0a28d8e655370591759c960a95.js"></script>
Save muath-ye/1e58ff0a28d8e655370591759c960a95 to your computer and use it in GitHub Desktop.

Download ZIP

Install Turbolink Navigation in laravel

Raw

Turbolinks + Laravel.MD

Instalasi

cd directory
npm install
install turbolink with npm

npm i turbolinks

paste code here in resources/js/app.js

var Turbolinks = require("turbolinks");
if (Turbolinks.supported) {
    Turbolinks.start();
}

compaile mix js, waiting until compailed done

npm run watch

paste inside

   <head>
       <script src="{{ mix('js/app.js') }}" defer></script>
   </head>

use this css for custom progress bar

.turbolinks-progress-bar {
  height: 5px;
  background-color: green;
}

hidden progress bar

.turbolinks-progress-bar {
  visibility: hidden;
}

it's esay, Done!

Note

Usually turbolink will read tag automatically, if turbolink does not work, you can use this script to fix it

 <a  href="javascript:void(0)" onClick="Turbolinks.visit(location_url)" >

Basically the turbolink speed is cached, but in some circumstances you may not need it, you can turn it off with

    <meta name="turbolinks-cache-control" content="no-cache">

it's recommended

More detail visit

https://github.com/turbolinks/turbolinks

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment