In EJS template engine, how do I "include" a footer?

Question

Let's say I saved a snipplet of a footer. How do I "include" that in my current template?

You can try <%-include('your-path')%> – Hieu.Gi Jan 11 '21 at 06:58 — Hieu.Gi, Jan 11 '21 at 06:58

score 94 · Answer 1 · answered May 30 '11 at 05:47

94

I know this question has already been marked as answered, but I believe what you were looking for is the 'partial' syntax. In EJS, you can include the content from one view template in another like so:

<html>
  <head></head>
  <body>
    Blah blah blah
    <%- partial('footer') %>    
  </body>
</html>

answered May 30 '11 at 05:47

Matt H

1,119
6
8

16

Partials are removed from EJS, however you can now use an 'include' syntax. See here: http://stackoverflow.com/a/11835644/175082 – Alexander Mills Jul 10 '15 at 22:56

DanArl · Answer 2 · 2022-12-12T17:59:31.577

55

EJS makes it very simple to use includes. Here is how it is described in the EJS README:

Includes are relative to the template with the include statement, for example if you have "./views/users.ejs" and "./views/user/show.ejs" you would use <%- include('user/show'); %>.

You'll likely want to use the raw output tag (<%-) with your include to avoid double-escaping the HTML output.

<ul>
  <% users.forEach(function(user){ %>
    <%- include('user/show', {user: user}); %>
  <% }) %>
</ul>

So, in your case, if the footer resides in the same directory as the file you want to include it in, you would simply add <% include('footer') %> to your file.

edited Dec 12 '22 at 17:59

answered Oct 29 '13 at 03:51

DanArl

1,113
8
10

1

does this work if the footer template is in the parent directory, `<% include ../footer %>`? – Jan 25 '14 at 05:33
3

Yes, that will work too. You can use paths to any ejs file on the file system as long as your node process has read access to it. – DanArl Feb 05 '14 at 01:07
Such a weird syntax... to be able to include `../footer` without using quotes or anything. – Eduard Luca Dec 29 '15 at 11:48
1

This doesn't work without having the path/filename in quotes and parenthesis. EJS docs show <%- include('header'); -%> – devspeter Mar 10 '20 at 22:14

score 21 · Answer 3 · answered Feb 24 '20 at 15:08

21

the right syntax is <%- include('<path>', <object with extra parameters>) %>

include is a function Includes are relative to the template with the include call. (This requires the 'filename' option.) For example if you have "./views/users.ejs" and "./views/user/show.ejs" you would use <%- include('user/show'); %>.

You'll likely want to use the raw output tag (<%-) with your include to avoid double-escaping the HTML output.

answered Feb 24 '20 at 15:08

rubendmatos1985

466
3
13

This is what I was looking for: whether the included partial view could be provided its own model data. Do you have a hyperlink to documentation about that? – Mike Finch Aug 10 '23 at 14:35
I have since found documentation about that here: https://ejs.co/ – Mike Finch Aug 10 '23 at 14:48

score 19 · Answer 4 · answered Dec 30 '15 at 20:35

19

You can include the ejs template by

<% include includes/header.ejs %>

answered Dec 30 '15 at 20:35

Jackal

2,591
3
25
29

1

i don't think that will work you need to use <%- instead <% to get rendered output there is different between <% , <%- and <%= please read the docs – Vikas Kandari Dec 22 '19 at 14:48
I agree with @VikasKandari . The [EJS docs](https://ejs.co/#docs) recommends using the raw output tag `<%-` because it inserts the unescaped value. – TheLandolorien Feb 01 '20 at 23:07

score 11 · Answer 5 · answered Jan 13 '20 at 18:37

11

In Same DIR
<%- include('header'); -%>

Root DIR
<%- include('../partials/header'); -%>

Works with EJS v3.0.1

answered Jan 13 '20 at 18:37

tom

121
1
4

Its working for me. But why we are using like this ? Is there any reason? If any body knows please share. Thanks... – Fawwad Feb 09 '20 at 14:22
i face backdrop after closing modal using this. – omkar Apr 30 '20 at 09:40

score 4 · Answer 6 · edited Oct 14 '18 at 06:31

4

Easy to use include in ejs by using this syntax:

<% include filename %>

Note: file should be inside views.

edited Oct 14 '18 at 06:31

DarkSuniuM

2,523
2
26
43

answered Oct 14 '18 at 05:56

Bijayee Saswata

79
1
4

score 2 · Answer 7 · answered Feb 15 '22 at 07:52

2

This syntax <% include filename %> is not working anymore. <%- include('[relative path]'); %> this syntax works

answered Feb 15 '22 at 07:52

kulinos

33
3

score 0 · Answer 8 · answered May 24 '22 at 12:35

0

Assuming you have your partials inside a partial directory

Instead of <% partials/header %>

Try <%- include('partials/header') %>

It works fine for me

answered May 24 '22 at 12:35

VatsalVatsyayan

1

score 0 · Answer 9 · answered Dec 29 '22 at 16:07

To include the file, You are supposed to give the relative address from the file calling the include function. For example, I am assuming that i need to call a file.ejs in my current file.

<%- include('file.ejs') -%>

if my file.ejs is inside a folder, then:

<%- include('folder/file.ejs') -%>

In EJS template engine, how do I "include" a footer?

9 Answers9

Linked