Jekyll paginate blog as subdirectory - pagination

I'm using Jekyll for a static site and I'm trying to generate the blog as a subdirectory/subfolder:
http://example.com/blog
In the directory structure before running jekyll, this is blog/index.html.
I tried adding pagination by adding "paginate: 5" to _config.yml, but the generated url's were of the form:
http://example.com/page2/
i.e. no "/blog". This is fixed by:
paginate_path: /blog/page/:num
in _config.yml.
But the resulting generated pages at:
http://example.com/blog/page/2/
don't use blog/index.html as their layout. They use the root index.html. What's the point in even having the paginate_path option, then?
How do I get my blog at example.com/blog, with pagination, using Jekyll?

Use the destination key in your _config.yml file to set the base path where you want the output to be published to. For example,
paginate: 5
destination: _site/blog
Note that assuming your site is setup to server its root (e.g. "http://example.com/") from "_site" jekyll won't produce and "index.html" page at that location. Everything that jekyll builds will be under the "blog" directory, but that sounds like what you are after.

I found a fix via this page Basically it involves a bit of a hack to figure out if you are on the nth page of the blog and then includes a file that pulls in you blog section.
Create a file in _includes/custom/ called pagination. In that have your pagination code
<!-- This loops through the paginated posts -->
{% for post in paginator.posts %}
<h1>{{ post.title }}</h1>
<p class="author">
<span class="date">{{ post.date }}</span>
</p>
<div class="content">
{{ post.content }}
</div>
{% endfor %}
<!-- Pagination links -->
<div class="pagination">
{% if paginator.previous_page %}
Previous
{% else %}
<span class="previous">Previous</span>
{% endif %}
<span class="page_number ">Page: {{ paginator.page }} of {{ paginator.total_pages }}</span>
{% if paginator.next_page %}
Next
{% else %}
<span class="next ">Next</span>
{% endif %}
</div>
Now in your _layout/index.html add
{% if paginator.page != 1 %}
{% include custom/pagination %}
{% else %}
The original content of index
{% endif %}

Related

Eleventy: Add pagination only to blog posts

In Eleventy, I have a simple layout file that I'd like to use for most pages on my website, including the blog collection. I'd like the layout to only add my pagination partial when in a blog post.
My attempt below doesn't add the pagination partial to any post. I know I need to modify the if statement, but I don't know how. Everything works fine if I don't include the if statement, but pages not in the blog collection get some of the code from partial, which I don't want.
Any suggestions?
---
layout: layouts/base.njk
---
<article>
<h1>{{ title }}</h1>
{{ content | safe }}
</article>
{% if post in collections.blog %}
{% include "partials/_pagination.njk" %}
{% endif %}
I got the answer from the Eleventy group on Discord:
---
layout: layouts/base.njk
---
<article>
<h1>{{ title }}</h1>
{{ content | safe }}
</article>
{% if "blog" in tags %}
{% include "partials/_pagination.njk" %}
{% endif %}

Symfony / a2lix_translations / customize

