Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Modify <head> from included file or block #1943

Open
LeifLazar opened this issue Apr 30, 2015 · 4 comments
Open

Modify <head> from included file or block #1943

LeifLazar opened this issue Apr 30, 2015 · 4 comments
Labels
pug-linker
Milestone
3.0.0 - Blocks an...

Comments

@LeifLazar
Copy link

Hi,

Is there a way to insert tags in the <head> of the page from an included .jade file or from a block?
I stumbled upon this while trying to make some reusable files like menu.jade and footer.jade which use their own .css and .js files. Also I wanted to use some <meta> tags just when I use specific files/blocks.

I also posted the question on S.O.: here.

Is there any syntax or workaround that I missed?

Thank you!
@LeifLazar LeifLazar changed the title Jade: modify <head> from included file or block Modify <head> from included file or block May 1, 2015
@ghost
Copy link

ghost commented May 1, 2015

Why don't you use block for that too?
http://jade-lang.com/reference/extends/
layout.jade:

doctype html
html
  head
    title= title
    link(rel="stylesheet", href="stylesheets/main.css")
    script(src="javascripts/main.js")
    block extrastuff
  body
    block content

index.jade

extends shared/layout

block extrastuff
  link(rel="stylesheet" href="/stylesheets/...")

block content
  h1= title
  p Welcome to #{title}

@LeifLazar
Copy link
Author

Well, that's not what I wanted to achieve. What I want to do looks more like this:

layout.jade:

doctype html
html
    head
        title= title
        block extraStyles
        block extraScripts
    body
        block content

index.jade

extends shared/layout

block content
    include shared/menu.jade // or any other way to display the menu
    // content

menu.jade

block extraStyles
    link(rel="stylesheet" href="stylesheets/menu.css")

block extraScripts
    script(src="javascripts/menu.js")

// menu content

@timcroydon
Copy link

Yes, this would be a really useful feature. My use case is a re-usable panel type component that I use on a number of pages, making it an ideal candidate for an include. However, the panel relies on a third-party lib so would be nice to add that to the page-wide list of scripts at the bottom of the page. At present I only seem to be able to get something like this:

...
layout content here
<div>
  included content here that relies on third party script
  <script src='thirdpartyscript.js'></script>
</div>
<script src='layoutscripts.js'></script>

@rekey
Copy link

rekey commented Aug 18, 2015

Yes, this would be a really useful feature.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
pug-linker
Projects
None yet
Milestone
3.0.0 - Blocks and Mixins
Development

No branches or pull requests
4 participants
@rekey @ForbesLindesay @timcroydon @LeifLazar