CODEWITHSUNDEEP
javascriptnode.jsharp
chris h.
chris h.

Reputation: 275

Harp js + blog example: Is there a way to set default partial for articles?

I'm playing around with the Harp static site generator and there is this blog example around everywhere, see for instance: http://kennethormandy.com/journal/start-a-blog-with-harp

I was asking if there is a way to set a default jade template/partial for all articles instead of defining one for each article which seems rather inconvenient to me?

E.g. outline of my app

/public
/articles
  _data.json        <--- json with my articles
  article.jade      <--- I would like to have one template for all articles
                           instead of having to add files:
                           article1.jade, 
                           article2.jade, ...
/index.jade

/articles/_data.json

{
 "article1": {
    "title": "Some article"
 },
 "article2": {
    "title": "Another one"
 }
 // eventually some more articles ...
}

/index.jade

...
ul
  each article, slug in public.articles._data
    li
      a(href="/articles/#{ slug }") #{ article.name }     // generated link only works when for each slug (e.g. "article1") a jade file exists
...

Is there a simple way to do that?

Upvotes: 1

Views: 286

Answers (1)

kennethormandy
kennethormandy

Reputation: 2150

You should be able to add a _layout.jade file in the articles/ directory to get what you’re after: https://harpjs.com/docs/development/layout

Building on the multiple layouts example on that docs page:

public/
  _layout.jade
  index.jade
  about.md
  articles/
    _data.json
    _layout.jade
    article1.jade
    article2.md

Here, index.jade and about.md will use the _layout.jade file in the root of the project. Anything in the articles directory—in this case, article1.jade and article2.md—will use the _layout.jade in the same directory.

This is a feature built into Harp and works for both Jade and EJS. If you are using Jade for everything, you could also use Jade specific features like block and extends. There’s also an example of that on the same docs page.

Upvotes: 1

Related Questions