Is there an equivalent to laravel's #section('') blocks in jekyll? What I am trying to do is create a template that can condense the html shared between multiple jekyll pages. For example:
default_layout
<html>
<div class="page-content">
<div class="wrapper">
{{ content }}
</div>
</div>
</html>
page_1
---
layout: default
permalink: xxx
---
<head>
<title>My title</title>
{% include header.html %}
...
<div> <!-- A shared block between pages with different content --> </div>
....
<div> <!-- Another shared block between pages with different content --> </div>
{% include footer.html %}
</html>
It looks like the current offering of jekyll allows you to use sub-templates, but limits the {{content}} block to be a separate file that also inherits the child template. I would need to create a bunch of files that inherent one another to create the final html page (or so I think).
What worked for me in Laravel was using multiple #yield and #section statements to easily insert dynamic data into a shared template. I don't think Jekyll can do this without creating a bunch of nested sub templates, but I hope I am wrong.
Solution 1:
You could use Jekyll's include files for that.
You probably already know about includes, because you're using them in the layout file in your question.
If your shared blocks are just HTML, using an include is all you need.
But maybe (I'm not sure) the shared blocks are text, meaning you'd like to use Markdown for formatting?
By default, Jekyll doesn't render Markdown in include files, but with a little trick it's still possible to include Markdown files.
I have a site where I needed the same block of text (with formatting and links) on multiple pages, so I did this:
Put the text in a Markdown file into the _includes folder, e.g. _includes/info.md
Include that file and render the Markdown by capturing it and then using the markdownify Liquid filter:
{% capture tmp %}{% include info.md %}{% endcapture %}
{{ tmp | markdownify }}
Solution 2:
If the shared blocks are the same for certain groups of pages, maybe you want to use multiple layout files.
The best example of this would be a blog built with Jekyll:
You have a "basic" layout (navigation, sidebar, footer...) that all pages share, and which is directly used by "regular" pages.
Then, you have a second layout "inheriting" from the main one, which adds stuff like post date, tags and so on - this is used by all blog posts.
Here's a simple Jekyll example for this.
Related
I have two very similar sections on a jekyll website.
The displayed content change for only some words or resources.
I handle this using 3 files:
One markdown content without Front Matter. This file content the text with if conditions:
# Mardown Content
Here is more info about:
{% if page.section == 'sectionA' %}
[Something About Setion A](/sectionA/something)
{% elsif page.section == "sectionB" %}
[Something About Setion B](/sectionB/somethingelse)
{% endif %}
Two markdown files with front matter including the content
---
layout: myTemplate
section: sectionA/B
title: something
---
{% include content.md %}
I used to have those 3 files in the same directory using {% include_relative content.md %}. This way seems better because the files were in the same directory and the _include folder do not mix up content and html templates.
But my config of jekyll builds also a page for the content file displaying an html page.
Is there a way to prevent serving this html content?
Do you know a better way to handle this?
In _config.yml add :
exclude:
- content.md
This will instruct Jekyll not to process content.md.
Note : I don't get why you cannot put content.md in the _includes folder.
Say I have a template layout saved in template.html. This template includes a banner, side navigation, content container, and footer. Can I use flask to break up these page elements in such a way that I can have files such as banner.html, sidenavigation.html, etc. and render these different files within template.html?
From: http://jinja.pocoo.org/docs/templates/#include
template.html
{% include 'banner.html' %}
{% include 'sidenavigation.html' %}
{% include 'content.html' %}
{% include 'footer.html' %}
By default, Flask uses Jinja2 as its template engine. See Jinja's Template Designer Documentation how it's done.
Before you start, you need to write these components separately to other html files as pure html. For example, these files shouldn't contain any jinja syntax. After that, according to the documentation, you can easily import them into your template.html file by calling {% include 'filename.html' %} code.
I'm creating a website using Jekyll.
so far I have four pages which are created automatically from four md files which md files are in the root of the project.
index.md
about.md
login.md
register.md
Here is the content inside my login.md file
---
layout: layout-default
title: some login title
permalink: /login
theme: secondary-theme
nav:
menu-items:
- type: text
text: Don't have an account?
- type: link
text: SIGN UP
class: button
linkPath: /register
sections:
- type: 3
class: form-section
header-line-2: Login Section!
form:
api: http://127.0.0.1:8080/login
submit-text: LOG IN
form-controls:
- label-text: EMAIL ADDRESS
input-type: email
input-placeholder: Enter your email
input-name: email
- label-text: PASSWORD
label-link-text: Forgot password?
label-link-path: #
input-type: password
input-placeholder: Enter your password
input-name: password
---
What i do is iterating the sections and applying html attribute values depending on the variables inside each section. That way i can have as many sections rendered as i want on one page. And they can also be different depending on the classes and content i put in the md file.
The problem is that if the project gets too complicated with different styles for sections and so on. I would like to separate each section content. It would be nice if i could make a folder lets say login/sections folder
and then put md files inside and then inside login.md file include these section md files. This way the code would be much more organized.
Is there way to do that, and is my approach actually good.
Jekyll provides the ability to include files into another files. The magic directory for this is _includes. Example:
If you create a file named _includes/sections/s1.html, you can include that into any other file with the following tag:
{% include sections/s1.html %}
This approach works for:
including HTML file into HTML
including HTML file into Markdown (since Markdown can contain HTML code)
including Markdown into Markdown
If you want to include a Markdown file into a HTML, you have to use some trick:
{% capture m %}{% include sections/s1.md %}{% endcapture %}
{{ m | markdownify }}
I have a layout used for the home page for different sections on my Jekyll site. On each of these pages I would like to have links to each item in the section, the details of which are stored in a YAML file in the site _data directory. My aim is to have the name of the site data variable in the section page front matter and pass this into the layout for rendering. For example:
Page Front Matter
---
sectionItems: site.data.sectionItems.awesomeSectionItems
---
...which is passed to the section home layout...
Section Home Layout
{% for item in page.sectionItems %}
// Work with section item...
{% endfor %}
Unfortunately, when I run the site nothing appears. How would I go about doing this? I have also tried an include but this also does not work. I would like to avoid adding the for loop to each page, plus I would like the links to appear beneath the main content section.
You cannot use variables in front matter. You will have to use a content variable like {% assign sectionItems = site.data.sectionItems.awesomeSectionItems %} and then loop with {% for item in sectionItems %}.
I'm developing a web portal using
- Django 1.2
- Apache
- Mod WSGI
I've several HTML files which are being served by apache.
I want to render those static HTML pages under my base template in order to keep my header / footer and dynamic menus intact.
One way I could thought its using iframes. Another way is to do read HTML files and return string while rendering but in that case I'm loosing advantage of apache, so I want to know if there would be any better way of doing it, is there any existing solution provided by django stuff ?
I'm not sure if this is exactly what you're asking for, but you can insert an html file (or even another template) in a template with the ssi and include tags, depending on your needs:
{% ssi '/path/to/file.html' %}
{% include 'relative/path/to/template.html' %}
yes, it's the include tag
Loads a template and renders it with the current context. This is a way of "including" other templates within a template.
it's as simple as
{% include "templates/static_template_1.html" %}
or, if you create a variable in the view side:
{% include template_name_variable %}
it shares the context with the base template (the one including them)
Edit:
Perhaps you ment to load html-files outside the template-system. Then my way will not suffice.
An option is to extend your base template.
Your base template should not be aware of the sub templates as that would be logically wrong.
Example:
base_template.html:
<html>
<div id='header'></div>
{% block content %}
This text can be left out else it it will shown when nothing is loaded here
{% endblock %}
sub_template.html:
{% extends "base_template.html" %}
{% block content %}
<h1>This is my subpage</h1>
{% endblock %}
You can read more here:
https://docs.djangoproject.com/en/1.2/topics/templates/