I have a GitHub Pages site, and I don't want to use the raw html to develop the site yet because non developers on the team will be pushing.
The problem is that the document.title contains "by [username]" at the end. I want to remove that and just make it be the beginning text.
I already tried title: [custom title] in Jekyll and it still has the organization name at the end.
I am using the Midnight theme.
Thanks!
As based in comments, you are using the jekyll-midnight-theme, copy the default layout file of the jekyll-theme-midnight repo into _layouts directory in your Jekyll website.
Create the /_layouts directory
Copy https://github.com/pages-themes/midnight/blob/master/_layouts/default.html into /_layouts
Now edit /_layouts/default.html and adjust the <title> HTML tag, in this case removing the "by " part, so this:
<title>{{ site.title | default: site.github.repository_name }} by {{ site.github.owner_name }}</title>
replace it with:
<title>{{ site.title | default: site.github.repository_name }}</title>
Now your website won't include the "by [organization name]" at the end.
Related
I have a Jekyll blog with 1,000s of posts. Now I'm planning to use Cloudflare Image Resizing to optimize the website. To make it happen I need to modify the image tag rendered from the markdown files.
In markdown file:
Rendered image tag:
<img src="images/apple.jpg" alt="Apple">
How I want it to be:
<img src="/cdn-cgi/image/width=80,quality=75/images/apple.jpg" alt="Apple" >
Thanks in advance
The very last hook that gets called before writing posts to disk is :posts, :post_render. We can modify output at this hook to make edits to rendered posts and draft posts, regardless of whether they were originally written in Markdown or HTML:
module JekyllPluginHooks
Jekyll::Hooks.register(:posts, :post_render) do |post|
post.output.gsub!('<img src="images/', '<img src="/cdn-cgi/image/width=80,quality=75/images/')
end
end
Terminology
A Jekyll post includes drafts and blog posts.
A Jekyll document includes web pages in all collections, including drafts and blog posts.
A Jekyll page is a web page that does not belong to a collection, such as posts or drafts.
For Completeness
To modify all web pages in every collection, not just drafts and posts, use the :documents hook instead of the :posts hook in the above code example:
module JekyllPluginHooks
Jekyll::Hooks.register(:documents, :post_render) do |document|
document.output.gsub!('<img src="images/', '<img src="/cdn-cgi/image/width=80,quality=75/images/')
end
end
To also modify web pages that are not in a collection (for example, /index.html) also write:
module JekyllPluginHooks
Jekyll::Hooks.register(:pages, :post_render) do |page|
page.output.gsub!('<img src="images/', '<img src="/cdn-cgi/image/width=80,quality=75/images/')
end
end
If we want all web pages to be modified, we can rewrite the above and extract the common code to a new method called modify_output:
module JekyllPluginHooks
def modify_output
Proc.new do |webpage|
webpage.output.gsub! \
'<img src="images/', \
'<img src="/cdn-cgi/image/width=80,quality=75/images/'
end
end
module_function :modify_output
Jekyll::Hooks.register(:documents, :post_render, &modify_output)
Jekyll::Hooks.register(:pages, :post_render, &modify_output)
end
References
https://jekyllrb.com/docs/plugins/hooks/
https://www.mslinn.com/blog/2022/03/28/jekyll-plugin-template-collection.html
I am using the theme gravstrap for Grav CMS.
I want to make a single page website, like in this example :
http://gravstrap.diblas.net/gravstrap-theme-simple-page-example
I looked at the brief blog post explaining how to do it and also at the source code example on the project git repo.
I am having a hard time to undertand what to do exactly because what the blog-post says seems quite different than what I see in the example (especially how to link pages to menu items with the id thing).
I finally got it working :
Create a page with the template page_navbar_interne, create sub-pages as modular, each sub-page will be section.
By default sections will be ordered by the names of the folders. You can hardcode the order by adding this in the Frontmatter (expert mode) :
title: Single page website
published: true
slug: single-page-slug
content:
items: '#self.modular'
order:
by: default
dir: asc
custom:
- _header
- _mySection2
- _myOtherSection
To display the menu to navigate to the sections, you have to use navbar2 instead of navbar1, in the header module.
[g-navbar id="navbar2" name=navbar2 fixed=top centering=none brand_text="…" render=false]
[g-navbar-menu name=menu0 alignment="center" onepage=true attributes="class:highdensity-menu"][/g-navbar-menu]
[g-navbar-menu name=menu1 icon_type="fontawesome" alignment="right" ]
[g-link url="…" icon_type="fontawesome" icon="…"][/g-link]
…
[/g-navbar-menu]
[/g-navbar]
Well, I swear I changed no setting at all.
I setup my Jekyll blog, and it did work before.
Every time I want to write something new, I just copy and old post file, rename it to the current date and modify the content within it.
But just one day, after I push my new content to Github, I received an email, noticing me that
The page build failed for the master branch with the following error:
The value 'nil' was passed to a date-related filter that expects valid dates in /_layouts/post.html or one of its layouts. For more information, see https://help.github.com/articles/page-build-failed-date-is-not-a-valid-datetime/.
For information on troubleshooting Jekyll see:
https://help.github.com/articles/troubleshooting-jekyll-builds
First, I did not modify /_layouts/post.html. Second, I do not use date info in YAML, because Jekyll already uses the strong name requirement like YY-MM-DD-title.md.
I am just some guy who wants to write something fun but knows little about IT tech. I searched the Jekyll doc, and read the post on StackOverflow like below:
Invalid date while building on Github Pages
But as my post.html file content is different from that post, I do not know what I can do.
I built it on my Mac with bundle exec Jekyll build, it just shows the same information as the email
$ bundle exec jekyll build
Configuration file: > /Users/zhanglidong/Documents/ASyncFiles/jetorz.github.io/_config.yml
Source: /Users/zhanglidong/Documents/ASyncFiles/jetorz.github.io
Destination: > /Users/zhanglidong/Documents/ASyncFiles/jetorz.github.io/_site
Incremental build: disabled. Enable with --incremental
Generating...
Liquid Exception: Invalid Date: 'nil' is not a valid datetime. in /_layouts/post.html
ERROR: YOUR SITE COULD NOT BE BUILT:
------------------------------------
Invalid Date: 'nil' is not a valid datetime.
My GitHub repo: https://github.com/jetorz/jetorz.github.io
My jekyll blog: https://jetorz.github.io/
How can I fix it? Any one who wants to help the pity me? :(
Like answer above suggested,
I rechecked the link I provided:
Invalid date while building on Github Pages
There is and if block outside the <time> part.
I do not know much about Liquid,
But I think it worth trying.
So I add this if to my post.html like below
{% if page.date %}
<time datetime="{{ page.date | date_to_xmlschema }}" itemprop="datePublished">
{% assign date_format = site.minima.date_format | default: "%b %-d, %Y" %}
{{ page.date | date: date_format }}
</time>
{% endif %}
I do not know exactly what it is about,
but It does work :)
Now again I can post my blog.
Does anyone know how to create a link to the header of a different wiki page?
I know if I have a header ##Header name that I can link to it on that page by using (#header-name) as my link, but I want to link to that header from a different page. Is this possible?
ie. I want to have a table of contents that can link to the sub-sections of each wiki page as well as to the page itself.
Edit: I mean a way besides just using the url link
http://github.com/project/wiki/Wiki-Page#header-name
EDIT 1: So totally wrong about before, I just read up a bit more. So we have this new support as well inside of GitHub Wikis! (Relatively new.)
You can also do something like this:
[[ Link text | page_title#header_title ]]
This might work a lot better for you! TIL because of this answer here. You can see me do this with the Prerequisite link and you can see my other links work the other way. Time for me to do some updates!
EDIT 1: Still useful but definitely NOT THE ONLY WAY.
So I answered a question about this before, you should avoid absolute links on GitHub (i.e. https://github.com/user/repo_name/...)
However, a good way (and kind of the only way inside of Wikis EDIT 1: TOTALLY NOT TRUE TO BEING THE ONLY WAY) of doing what you need can be seen like this:
[Header link](/user/repository_name/wiki/page_name#title).
This is kind of the linking unfortunately that the Wiki would support. This will change your directory page based off of GitHub. You can see that it would be
https://github.com/(the linkage you want to hit)
I have actually began doing something like this in a Wiki I work on here. Inside of my Sidebar, you can see I have a Getting Started Page, and then a subsection into it is a Prerequisite heading and it will properly lead people to where they need to go. You would be able to perform this same thing on any page. It is a tad verbose, but worth it as you can easily change things around if need be. This is also case-sensitive since it will change their location so be sure that in your linkage, the page is the proper case and your heading is all lowercase.
Hope this helps!
You can link to the header by simply assigning an id to header. e.g you've "Extension" header in a page called Abc.
# <a id="extension"></a> Extensions
You have another page "Call center" and you want to go to extension in abc , you can use reference linking of markdown i.e "The [extensions][1] are handled by agents"
[1]: url-of-abc/#extension
I tested Maxwell's "good way" to link to the header of another page in Github in Edit 1 on and it works perfectly.
#[crux-ports Installation](/user/crux-ports/blob/master/README.md#installation)
markdown generate slug for the heading and convert it to id, example
# [ topic ][ color ]
will be converted to
<h1 id="topic--color" data-line="643" class="code-line">[ topic ][ color ]</h1>
Thus, to link it you can write it as [color](#topic--color).
If the destination anchor is on another page (assume filename css.md) with path relative to current markdown page, then you can write it as [color](css.md#topic--color)
Attach the slugify function from vscode
// excerpt from https://github.com/yzhang-gh/vscode-markdown/blob/908d7ba5465a203e4299f346c179211d992ef468/src/util/slugify.ts
const str = '# [ topic ][ color ]';
const slug = encodeURI(
str.trim()
.replace(/\s+/g, "-") // Replace whitespace with -
.replace(/[\]\[\!\'\#\$\%\&\'\(\)\*\+\,\.\/\:\;\<\=\>\?\#\\\^\_\{\|\}\~\`。，、；：？！…—·ˉ¨‘’“”々～‖∶＂＇｀｜〃〔〕〈〉《》「」『』．〖〗【】（）［］｛｝]/g, "") // Remove known punctuators
.replace(/^\-+/, "") // Remove leading -
.replace(/\-+$/, "") // Remove trailing -
);
console.log(slug) // "topic--color"
I'm probably missing something simple but I have no way to test Jekyll locally.
I'm using GitHub pages to render Jekyll, for starters I only want to render markdown content on the main index.html from one markdown page.
The structure is:
Index.html
---
layout: default
---
_layouts
- default.html
//html stuff..
<section>
{{page.content}}
</section>
In root folder I have a page called content.md that I wish to render for {{page.content}} the layout renders but the liquid tags section is blank.
How do I render content.md?
Example: https://github.com/wycks/wordpress-gears-jekyll
There are a few things going on here.
In your _layouts/default.html file (and any of the other _layouts directory files for that matter), instead of:
{{ page.content }}
you need to use:
{{ content }}
Jekyll only lets you includes files from a site root level _includes directory. So, you need to move your content.md from the root to that directory (making it if it doesn't already exist).
Finally, you need to actually make the call to the include file from your index.html file. This can be done by changing the content of your index.html file to:
---
layout: default
---
{% include content.md %}
That will setup the behavior you are looking for.
I'd point out two other things:
You may find that changing the extension of your index file from .html to .md works better. An important note though: you need to use .html if you want pagination. Per the Jekyll Pagination documentation, that feature only works when the file is named index.html.
If all you are doing in your index file is calling an include that only resides on that page, you might be just as well off simply putting the content directly in the index file.
include only allows you to include files directly under _includes/. There is is also include_relative which allows you to use paths and include from other places. The include has to be relative to the given file however:
{% include_relative somedir/footer.html %}
There is one issue with either include method I can't resolve: If the file you include has front matter Jekyll won't strip it out. So you can't use front matter to store include specific meta data - like say "title". Of course you can use variables - {% assign title = "My Title" %} but it's not equivalent, because if you want the thing your including to be part of a collection or rendered independently you have to have a front matter.
I believe it is just
{{ content }}
good sir.
ref