In Middleman, which uses layout files, how can we add a js file for a specific html file at compile time?
I am using Middleman and I have a layout file that adds a jQuery CDN at the bottom for all files .html.haml
. The layout file adds a jQuery CDN after all html elements have been rendered.
One of my files .html.haml
will have an additional js file that uses jQuery; however, you must first see the jQuery CDN loaded.
How can I tell Middleman to add the js file for this particular file at compile time .html.haml
? I tried adding = javascript_include_tag "jsfile"
to the end of my file .html.haml
but it was wrong because it needed to load jQuery first, which won't happen until I get to the end of the layout file.
layout file:
!!! 5
%html{lang: 'en'}
%head
%body{class: current_page.data.body_class || 'page'}
= yield
// jQuery
= javascript_include_tag "//ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"
//I need to insert my js file here, but only for a specific HTML file.
PS Also, I need to place jQuery at the bottom of the file to make rendering more efficient, so I cannot put it in head
.
source to share
Providing my answer here after figuring out what worked for me:
First I needed to set a flag via index_options
in the file .html.haml
:
---
title: My Site
index_options: target_file
---
Then I had to update my layout file with the instruction if
!!! 5
%html{lang: 'en'}
%head
%body{class: current_page.data.body_class || 'page'}
= yield
// jQuery
= javascript_include_tag "//ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"
//Here the added update:
= javascript_include_tag "my_jsFile" if (current_page.data.index_options == "target_file")
source to share