can someone help me.
How can I modify default template to bootstrap version?
Because input's doesn't have a class "form-control".
Here is defaul:
{% block a2lix_translations_widget %}
{{ form_errors(form) }}
<div class="a2lix_translations tabbable">
<ul class="a2lix_translationsLocales nav nav-tabs">
{% for translationsFields in form %}
{% set locale = translationsFields.vars.name %}
<li {% if app.request.locale == locale %}class="active"{% endif %}>
<a href="#" data-toggle="tab" data-target=".{{ translationsFields.vars.id }}_a2lix_translationsFields-{{ locale }}">
{{ locale|capitalize }}
{% if form.vars.default_locale == locale %}[Default]{% endif %}
{% if translationsFields.vars.required %}*{% endif %}
</a>
</li>
{% endfor %}
</ul>
<div class="a2lix_translationsFields tab-content">
{% for translationsFields in form %}
{% set locale = translationsFields.vars.name %}
<div class="{{ translationsFields.vars.id }}_a2lix_translationsFields-{{ locale }} tab-pane {% if app.request.locale == locale %}active{% endif %} {% if not form.vars.valid %}sonata-ba-field-error{% endif %}">
{{ form_errors(translationsFields) }}
{{ form_widget(translationsFields) }}
</div>
{% endfor %}
</div>
</div>
{% endblock %}
{% block a2lix_translationsForms_widget %}
{{ block('a2lix_translations_widget') }}
{% endblock %}
I have no idea what should I insert/delete/modify :(
Thanks
I have done a custom form template for a2lix_translations with bootstrap(full code is too long and not optimal to paste here) But to get the classes I need like form-control into the widgets I have done the following:
{%for field in translationsFields%} {# further break the transliationsfields into individual inputs #}
{%if field.vars.attr is not empty and field.vars.attr['class'] is defined and field.vars.attr['class']=="tinymce"%}
{{form_widget(field ,{'attr':{'class':' tinymcertl'}} )}}
{%else%}
{{form_widget(field,{'attr':{'style':'direction:rtl','class':class~' form-control'}} )}}
{%endif%}
{%endfor%}
The ugly code above is basically saying, if the widget already has a class, add the class form-group to it. If the widget does not have a class at all, set the class to be form-group. I have done that if statement to avoid null pointers since if I try to reference the form class and there isn't one, the code will crash. And if I just do set class to form-group, it will erase the previous classes.
I hope this helps. My full code might not be helpful to you because the languages I was working with involved left to right language and right to left languages, so a lot of conditions had to be implemented to orient my page in the right direction, which is messy and you might not need...
PS: this was done on symfony 2.7 or so. Did not test on symfony 3.
in my case sf 3.2 i just did this change in my config.yml and all forms are bootstraped :
# app/config/config.yml
twig:
//....
form_themes:
- 'bootstrap_3_layout.html.twig'

where is block/about-us coming from in bolt _aside.twig

I was just reading through content fetching in bolt HERE , which gave me a fair idea of how setcontent works. Now i came across the following code in _aside.twig template in the default bolt theme:
<div class="panel">
{# The next section attempts to fill the panel in the sidebar with the contents of the
'about-us'-block, if it exists. First, attempt to fetch the block with slug 'about-us' #}
{% setcontent block = "block/about-us" %}
{# check if we have a title. If so, we know we have content to display. Otherwise, we will
output a default text, telling the user to create the 'blocks' in the backend. #}
{% if block.title is defined %}
<h5>{{ block.title }}</h5>
{{ block.content }}
{% if link(block.contentlink) or block.editlink() %}
<p>
{{ link(block.contentlink, __('general.phrase.read-more')) }} /
{{ __('general.phrase.edit') }}
</p>
{% endif %}
{% else %}
<h5>{{ __('general.phrase.missing-about-page') }}</h5>
<p>{{ __('general.phrase.missing-about-page-block') }}</p>
{% endif %}
</div>
My question is about the below line of code:
{% setcontent block = "block/about-us" %}
Where is "block/about-us" coming from ??
it refers to a record with the slug about-us on the blocks ContentType. It's set up as a resource ContentType. You can read more about resource ContentTypes here:
https://docs.bolt.cm/3.1/howto/resource-contenttype

Unique page identifiers in Grav CMS

I'm using the Grav CMS to create a modular web page; however, I'm having difficulty customizing the layout based on how the content is generated.
I've followed the documentation found Grav main site from which I've model my site after.
My folder structure is essentially:
pages
01.home
_section1
_section2
In each section folder I have my .md file. And each section is considered a sub-page of 'home'.
I've created the template file, modular.html.twig, in which I have the following code:
{% extends 'partials/base.html.twig' %}
{% block content %}
{% for child in page.children() %}
{{ child.content() }}
{% endfor %}
{% endblock %}
This code iterates through sub-pages to load the content onto the home page. In my template I'm simply printing the result of the content using {{ content }}
What I end up with is a page with vertically stacked content and repeating html,
as such.
What I want to do is uniquely define each sub-page (section) so that I can manipulate the content differently in my html, as such.
I've thought about creating separate template files for each section, but much of my content is nested.
For instance I have something akin to:
<div class="row">
<div class="section-1">
<h1>{{ content }}</h1> <!--Needs to be unique-->
</div>
<div class="section-2">
<h1>{{ content }}</h1> <!--Needs to be unique-->
</div>
</div>
Is it possible to accomplish what I'm trying to do with this framework? If so, how might I go about it?
Thank you
I think there are many ways to do this. For me, I use page's header to set CSS class of each section.
My section's md files could look like this (for example mysection.md)
---
title: Section 1
section_class: section-1
---
This is the content of section 1.
Here is my modular.html.twig:
{% extends 'partials/base.html.twig' %}
{% block content %}
<div class="row">
{% for child in page.children() %}
<div class="{{ child.header.section_class }}">
{{ child.content() }}
</div>
{% endfor %}
</div>
{% endblock %}
In my mysection.html.twig I print the section's content
<h1>{{ page.content }}</h1>
I hope this helps.

Dynamic title AND content in Jekyll

I have a page whose structure is somewhat like this
---
layout: contents
title: contents
description: Contents of the posts.
permalink: contents/
---
<ul class="posts">
{% for post in site.posts %}
{% if post.categories != "tips" %}
<h2><a class="post-heading" href="{{ post.url }}">{{ post.title }}</a></h2>
<p> {{ post.description }} </p>
<p class="date">{{ post.date | date_to_string }}</p>
<hr class="hr-color"></hr>
{% endif %}
{% endfor %}
</ul >
Currently the URL of this page is set according to permalinks(BASE_URL/contents). I want that when a user clicks on an option( Android,Java,Web are the options) in the previous page, i get the URL of this page as BASE_URL/android or BASE_URL/Java and also display the contents of that category.
Is this possible using jekyll?
Two solutions :
1 - Using a plugin
You can use this category archive generator
2 - Using hand crafted pages
If you cannot use plugin (gh-pages) you can make a page per category, like this :
android.html
---
layout: category
title: Android
permalink: android/
---
_layouts/category.hmtl
---
layout: default
---
<ul class="posts">
{% for post in site.posts %}
{% if post.categories contains page.title %}
<h2><a class="post-heading" href="{{ post.url }}">{{ post.title }}</a></h2>
<p> {{ post.description }} </p>
<p class="date">{{ post.date | date_to_string }}</p>
<hr class="hr-color"></hr>
{% endif %}
{% endfor %}
</ul >

Resources