So far I am trying to set a paginator in my blog posts. I followed the documentation and other sites tutorial but any of these solutions did not work out for me. Considering my issue I think I am missing out on a simple step.
The blog folder sitemap.
Blog.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.css">
<link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Ubuntu|Roboto'>
<link rel="stylesheet" href="{{ site.baseurl }}/assets/css/blog.css">
<title>Blog</title>
</head>
<body>
{% include nav.html %}
<main>
{{paginator.posts}}
<!-- post list -->
<h1>Blog Post List</h1>
<div class="post-list post-list_grid">
{% for post in site.posts %}
<!-- Post start -->
<div class="post-list__post post">
<figure class="post__preview-img">
<a href="{{post.url}}"><img src="{{ site.baseurl }}/assets/thumbnail/{{ post.titleimage }}" alt="">
</a>
</figure>
<div class="post__header">
<time datetime="2019-11-09" class="post__time">november 09, 2019</time>
<h2>{{ post.title }}</h2>
</div>
</div>
{% endfor %}
<!-- Post end -->
</div><!-- / .post-list -->
<!--scroller-->
<div id="jsScroll" class="scroll" onclick="scrollToTop();">
<i class="fa fa-angle-up"></i>
</div>
</body>
{% include scroll.html %}
{% include toggle.html %}
</script>
</html>
posts/index.html
---
layout: blog
---
{% if paginator.total_pages > 1 %}
<div class="pagination">
{% if paginator.previous_page %}
« Prev
{% else %}
<span>« Prev</span>
{% endif %}
{% for page in (1..paginator.total_pages) %}
{% if page == paginator.page %}
<em>{{ page }}</em>
{% elsif page == 1 %}
{{ page }}
{% else %}
{{ page }}
{% endif %}
{% endfor %}
{% if paginator.next_page %}
Next »
{% else %}
<span>Next »</span>
{% endif %}
</div>
{% endif %}
blog.md
---
layout: blog
title: Blog
pagination:
enabled: true
---
I even tried with the paginate version 2. But the result was same. It did not show any repsonse.
_config.yaml
email: your-email#example.com
description: >- # this means to ignore newlines until "baseurl:"
Write an awesome description for your new site here. You can edit this
line in _config.yml. It will appear in your document head meta (for
Google search results) and in your feed.xml site description.
baseurl: "" # the subpath of your site, e.g. /blog
url: "" # the base hostname & protocol for your site, e.g. http://example.com
twitter_username: jekyllrb
github_username: jekyll
# Build settings
theme: minima
plugins:
- jekyll-feed
- jekyll-paginate
# Pagination Settings
paginate: 2
paginate_path: /posts/page:num/
Related
I am creating an eleventy scaffolding project to learn more about SSG, this is my first time using an SSG so I am new to the templating stuff with nunjucks, etc.
What I am trying to build:
I want to create a template for a landing page/showcase that can be re-used but display different data within a for loop.
What I have:
site.json
{
"showcase": [
{
"title": "explore docs",
"url": "#"
},
{
"title": "visit github repository",
"url": "https://github.com/ExampleUser/ExampleRepo"
}
],
"404showcase": [
{
"title": "return home",
"url": "/"
}
]
}
pageShowcase.njk
Currently, I am just using an if statement to control what data set to
use but if I ever extend this to other layouts and use a third
or fourth set of data this will become really repetitive adding in a
new elseif for every new set of data
{%- set pageTitle %}{% if title %} {{title}} {% else %} {{ site.title }} {% endif %}{% endset -%}
{%- set pageDescription %}{% if description %} {{ description }} {% else %} {{ site.description }} {% endif %}{% endset -%}
<!-- Showcase -->
<div class="container">
<div>
<div>
<h1>{{ pageTitle }}</h1>
<p>{{ pageDescription }}</p>
<div class="navbar" id="navmenu">
<ul class="navbar">
{% if defualt %}
{% for item in site.showcase %}
<li>
{{ item.title}}
</li>
{% endfor %}
{% else %}
{% for item in site.404showcase %}
<li>
{{ item.title}}
</li>
{% endfor %}
{% endif %}
</ul>
</div>
</div>
<!-- <img src="assets/img/#.svg" alt="temp"> -->
</div>
</div>
</section>
index.njk
---
layout: base
defualt: true
---
<!-- include pageShowcase -->
{% include "partials/pageShowcase.njk" %}
<!-- home page content -->
<section>
<div class="container">
<main>
{{content | safe}}
</main>
</div>
</section>
404.njk
---
title: "404: Page Not Found"
description: "It looks like the page doesn not exist"
defualt: false
---
<!DOCTYPE html>
<html lang="{{ lang }}">
<!-- include head -->
{% include "partials/head.njk" %}
<body>
<!-- use pageShowcase for 404 page -->
{% include "partials/pageShowcase.njk" %}
</body>
</html>
This is the best I could come up with on my own, but I feel like there has to be a better way without re-writing the same code over and over.
Appreciate any help I can get on this one.
<!DOCTYPE html>
<html>
<head>
{% if title %}
<title> Django blog - {{title}} </title>
{% else % }
<title> Django blog </title>
{% endif %}
</head>
<body>
{% for post in posts %}
<h1>{{post.title}}</h1>
<p>By {{post.author}} on {{post.date_posted}} </p>
<p>{{post.content}} </p>
{% endfor %}
</body>
</html>
When i run the code the head tag is empty and there is no title but the for loop executes to give the result i expected.
Instead of {% if title %}, do you mean {% if post.title %} ?
Try this-
<head>
{% if post.title %}
<title> Django blog - {{post.title}} </title>
{% else % }
<title> Django blog </title>
{% endif %}
Or Make sure you have passed something called 'title' in that dictionary, like this-
return render(request, 'doc.html', {'post':post, 'title':title})
Hope my answer helped!
This is my base.html
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
</head>
<body>
{% block content %}{% endblock content %}
</body>
</html>
This is home_page where I am using the {% extends 'base.html' %}
{% load static %}
{% block content %}
<div class="container">
<h1>{{ title }}</h1>
<h1>Hello, world!</h1>
<img src="{% static 'img/myImage.jpg' %}" class='img-fluid'>
</div>
{% if premium_content %}
<div class="row">
<div class="col">
<h1>Premium</h1>
{{ premium_content }}
</div>
{% endif %}
</div>
{% endblock content %}
The here is my views.py where I have the home_page and before using the extends tag I could render this page properly
def home_page(request):
context = {
"title":"Hello World We Working"
}
if request.user.is_authenticated:
context["premium_content"] = 'Only premium users see this'
return render(request, 'MainApp/home_page.html', context)
The error message that I am getting is TemplateDoesNotExist at / Which I do not understand I even tried putting the two html files in the same directory but still I get the same error message
You should create templates file in your project or app directory and update TEMPLATES variable in the settings.py like below:
TEMPLATES = [
{
...
'DIRS': [os.path.join(BASE_DIR, 'templates')],
...
},
]
And then put your HTML files on the templates directory
I hope this works for you
I created a page with octopress using octopress new page 100-days-of-code-log which created a 100-days-of-code-log.html. I added an .md file of the same name. I then created a directory called _pages in the root of my project folder and copied those files into that directory.
I added the YAML front matter:
---
layout: default
title: 100 Days of Code Log
tags: [100 days of code, challenges]
modified:
permalink: "/100-Days-Of-Code-Log/"
comments: true
image:
feature: Panorama.jpg
credit: Divine Mayhem Photography
creditlink: http://www.divinemayhem.com/
---
I then ran jekyll build and pushed the changes to GitHub.
The content on the page is not there. I added the page to _navigation.yml and it is in the navigation bar. However there is no content on the page.
I am using a theme by this guy and I have followed the documentation. But the content does not appear.
Here is the code for the page.html for the _layout directory:
<!doctype html>
<!--[if lt IE 7]><html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if (IE 7)&!(IEMobile)]><html class="no-js lt-ie9 lt-ie8" lang="en"><![endif]-->
<!--[if (IE 8)&!(IEMobile)]><html class="no-js lt-ie9" lang="en"><![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"><!--<![endif]-->
<head>
{% include _head.html %}
</head>
<body class="page">
{% include _browser-upgrade.html %}
{% include _navigation.html %}
{% if page.image.feature %}
<div class="image-wrap">
<img src=
{% if page.image.feature contains 'http' %}
"{{ page.image.feature }}"
{% else %}
"{{ site.url }}/images/{{ page.image.feature }}"
{% endif %}
alt="{{ page.title }} feature image">
{% if page.image.credit %}
<span class="image-credit">Photo Credit: {{ page.image.credit }}</span>
{% endif %}
</div><!-- /.image-wrap -->
{% endif %}
<div id="main" role="main">
<div class="article-author-side">
{% include _author-bio.html %}
</div>
<article class="page">
<h1>{{ page.title }}</h1>
<div class="article-wrap">
{{ content }}
{% if page.share != false %}
<hr />
{% include _social-share.html %}
{% endif %}
</div><!-- /.article-wrap -->
{% if site.owner.disqus-shortname and page.comments == true %}
<section id="disqus_thread"></section><!-- /#disqus_thread -->
{% endif %}
</article>
</div><!-- /#index -->
<div class="footer-wrap">
<footer>
{% include _footer.html %}
</footer>
</div><!-- /.footer-wrap -->
{% include _scripts.html %}
</body>
</html>
I have looked all over the web, even here in SO and I can't seem to find the issue. I did not build this template. But I thought maybe someone who had more knowledge than I do of Jekyll could be of help.
I have a fairly simple setup. I created a flask app and call index.html on route '/'.
index.html contains this:
{% extends "template.html" %}
{% block content %}
<h4 class="centeredText">
HEADER TEXT
</h4>
{% for p in paragraph %}
<p class="centeredText">
{{ p }}
</p>
{% endfor %}
{% endblock %}
My template.html is also very simple:
<html>
<link rel="stylesheet" media="screen" href = "{{ url_for('static', filename='bootstrap.min.css') }}">
<link rel="stylesheet" media="screen" href = "{{ url_for('static', filename='custom.css') }}">
<link rel="stylesheet" media="screen" href = "{{ url_for('static', filename='custom_navbar.css') }}">
<link href='http://fonts.googleapis.com/css?family=Josefin+Sans:300' rel='stylesheet' type='text/css'>
<!--<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css"> -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<head>
<h1>{% if pageType = 'home' %} HOME {% endif %}</h1>
</head>
<body> <h1>TEMPLATE</h1>
<div class="container">
{% block content %}
{% endblock %}
</div>
</body>
</html>
While testing I get this error:
expected token 'end of statement block', got '='
Edit: I missed including the variable in the header in template.html. Which I now know, to be the source of the error. Is there anyway to pass a variable to template.html, or is that not good practice?
Help!
The pageType variable should appear in your template.html so long as you pass it to the render_template function. In your case, you have a syntax error here:
{% if pageType = 'home' %}
You need to use == instead, so it should look like this:
{% if pageType == 'home' %}