Before we start, I do know custom hooks are not executed by Github pages, I'm suffering this issue locally(bundle exec jekyll serve).
I manage my own Github pages, and I found a great post about Jekyll hook that I wanted to try it out by myself.
I followed the instruction, first created _plugins folder at the root of my repo,
and created my own *.rb file.
But my hook is not executed at all!
I even downloaded the source file of the example blog, but I couldn't notice any difference that might cause this issue.
FYI, local serve of the example blog worked well with all the hooks executed.
If you can help me on this issue, it would be very much appreciated. Here is the WiP commit of my blog.
Thank you.
Related
I'm a total newbie when it comes to Jekyll, and have encountered a big problem. I'm probably doing something wrong or missing something, but what?
I find it very confusing trying to install the "Agency Jekyll Theme" which is the first theme I'm trying out. Mostly because there are several ways to do it, the commands don't add up and there is a lot of "you can do this" embedded into what you actually have to do to install it.
These are the guides I've been following:
https://jekyllrb.com/docs/step-by-step/01-setup/
https://www.rubydoc.info/gems/jekyll-agency/1.2.0
http://jekyllthemes.org/themes/agency/
Basically, I've tried all the 3 possible ways to install it without success.
I'm running on Windows.
My problem:
jekyll serve (ran in my site folder) creates a _site folder and content in the subfolders css, img and js. Nothing else is created, not index.html, and other files needed directly under _site folder.
In my site root folder, there are only _config.yml and Gemfile, after completing the initial steps.
There seems to be a problem with actually downloading the full theme into my root folder. When I manually download the agency-jekyll-theme-starter-master.zip and extract the entire content in my root site folder, there is index.html, _data folder, etc. However, in the assets folder, there is only an img folder.
As a result, when I open http://localhost:4000/agency-jekyll-theme-starter/ in a browser there is only a directory listing with the folder "assets".
Where do the css folder and its content come from that generates under _site?
My workaround:
I run jekyll build so that the site in its entirety is placed under _site folder. However, with this process, the whole point of using Jekyll is lost because I have to edit the generated HTML files, CSS files, etc. To change simple stuff like renaming the page/navigation "Services" to another word I have to go through the HTML file and replace all occurrences
My successful attempt to reproduce your issue:
I tried this method from http://jekyllthemes.org/themes/agency/
Using the Starter Template
This is the fastest and easiest way to get up and running on GitHub Pages. Simply generate your own repository by clicking here, then replace the sample content with your own and configure for your needs.
The starter template (that is also linked on the page above) allowed me to start a code space and commit the repo content into my new branch.
I could reproduce your problem, there were no styles when running jekyll serve.
The reason for the issue:
The problem is the baseurl in the _config.yml file. It points to a relative path that does not exist in your repository. Your baseurl / path is "", because you run your server from the root folder, most probably both locally and later remotely using GitHub pages.
The solution for the issue:
In the _config.yml file in your repo, change this one line
from
baseurl: "/agency-jekyll-theme-starter" # the subpath of your site, e.g. /blog
to
baseurl: "" # the subpath of your site, e.g. /blog
Check out https://github.com/cadamini/jekyll-agency-test if you like.
I hope this was understandable and helpful and that you can solve your issue with these instructions. Don't hesitate to comment for further clarification.
I currently have the following Git Repository:
https://github.com/SebastianGode/ansible-collection-cloud/tree/gh-pages
And the GitHub Page link:
https://sebastiangode.github.io/ansible-collection-cloud/
The problem is that GitHub Pages will only solve the index.html and will throw an 404 for all required css and image stuff:
As the documentation is getting automatically generated by a travis-ci pipeline it's probably impossible to change paths, but as it works when hosted it locally it also should work on GitHub pages.
Is there any solution to this problem?
I fixed it.
GitHub has Jekyll running behind it which will mess up special paths (here the underscore paths). You can disable jekyll by just creating a .nojekyll file in the root directory of the branch. If you use travis-CI for something like that and run a tox script just call the command touch {toxinidir}/.nojekyll
This will result in a working website for me.
I run a small blog based on Jekyll in GitHub Pages. Trying to fix an error at rebuilding it, I deleted the _site folder, which made all posts disappear from it.
It's rebuilding the site now, great, but it shows no posts at all — even that all of them are in _posts folder.
What am I missing here?
For reference: https://github.com/rghedin/rghedin.github.io
Thanks!
_site folder contains the generated files, it is not necessary to have them in the repo as github pages will build it.
If you deleted it and now there are no posts showing at the homepage, then there should be another error, try to run a local instance to debug it or wait for github pages to rebuild it and show the latest version, it could take some minutes to show the latest changes online.
I am writing draft blog posts using hexo. I am running the hexo server as follows:
hexo server --draft
This watches for changes in the draft folder and generates the draft posts which can be viewed at http://0.0.0.0:4000
The problem is I can't work out how to use live-reload while writing drafts.
With livereload I call
live-reload --port 9091 public/
And use use the javascript implementation with the browser
<script type="text/javascript" src="//localhost:9091"></script>
I can see why this doesn't work, live-reload is looking for changes to the public folder. With the server running in draft mode, I don't know what folder the html generated drafts are being stored in. I've searched my project structure and can't seem to see anything obvious. Any ideas?
Hexo can offer live-reload-like functionality via the'Browsersync-based' plugin, 'hexo-browsersync'.
There is actually also a hexo-livereload plugin, but the net, and hexo-browsersync's NPMJS rating, seem to favour the Browsersync Hexo plugin.
Christopher Martin's blog post 'Getting Started with the Hexo Blogging Framework', outlines the plugin's installation and usage, as well as many other helpful tips:
To install the hexo-browsersync plugin:
$ npm install hexo-browsersync --save
$ hexo server --draft --open #restart the server
This might possibly suit the OP's original question better than the accepted answer.
This is how I normally do this sort of thing:
hexo generate --draft --watch & live-server --port=4000 public
This generates the site in the public folder and watches for changes, whilst also serving said public folder with auto-updates.
Not exactly answering the specific question but maybe someone will find it useful.
Note: You will need to have live-server and hexo-cli installed globally, or locally if running via npm scripts.
hexo server serves the source version of the post not the public version. If you set livereload to watch the source folder livereload will work. I suggest setting livereload to use a 1 second or so delay before processing so the on the fly source generation to occur before reload is attempted.
Looking to the --draft option implementation at Github shows that it only extends the post processor to the _draft folder. So the place where it puts draft rendered files is the same it puts published posts.
However, hexo server does not save published posts in public directory as might be suggested by the question; public directory is populated by hexo generate command only. In fact hexo server does not save temporary files as it renders them on the fly.
I think live-reload will not work this way.
When I run jekyll serve locally, I get the following ouput
local site
Then when I push to Github and host on Github pages, the sidebar links don't work the same way
github pages site
I'm running jekyll 3.1.1 (latest version) while Github Pages depends on 3.0.3. Do I need to uninstall jekyll and install the older version? Or is there something I can do to make my local and Github pages match?
The repo on github is available at (sorry can only post 2 links)
github.com/samarthbhaskar/samarthbhaskar.github.io
With help from Github, I was able to solve this.
There was a whitespace issue in the front matter of my index.md file for the page I was trying to create. I erased and retyped the front matter as:
---
layout: page
title: Movie Reviews
---
... and that did the trick! Hope this answer helps someone else trying to solve the same issue. Now to figure out what might be going on with my Sublime Text 3 settings to cause white space issues.
You need to serve Jekyll with bundler, so it will reproduce the same environment as GitHub Pages does.
Follow the steps I described on this answer
And you should be ok.
Let me know how it goes for you ok?
Hope to have helped!
Additionally, you could force your push to the remote repo on github with a git command in order to override any inconsistencies between the local and remote repositories. But glad this worked out for you!
git push -f