NAME
Mojolicious::Plugin::UniqueTagHelpers - Mojolicious Plugin to use unique javascript and stylesheet links.
SYNOPSIS
# Mojolicious
$self->plugin('UniqueTagHelpers');
# Mojolicious::Lite
plugin 'UniqueTagHelpers';
DESCRIPTION
Mojolicious::Plugin::UniqueTagHelpers is a set of HTML tag helpers for javascript and stylesheets, allowing multiple includes in templates.
OPTIONS
max_key_length
Maximum content length to use as keys. If content length exceeds this, MD5 will be used to make keys to reduce memory usage. Default: 256.
HELPERS
stylesheet_for
@@ index.html.ep
% layout 'default';
% stylesheet_for 'header' => 'css/main.css';
...
% include 'someblock'
@@ someblock.html.ep
...
% stylesheet_for 'header' => 'css/main.css';
@@ layouts/default.html.ep
<!DOCTYPE html>
<html>
    <head>
        <title>MyApp</title>
        %= content_for 'header';
    </head>
    <body>
        <%= content %>
    </body>
</html
This example generates only one link to css/main.css:
<!DOCTYPE html>
<html>
    <head>
        <title>MyApp</title>
        <link href="css/main.css" rel="stylesheet" />
    </head>
    <body>
    </body>
</html>
javascript_for
@@ index.html.ep
% layout 'default';
% javascript_for 'footer' => 'js/main.js';
...
% include 'someblock'
@@ someblock.html.ep
...
% javascript_for 'footer' => 'js/main.js';
@@ layouts/default.html.ep
<!DOCTYPE html>
<html>
    <head>
        <title>MyApp</title>
    </head>
    <body>
        <%= content %>
        %= content_for 'footer';
    </body>
</html
This example generates only one link to js/main.js:
<!DOCTYPE html>
<html>
    <head>
        <title>MyApp</title>
    </head>
    <body>
        <script src="js/main.js"></script>
    </body>
</html>
unique_for
@@ index.html.ep
% layout 'default';
% unique_for 'footer' => begin;
    <div id="modal">...</div>
% end
...
% unique_for 'footer' => begin;
    <div id="modal">...</div>
% end
@@ layouts/default.html.ep
<!DOCTYPE html>
<html>
    <head>
        <title>MyApp</title>
    </head>
    <body>
        <%= content %>
        %= content_for 'footer';
    </body>
</html
This example generates only one "modal" element:
<!DOCTYPE html>
<html>
    <head>
        <title>MyApp</title>
    </head>
    <body>
        <div id="modal">...</div>
    </body>
</html>
SEE ALSO
Mojolicious, Mojolicious::Guides, Mojolicious::Plugin::TagHelpers, http://mojolicio.us.