clayh53 / tufte-jekyll

Minimal Jekyll blog styled to resemble the look and layout of Edward Tufte's books
MIT License
620 stars 206 forks source link

sidenote / newthought liquid tags cause problems on github pages? #69

Open jannieuwenhuis opened 4 years ago

jannieuwenhuis commented 4 years ago

Hi, this jekyll theme looks amazing when I run it locally, however on github pages a blog with this theme won't compile for me due to recurrent issues with sidenotes and newthought tags in liquid in sample posts but also in the index file.

clayh53 commented 4 years ago

Yes - I sort of get into that at the bottom of the README on the repository. The deal is that Github won’t compile executable code (like the Ruby add-ins this theme uses). So you essentially build the project on your computer, then push the site (in the _site folder locally) to a separate branch on Github called gh-pages. I have included a rakefile that automates this.

A couple of gotchas:

You must create a gh-pages branch for your repository. That is the branch your actual working site will sit in. If you have a registered name that has DNS records, you will need a CNAME file in your repo with that name in it. The working copy will be in the master branch (the default branch), and the gh-pages will be what Github serves up to the world.

for the links to work, set your baseurl in _config.yml to your repository name for this project. For instance, perhaps your repo name is jan-nieuwenhuis. Then when you build and test locally, use a command line switch to change the baseurl back to nothing like this:

bundle exec jekyll serve -w --baseurl=“”

this will make the links work properly locally.

When your site is ready, push all the completed work to the master branch:

on your computer, type in this:

git add .
git commit -m “My changes for my site or whatever”
git push origin master

When it has finished updating the remote master branch on github, type rake in the local terminal window. It will then copy all your changes back down to your local computer, compile the site, move the _site directory somewhere safe, switch the local branch to gh-pages, delete everything, then push the contents of the _site folder to the gh-pages branch on Github. It will then switch back to the master branch, and copy all the files back to your local machine.

After this is done, you have a ‘jan-nieuwenhuis’ github repo with two branches: the master which contains all your work files, and the gh-pages branch, which contains on the compiled static files that you built locally and pushed up to github.

A little complicated, but works well.

On 2020-04-18, at 13:59 :13, Jan Nieuwenhuis notifications@github.com wrote:

Hi, this jekyll theme looks amazing when I run it locally, however on github pages a blog with this theme won't compile for me due to recurrent issues with sidenotes and newthought tags in liquid in sample posts but also in the index file.

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/clayh53/tufte-jekyll/issues/69, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAXNG5QURBRV3RETGJKWJG3RNHS7DANCNFSM4MLOGHNQ.

shoaibkhanz commented 4 years ago

Thansk a lot for this, I was able to deploy it. However, there is one problem I get into. i.e. disqus comments. When I publish the site locally I can see that the html produces disqus code and I see my disqus comments section.

The problem is that when rake automated script produces the site (ready to be pushed to gh-pages) it ignores the disqus code and I am not sure why that happens.

I have essentially used the below code and its stored in _includes/disqus_comments.html

{% if page.comments != false and jekyll.environment == "production" %}

  <div id="disqus_thread"></div>
  <script>
    var disqus_config = function () {
      this.page.url = '{{ page.url | absolute_url }}';
      this.page.identifier = '{{  site.disqus.shortname  }}';
    };
    (function() {
      var d = document, s = d.createElement('script');
      s.src = 'https://{{ site.disqus.shortname }}.disqus.com/embed.js';
      s.setAttribute('data-timestamp', +new Date());
      (d.head || d.body).appendChild(s);
    })();
  </script>
  <noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript" rel="nofollow">comments powered by Disqus.</a></noscript>
{% endif %}

next I mention the following inside the post.html

{% if site.disqus.shortname %}
  {% include disqus_comments.html %}
{% endif %}
clayh53 commented 4 years ago

I looked at the rakefile and I can't see anything immediately obvious that would cause this to happen. It makes me wonder if it is happening in the build stage. Your template has an 'and' logic in the include. Is it possible that one or both of the conditions are not being met when it is being built for production? Perhaps the jekyll.environment variable is not being set during the build step for the rakefile. How are you building it locally? Are you setting the environment variable on the command line with the jekyll command? If that is the case, maybe editing the Rakefile to add that command line switch to the build task. I'm just spitballing here.

shoaibkhanz commented 4 years ago

yeah that was it. , I went from this {% if page.comments != false and jekyll.environment == "production" %} to {% if page.comments != false %}

Thanks a lot!

knautschzone commented 3 years ago

Thanks a lot for this awesome theme! Unfortunaly I'm unable to get it working on github-pages. I'm running into the same error jannieuwenheuis mentioned. The building-process allways fails because of the unknown licquid-tags within the .md files even when following your instructions using rake. Locally there are no problems at all. Any more advice?

clayh53 commented 3 years ago

