How can I use the include_relative tag correctly?
I have my folder layout and files like so.
my-account.html
_includes
page-content
my-account
my-account.html
header.html
nav.html
In my-account.html I include the following file.
{% include page-content/my-account/my-account.html %}
All good.
However, inside the my-account.html from the includes folder, I am also calling header.html and nav.html
{% include page-content/my-account/header.html %}
{% include page-content/my-account/nav.html %}
Is there a way to use include_relative like this from the my-account.html since its in the same folder?
{% include_relative header.html %}
{% include_relative nav.html %}
Currently I get the error:
'./header.html' not found, so obviously the include_relative is not working.
Thanks!
Try this to the file my-account.html:
{% include /page-content/my-account/header.html %}
{% include /page-content/my-account/nav.html %}
I've tested here with a similar structure and worked, then you should be ok. ;)
Related
How do I correctly add javascript source assets in Jekyll?
I have tried to add the source link inside _includes\head.html below
which I feel that its not a good convention.
<link rel="stylesheet" href="{{ "/assets/css/main.css" | prepend: site.baseurl }}">
{% include head/meta.html %}
{% include head/links.html %}
{% include head/scripts.html %}
{% include head/styles.html %}
{% include my-head.html %}
<script src="https://cdnjs.cloudflare.com/ajax/libs/particlesjs/2.1.0/particles.min.js"></script>
Here is how the folder tree structure looks like. I am aware that I
have multiple places for my assets `js` and `css` , which I will organize later.
Your question is not very clear, but I would say that you are loading the particles library after you are referencing it. So your browser console should have some errors which you did not mention...
You should include particles js before your scripts.
{% include head/meta.html %}
{% include head/links.html %}
<script src="https://cdnjs.cloudflare.com/ajax/libs/particlesjs/2.1.0/particles.min.js"></script>
{% include head/scripts.html %}
{% include head/styles.html %}
{% include my-head.html %}
or even better way is to just add it to your head/scripts.html so that you have all the script imports in one place, but even there you should watch on the order of importing. If some script has dependancy, it dependency should be imported before it.
I have an _includes folder, and within it I have nav subfolder containing a nav.html file.
I've been trying to check if nav.html exists in nav. If it does, I want to include that nav.html file. If it doesnt exist, there will be a default nav for my template.
Here's the code I have right now:
{% for static_file in site.static_files %}
{% if static_file.path == '/nav.html' %}
{% include nav.html %}
{% endif %}
{% endfor %}
Hope you guys can help me out.
Many thanks in advance
I am not able to find the solution using existing liquid tags so I solved this by using a plugin with a custom liquid tag.
{% capture fileExists %}{% file_exists _includes/nav/custom/nav.html %}{% endcapture %}
{% if fileExists=="true" %}
{% include /nav/custom/nav.html %}
{% else %}
{% include /nav/default/nav.html %}
{% endif %}
See GitHub Repo
Okay so I have my index.html file which has a file called info.html which exntends from the index.html file but it isn't quite working currently. Here's my code:
index.html
<body>
{% include "home/quote.html" %}
{% include "home/intro.html" %}
{% block content %}
{% endblock %}
{% include "home/projects.html" %}
{% include "home/goals.html" %}
</body>
info.html
{% extends "home/index.html" %}
{% block content %}
<section class="info-section">
<div class="info-section_content">
{% include "home/includes/info-content.html" %}
</div>
</section>
{% endblock %}
Essy Fix!
In views.py in the apps directory i was rendering the parent file (index.html) so I have now switch to render the child file (info.html) and it now works.
I would need some more information on your project to know for sure, but I would check to make sure that you are referencing the proper namespace here:
{% extends "home/index.html" %}
For instance if the path is something like templates/home/something/info.html or templates/something/home/info.html this could be the issue.
I am using Github Pages' Jekyll integration. I added the Disqus configuration today but Disqus does not appear on my posts. I have added the Disqus script to a file _includes/disqus.html and added {% include disqus.html %} to _layouts/default.html.
You may view this work at my https://github.com/shaneoston72/shaneoston72.github.io
Thank you for any help you can offer.
Ok, we'll need to do a few things here:
At the end of your file _layouts/default.html what I see is:
</div>
{% include disqus.html %}
{% include footer.html %}
</body>
Replace this part for:
</div>
{% include footer.html %}
{% if page.comments %}
{% include disqus.html %}
{% endif %}
</body>
Then, on your file _includes/disqus.html, delete the first and the last line:
{% if post.comments %}
.....
{% endif %}
This should do the job. Let me know how it goes, ok?
Hope to have helped!
I downloaded the whole package of Bootstrap(the middle one) and was looking into its hierarchy. I found out that this source code contains the site http://getbootstrap.com/.
For example, it has the html file of getting-started page looks like this:
---
layout: default
title: Getting started
slug: getting-started
lead: "An overview of Bootstrap, how to download and use, basic templates and examples, and more."
---
{% include getting-started/download.html %}
{% include getting-started/whats-included.html %}
{% include getting-started/grunt.html %}
{% include getting-started/template.html %}
{% include getting-started/examples.html %}
{% include getting-started/tools.html %}
{% include getting-started/community.html %}
{% include getting-started/disabling-responsiveness.html %}
<!-- Cross link to new migration page -->
<div class="bs-callout bs-callout-info" id="migration">
<h4>Migrating from v2.x to v3.x</h4>
<p>Looking to migrate from an older version of Bootstrap to v3.x? Check out our migration guide.</p>
</div>
{% include getting-started/browser-device-support.html %}
{% include getting-started/third-party-support.html %}
{% include getting-started/accessibility.html %}
{% include getting-started/license.html %}
{% include getting-started/translations.html %}
I know it can be rendered into static site by some kind of template render engine. But how to do it?