I may be searching the wrong terms but I can't seem to find an obvious way to make easy links to page section ids.
Lets say I have a _widgets.md file with a section id=section-1 so I want to generate a link to: /widgets/#section-1
I found this for links:
Jekyll link within page
So an same page link is as simple as [Section 1](#section-1) but I can't seem to find how to add the anchor to links from another page like this [Widgets - Section 1]({% link _docs/widgets.md%}).
You can use the capture tag, see jekyll or shopify
In HTML
{% capture link_with_anchor %}{% link _pages/links.md %}#foobar{% endcapture %}
Links
In Markdown
{% capture link_with_anchor %}{% link _pages/links.md %}#foobar{% endcapture %}
[Links]({{ link_with_anchor }})
You can benefit from the link features (check if page exists) and can add the anchor, e.g. foobar.
One cool way to manage links is to have a central include file that defines the links by name, which is then referenced by each document.
For example you have a file in the _includes directory called "links.md" which defines all the cross-document links in your site:
[Section 1]: {% link widgets/page.md %}#section1
[Section 2]: {% link widgets/page2.md %}#section2
etc
Then in your markdown you can just say:
This is a link to [Section 1] isn't that nice.
... other content
{% include links.md %}
Related
I have been trying to add a link with my index.html page (made from nicepage) in the nav bar as suggest through tutorials {% urls 'homepage' %}
however, it adds to the rest of the link so?
What can I do?
Do I have to create a navbar.html ? is it necessary?
html page with nav bar /
urls.py file in the project
You did not use the {% url … %} template tag. You can work with a leading slash like:
<!-- ↓ leading slash -->
Experience
to define an absolute path instead of a relative path. But it makes more sense to work with the {% url … %} template tag [Django-doc]:
<!-- ↓ url template tag ↓ -->
Experience
You should of course not only change the tag for experience, but for all the links.
where experience is the name=… specified in your path(…).
I'm making a site using this theme: Github repo; theme demo.
The theme is built with the blog feed on the homepage (index.html). What I would like to do instead is:
make a static homepage (i.e. no blog feed on the homepage), and
have the blog feed live on a separate page called "Blog", with the link "/blog" or "/blog.html".
The code for the blog feed lives in _includes/blog.html and is included in the home layout using {% include blog.html %}.
What I've tried
changed the layout of index.html to a static layout like page, and created a new page in the root called blog.html with the layout home - this succeeded in creating a static homepage, but the blog page yields a home-like header but no blog feed (essentially a page with no content).
created a new page in the root called blog.html with the layout default, and pasted the content of the home layout (including {% include blog.html %}) into that page - this yielded the same result as above.
created a new layout called blog, which is a copy of the current home layout. I deleted the line {% include blog.html %} from the home layout. Then I gave index.html the home layout and created a new page in the root called blog.html with the layout blog. This yielded the same result as above.
In short, it seems like the blog feed isn't able to generate in any file other than index.html, and I haven't been able to figure out why. Is it something I'm missing in the theme's configuration? Apologies if this turns out to be a dumb question - I'm rather new to this. Thank you for any help you can give me!
EDIT: Turns out it was an issue with the paginator, which by default paginates from home.
The index.html uses the home layout:
---
layout: home
---
This lives in _layouts/home.html and contains a header and includes blog.html. It looks like this:
---
layout: default
---
<div class="home">
<div id="main" class="call-out"
style="background-image: url('{{ site.header_feature_image | relative_url }}')">
<h1> {{ site.header_text | default: "Change <code>header_text</code> in <code>_config.yml</code>"}} </h1>
</div>
{% include blog.html %}
</div>
The blog.html file loops over all (blog) posts:
<div class="posts">
{% for post in paginator.posts %}
...
To solve your issue, you need to define your own home page as an include like this:
Create your-custom-homepage.html with html of your choice.
Include it in home.html as {% include your-custom-homepage.html %} instead of {% include blog.html %}. Just replace the line in _layouts/home.html.
Then it will contain the header and your content.
The Jekyll documentation, e.g. https://jekyllrb.com/docs/step-by-step/04-layouts/ and https://jekyllrb.com/docs/includes/ will hopefully explain the details.
I have a Jekyll setup that looks like this:
_config.yml
_records
a.html
b.html
c.html
...
I want to create a home page that links to each record. However, I want to render a.html and b.html to /records/, but I don't want to render c.html to /records/, as that HTML will be provided to my server from a different process altogether.
I tried setting the following in _config.yml:
exclude:
_records/c.html
But this also removes c.html from site.records, which is not what I want. The best solution I have right now is to prevent my deploy script from deploying _site/records/c.html, but I'd much rather prevent _site/records/c.html from being generated in the first place.
Is it possible to include c.html in site.records to create the links on the home page but not render /records/c.html? Any help others can offer with this question would be greatly appreciated!
Here's how I did this. Inside _records/c.html, set in the front matter:
permalink: '_'
route: /records/c.html
That will make it so that we render the page's html content to _site/_.html, a route that won't ever get visited.
Then in index.html to create the link to the route attribute of this page, use:
{% for record in site.records %}
{% if record.route %}
{% assign url = record.route %}
{% else %}
{% assign url = record.url %}
{% endif %}
<a href='{{ url }}'>{{ record.title }}</a>
{% endfor %}
First day with Jekyll, I basically have the minima theme from Jekyll that I'm modifying trying to create a new site.
I have a home.html within _layouts. My goal is to place paragraphs within 3 individual columns, side-by-side. My understanding is that _layouts and _includes are mainly for formatting, at least that's how I look at them. I aware one can put a bunch of static text to display within these files, but it seems cleaner (and easier to edit) if the text to display were in something like a _pages folder. But of course doing so creates a new link in the header. So I am trying to find a way insert a markdown file which is just paragraphs of text that I can cleanly insert into my main home page, and only there.
How and where does one place markdown (paragraph sizes) for the sole purpose of inserting into layouts or includes, but not writing them directly into the layout or include, nor making it a post or a page, or using variables within _data. I was hoping to make a markdown file for smaller purposes than posts, pages, etc...
My _layouts/home.html looks as follows, but the markdown isn't showing up. IIRC, this is because includes can only access _includes, and I was hoping not to have to write this data within _includes or html's.
---
layout: default
---
<div class="home">
<div class="home-col-wrapper">
<div class="home-col home-col-1">
{% include front-col-1.md %}
</div>
</div>
<div class="home-col home-col-2">
{% include front-col-2.md %}
column 2
</div>
<div class="home-col home-col-3">
{% include front-col-3.md %}
column 3
</div>
</div>
I also tried putting an *.md file in _pages and changing the layout to home, but to no avail. The text didn't show up in the home layout.
---
layout: home
---
A bunch of stuff should probably go here. So be sure to make sure it looks ok. ok? ok!
I just did something similar. If I understand your question correctly, all you need to do is to replace {% include front-col-1.md %} by
{% capture temp %}{% include front-col-1.md %}{% endcapture %}
{{ temp | markdownify }}
What happens is that Liquid captures the markdown file in the variable temp, and then markdownify converts it into HTML and adds it.
I don't think you can put the markdown files elsewhere, but they need to be in _includes.
Related: https://github.com/jekyll/jekyll-help/issues/51
Link to repo: https://github.com/AlvSovereign/AlvSovereign.github.io
I am coding my portfolio site, with a link to my blog. The fully processed portfolio site sits in _site/index.html which contains a link to the blog (fully processed link exists in _site/blog.html)
Blog.html at the root of the repo has in the front matter a layout of "bl", which is defined in my layouts folder under "bl.html".
"bl.html" is the layout I want for my blog page, which contains my includes etc. It also contains the {{ content }} liquid tag.
If I am thinking about this the right way, my posts are being parsed (I think this is the right terminology) into "post.html" - which has the front matter "layout: bl", which then parsed into "bl.html", and that this is so as they both have {{ content }} in each files.
Now all my posts are showing correctly (i think) within _site/(year)/(month) etc. However, they are not ending being parsed through my "blog.html" file, and then visible on my webpage. How I know this is that the fully processed "blog.html" file does not have any of the posts in them.
What will I need to do to solve this issue?
If it helps, I use Prepros for LiveReload, and using LANYON template, http://lanyon.getpoole.com/
{{ content }} refers to all the content that in the file that is being converted to HTML code.
For example, if you are passing a blog post on 'What is Jekyll' to any layout that has the {{ content }} tag, all text other than the YAML front matter will be put in that place. Basically the content of the post. You can also limit the scope by using {{ post.content }}, see Variables for more info here.
So the Liquid {{ content }} variable works as intended.
Looking at your website, I believe you're trying to display all the posts in your blog.html file, so what you're actually asking about is why aren't my posts being displayed (not parsed) in your blog.html file, hence not visible on your webpage.
The reason for that is because you shouldn't use {{ content }} tag for that, what you want instead is something like this snippet of code as mentioned in the Jekyll docs, that will grab all your posts, and display them by post title, as well as a link to that post. Here's the code to display a list of your posts. (taken from the website I linked you)
<ul>
{% for post in site.posts %}
<li>
{{ post.title }}
</li>
{% endfor %}
</ul>
So just swap out {{ content }} in your bl.html layout with that code snippet and you've got what you want.
Additionally, if you also want to display the content/excerpt in the list of posts, just add the liquid tag {{ post.content }} or {{post.excerpt}} like so:
<ul>
{% for post in site.posts %}
<li>
{{ post.title }}
{{ post.content }} /* or post.excerpt */
</li>
{% endfor %}
</ul>
Of course, edit the HTML accordingly for your preference. Read the documentation on how to set up post excerpts here, which uses the <!--more--> comment separator for excerpts.
I strongly recommend reading the JekyllRb documentation for more information, it's a lot to read and not always easily understandable, but keep referring to it and you'll understand more in no time.