Fundamentally, what the script is supposed to do is build the site locally and push only the site to a specific branch named gh-pages. The source will live on the master branch of the repository. Normally, github will deploy a site as long as there are no special Liquid tags being built. In this this theme, however, there are, and the site must be served from the special branch named gh-pages.

Current docs for github about some of the issues are here: https://docs.github.com/en/free-pro-team@latest/github/working-with-github-pages/creating-a-github-pages-site-with-jekyll https://docs.github.com/en/free-pro-team@latest/github/working-with-github-pages/creating-a-github-pages-site-with-jekyll

and particularly here : https://docs.github.com/en/free-pro-team@latest/github/working-with-github-pages/about-github-pages-and-jekyll https://docs.github.com/en/free-pro-team@latest/github/working-with-github-pages/about-github-pages-and-jekyll

I suspect that the problem is the branch it is attempting to push to. Try logging onto github and manually creating a gh-pages branch for you repository.

Are you able to push your entire source to the master branch?

On 2021-01-01, at 13:49 :41, knautschzone notifications@github.com wrote:

Thanks a lot for this awesome theme! Unfortunaly I'm unable to get it working on github-pages. I'm running into the same error jannieuwenheuis mentioned. The building-process allways fails because of the unknown licquid-tags within the .md files even when following your instructions using rake. Locally there are no problems at all. Any more advice?

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/clayh53/tufte-jekyll/issues/69#issuecomment-753366307, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAXNG5RAQBB4JR6N6JRN3BTSXYKMLANCNFSM4MLOGHNQ.

knautschzone commented 3 years ago

