How do I correctly configure the menu links of my gh pages after redirecting it to the Google domain? - cross-domain

After having successfully waited for the DNS check and setting up HTTPS requests, the redirection works as expected except for the menu in the jekyll website.
The links on the menu still display user.github.io/section1, user.github.io/section2, etc and not the domain/section1, domain/section2. If you were to copy the link the user.github.io/sectionx is copied.
So clicking on any section of the menu bar, including the webpage name or landing page, a new tab is opened.
The reason to it is treated as an external link which I defaulted as opening in a new window/tab.
So the question now is, how to have the relative part respected without the base user.github.io but the google domain name?
The navigation wrapper under the _includes folder as the _navigation.html file.
<div class="navigation-wrapper">
<div class="site-name">
{{ site.title }}
</div><!-- /.site-name -->
<div class="top-navigation">
<nav role="navigation" id="site-nav" class="nav">
<ul>
{% for link in site.links %}
<li><a href="{% if link.external %}{{ link.url }}{% else %}{{ site.url }}{{ link.url }}{% endif %}" {% if link.external %}target="_blank"{% endif %}>{{ link.title }}</a></li>
{% endfor %}
</ul>
</nav>
</div><!-- /.top-navigation -->
</div><!-- /.navigation-wrapper -->
The YAML config file is pretty standard
title: webpage name
description:
url: //user.github.io
links:
- title: Section
url: /section1/
- title: Section Prime
url: /section2/
etc
Starting to get tunnel vision. What am I missing?

From what I get is you have a site hosted on GH pages accessible from user.github.io and you bought a custom domain from Google Domains. The redirection is setup successfully, but the links on the website's menu are still using user.github.io.
This is because:
You did not update the url field in the _config.yml file:
# ...
url: //user.github.io # Should be changed to https://yourdomain.extension
# ...
The liquid code in _navigation.html is incorrect:
<nav role="navigation" id="site-nav" class="nav">
<ul>
{% for link in site.links %}
<li><a href="{% if link.external %}{{ link.url }}{% else %}{{ site.url }}{{ link.url }}{% endif %}" {% if link.external %}target="_blank"{% endif %}>{{ link.title }}</a></li>
{% endfor %}
</ul>
</nav>
In the YAML config's links block, for each element there is no external field defined. So the if block is useless. The else block is referring to site.url which is again the user.github.io one.
Solution:
Add external field to each link item in YAML:
# ...
links:
- title: Section
url: /section1/
external: true # this
- title: Section Prime
url: /section2/
external: true # this
# ...
Or
Update url in _config.yml to new domain. This way you can cut out the unnecessary if/else logic.
In my opinion, the 2nd way is better. Your redirection will still work the same, but there will be no reference of user.github.io in your code, which is ideal.

Related

How can I convert this TPL or PHP condition to a valid condition?