Thanks for your fast response! Pushing to master works fine for me. I just cloned your repository, using "bundle exec jekyll build/serve" works perfect and "rake" also creates the gh-branch, but hosting on GitHub Pages (gh-pages/root) runs into the described error. The gh-branch however does not include any _site-folder (the same is true for the master-branch because of the gitignore-file I'm assuming). Does this help?

clayh53 commented 3 years ago

Does it look like it copied your site to the gh-pages branch? Here is a what my gh-pages branch looks like on github for this repo:

Notice that I have selected the gh-pages branch , not the master branch!

Also, for the same repo, go into ’settings’ (the gear icon on the upper right) and scroll down to the Github Pages sedtion and make sure that it is using the gh-pages branch to serve from:

On 2021-01-01, at 15:02 :21, knautschzone notifications@github.com wrote:

Thanks for your fast response! Pushing to master works fine for me. I just cloned your repository, using "bundle exec jekyll build/serve" works perfect and "rake" also creates the gh-branch, but hosting on GitHub Pages (gh-pages/root) runs into the described error. The gh-branch however does not include any _site-folder (the same is true for the master-branch because of the gitignore-file I'm assuming). Does this help?

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/clayh53/tufte-jekyll/issues/69#issuecomment-753375187, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAXNG5UYTWQNVI6IFXAZY7TSXYS43ANCNFSM4MLOGHNQ.

knautschzone commented 3 years ago

Thanks again for the fast answer! Just looked at your repo and realized: My gh-pages branch (which was created by the simple ""rake"" command) looks exactly like the master-branch, while your is identical to what is in the _site-folder of when I build the page locally. This seems to be the problem but I don't know how to fix it.

clayh53 commented 3 years ago

Are you running this command from inside your local project folder : rake UploadToGithub.Rakefile?

On 2021-01-01, at 15:32 :06, knautschzone notifications@github.com wrote:

Thanks again for the fast answer! Just looked at your repo and realized: My gh-pages branch (which was created by the simple ""rake"" command) looks exactly like the master-branch, while your is identical to what is in the _site-folder of when I build the page locally. This seems to be the problem but I don't know how to fix it.

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/clayh53/tufte-jekyll/issues/69#issuecomment-753378842, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAXNG5SIU2DMMX5ISWGMZU3SXYWMNANCNFSM4MLOGHNQ.

knautschzone commented 3 years ago

The command you gave ""rake UploadToGithub.Rakefile"" seems to do nothing in my setup. I was running just ""rake"" before which created gh-branch and reached "yolo", switched branches (from master to gh-pages and back) and once printed "fatal: paths 'updated\ ...' with -a does not make sense".

Edit: small update: when I manually push the content of the _site folder to gh-pages it works. It seems to be a problem with the rake-file not working properly on my machine. Thanks again for your patience and help!

clayh53 commented 3 years ago

Hmmm. This sort of stuff drives me nuts. I am not a superuser of git, but it seems like something is amiss with the rakefile when it creates the temporary paths. The frustrating thing for me is that it works on my iMac without a hitch. Are you using a mac, or linux or windows?

One thing I know should work is if you do what the Rakefile is doing, but do it step-by-step manually - build the site, copy _site contents to a temporary place, switch branches to gh-pages, delete everything, copy the contents of the _site temporary folder back to the main folder, then do a commit and push it to the gh-pages branch on github. You could also just manually upload the contents of the _site folder to the gh-pages branch on github. That might actually be the easiest workaround.

I am only about half proficient with rakefiles, but if you look at what it is supposed to do, you can sort of follow the logic:

system mv _site/* #{tmp}”   #<- this moves your built site to a temporary spot
system "git checkout -B gh-pages” #<- this checks out the gh-pages branch 
system "rm -rf *” #<- this nukes everything
system "mv #{tmp}/* .” #<-this moves the site back to the current branch (github pages)
message = "Site updated at #{Time.now.utc}"
system "git add .” #<- this adds the newly built site to the commit
system "git commit -am #{message.shellescape}” #<- this makes the commit
system "git push origin gh-pages —force” #<- this pushes it to the gh-pages branch on github
system "git checkout master” #<- this checks out all your source files and switches back to the master branch

On 2021-01-01, at 16:03 :17, knautschzone notifications@github.com wrote:

The command you gave ""rake UploadToGithub.Rakefile"" seems to do nothing in my setup. I was running just ""rake"" before which created gh-branch and reached "yolo", switched branches (from master to gh-pages and back) and once printed "fatal: paths 'updated\ ...' with -a does not make sense".

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/clayh53/tufte-jekyll/issues/69#issuecomment-753382135, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAXNG5XL5OTCM4JSUDOVQGLSXY2BLANCNFSM4MLOGHNQ.

knautschzone commented 3 years ago

Thanks for the commenting of the rakefile. Working on windows here. Maybe I have to write a small script myself, but for now seeing it work after manually pushing the site-folder is fine. Thanks again for your support. I appreciate the patience with a rookie like me!

clayh53 commented 3 years ago

Glad you were able to make it work. I’m guessing it has something to do with some OS difference.

Sent from my iPad

On Jan 1, 2021, at 5:48 PM, knautschzone notifications@github.com wrote:

 Thanks for the commenting of the rakefile. Working on windows here. Maybe I have to write a small script myself, but for now seeing it work after manually pushing the site-folder is fine. Thanks again for your support. I appreciate the patience with a rookie like me!

— You are receiving this because you commented. Reply to this email directly, view it on GitHub, or unsubscribe.

joshjacobson commented 3 years ago

From above:

for the links to work, set your baseurl in _config.yml to your repository name for this project. For instance, perhaps your repo name is jan-nieuwenhuis. Then when you build and test locally, use a command line switch to change the baseurl back to nothing like this:

From ReadMe:

Set this to your own project name if you're going to serve your site from Github Pages. Be sure to include the leading slash, and no trailing slash. For example: /my-project-name

For a full explanation of setting your baseurl to work with Github Pages, see the Project Page URL Structure section of the Jekyll documentation.

To serve from anywhere else besides Github Pages, use a blank baseurl in your _config.yml file:

I'm serving from Github Pages, and following these instructions failed for me. Using a blank baseurl is what succeeded for me (both for index.html successfully looking for CSS in the right location and top nav).

Saptam04 commented 2 years ago

Thanks for the commenting of the rakefile. Working on windows here. Maybe I have to write a small script myself, but for now seeing it work after manually pushing the site-folder is fine. Thanks again for your support. I appreciate the patience with a rookie like me!

Faced the same issue. After wasting a whole day, and visiting a couple hundred stackoverflow posts what I realised is the following: Windows sucks big time. None of the commands in the Rakefile worked (strangely, none of them raised an error or warning). To make the script work you need to make a couple of non-trivial changes. First, Windows cares way too much about quotes in the directory path, so need to be careful about it (the git commit -am #{message.shellescape} line is the cause of that strange fatal: paths ... with -a does not make sense error). Second, since the Unix commands don't work, we need to substitute them with Windows' own commands. Following is the content of the Rakefile after addressing the issues.

require 'rubygems'
require 'rake'
require 'rdoc'
require 'date'
require 'yaml'
require 'tmpdir'
require 'jekyll'

desc "Generate blog files"
task :generate do
  Jekyll::Site.new(Jekyll.configuration({
    "source"      => ".",
    "destination" => "_site"
  })).process
end

desc "Generate and publish blog to gh-pages"
task :publish => [:generate] do
  Dir.mktmpdir do |tmp|
    system "robocopy _site #{tmp} /E /MOVE > nul"
    system "git checkout -B gh-pages"
    system "git rm -rq *"
    system "robocopy #{tmp} . /E /MOVE > nul"
    message = "Site updated at #{Time.now.utc}"
    system "git add ."
    system "git commit -am \"#{message}\""
    system "git push origin gh-pages --force"
    system "git checkout master"
    system "echo yolo"
  end
end

task :default => :publish

Whew! Hope this helps.