I would like to add a condition to my twig file, but I can only find code examples for TPL or PHP. All my attempts to translate this into twig syntax have so far been unsuccessful. This may also be due to the fact that these examples are no longer up-to-date. Unfortunately, there is little current information about the open source vanilla forum. But as long as I don't even know if my twig syntax should actually work, I can't say that.
Can someone please help me and tell me if my twig syntax is correct?
Thank you for help!
This is what the relevant part of my twig looks like (I only want to display the main panel for Signed In users):
<div class="Frame-details">
{% if not isHomepage %}
<div class="Frame-row">
<nav class="BreadcrumbsBox" aria-label={{ t("Breadcrumb") }}>
{{ renderBreadcrumbs() }}
</nav>
</div>
{% endif %}
<div class="Frame-row">
<!-- Main Content -->
<section class="Content MainContent">
{{ renderControllerAsset("Content") }}
</section>
<!-- Main Content END -->
<!-- Main Panel -->
{% if UserSignedIn %}
<div class="Panel Panel-main">
{{ renderControllerAsset("Panel") }}
</div>
{% endif %}
<!-- Main Panel END -->
Here are the examples I've found so far:
For TPL is the following example:
{if $User.SignedIn}
Do some coding like show the Panel Asset
{/if}
For PHP is the following example:
$Session = Gdn::Session();
if ($Session->IsValid())
{
Show the Panel Asset
} else
{
Show only the Guest Box asset

What would cause the same Django template include block to behave differently twice on the same page?

I'm trying to include a simple pagination template into a template that lists blog posts, but it gets output without getting interpreted, as in, I see the double curly brace enclosed tag as text in the resultant webpage (see image below).
Strangely, when I also paste same block higher in the page, and it gets interpreted fine. The same include, twice on the same page, different behavior!
Between the two, I iterate over the same object that gets passed to the pagination template, so this is probably something that I don't understand about the state of that object? Or Django's rendering process.
{% extends "blog/base.html" %}
{% block title %}My blog site thing{% endblock %}
{% block content %}
<h1>Blog site</h1>
{% include 'pagination.html' with page_object=posts %}
{% for post in posts %}
<h2>{{ post.title }}</h2>
<p class="date">Published {{post.publish}} by {{post.author}}</p>
{{post.body|truncatewords:5|linebreaks}}
{% endfor %}
{% include 'pagination.html' with page_object=posts %}
{% endblock %}
Pagination.html
<div class="pagination">
<span class="step-links">
{% if page_object.has_previous %}
Previous
{% endif %}
<span class="current">
Page {{ page_object.number }} of {{ page_object.paginator.num_pages }}.
</span>
{% if page_object.has_next %}
Next
{% endif %}
</span>
</div>
views.py for this app
from django.shortcuts import render, get_object_or_404
from .models import Post
from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger
def post_list(request):
object_list = Post.published.all()
paginator = Paginator(object_list, 3)
page = request.GET.get('page')
try:
posts = paginator.page(page)
except PageNotAnInteger:
posts = paginator.page(1)
except EmptyPage:
posts = paginator.page(paginator.num_pages)
return render(request, 'blog/post/list.html', {'posts':posts})
def post_detail(request, year, month, day, post):
post = get_object_or_404(Post, slug=post, status='published',publish__year=year,publish__month=month, publish__day=day)
return render(request, 'blog/post/detail.html', {'post':post})
Here's what the resultant page looks like:
Here's the resultant html (I've added an extra line around the offending output to call it out)
<!DOCTYPE html>
<html>
<head>
<title>My blog site thing</title>
<link href="/static/css/blog.css" rel="stylesheet">
</head>
</html>
<body>
<div id="content">
<h1>Blog site</h1>
<div class="pagination">
<span class="step-links">
<span class="current">
Page 1 of 2.
</span>
Next
</span>
</div>
<h2>Another glorious post</h2>
<p class="date">Published March 2, 2022, 9:26 p.m. by admin</p>
<p>Lorem ipsum text Lorem ipsum …</p>
<h2>Classy post</h2>
<p class="date">Published March 2, 2022, 9:25 p.m. by admin</p>
<p>This is the way</p>
<h2>Another post</h2>
<p class="date">Published March 1, 2022, 7:26 a.m. by admin</p>
<p>Xyz</p>
{% include 'pagination.html' with page_object=posts %}
</div>
<div id="sidebar">
<h2>My blog</h2>
<p>This is my blog.</p>
</div>
</body>
I've even gone back and copy-pasted the actual code from the book I'm following (Django 3 by example, by Antonio Mele) and it's identical!
To any kind soul who has read this far, what am I missing?
Ok, so I just understood what was going on, and sharing in case it's useful to anyone else.
My IDE was mangling the formatting of the template file on save.
So the first include was a perfect little
{% include 'pagination.html' with page=posts %}
The second one ended up looking like
{% include
'pagination.html' with page=posts %}
When I turned off the auto-formatting and fixed the whitespace, it rendered fine.
So my big learning – probably obvious to many – is that whitespace matters in django template tags!.

Out putting RAW ACF values in twig/timber unto page header for SEO purposes

So, from ACF I have created my own SEO fields in my custom WP theme, so I don't have to rely on a plugin, and I want to have the default values already filled out, so we don't always have be doing that unless for something specific - how do I out put those unto my page and insert them in the header at the same time? I have tried {{post.meta_description|raw}} and {{ function('wp_head') }} timber but it just prints it on the page, what am I missing?
Another great {{ post.tool_brand }} {{ post.tool.type}}
for sale, {{ post.power_type }} of power with a
competitive price {{ post. tool_price }}!
{% extends "base.twig" %}
{% block content %}
<div class="container my-4">
<head>
{{post.meta_description|raw}}
{{ function('wp_head') }}
</head>
</div>
{% endblock %}
This here seems to do exactly what I wanted it to do: {{ include(template_from_string(post.meta_description)) }}
ie: <meta name="description" content="{{ include(template_from_string(post.meta_description)) }}">

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.

Jekyll paginate blog as subdirectory

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 %}

Resources