How to make jekyll serve --watch rebuild when an included file is changed? - jekyll

So the question is pretty much explained in the title. Suppose that I have the following directory structure:
./index.html
./_includes/include1
And that the content of index.html is:
<!DOCTYPE html>
<html>
<head>
<title>Test page for inclusions</title>
</head>
<body>
{% include include1 %}
</body>
</html>
Is there any way to get the index.html rebuilt when the include1 file is changed?
Edit: Just to clarify, index.html is regenerated when index.html is changed, I want to know how to also get the page regenerated when something that it depends on changes, in this case the include1 file from the _includes/ directory.
And, in case it is important:
$ jekyll --version
jekyll 1.0.3
$ ruby --version
ruby 2.0.0p247 (2013-06-27 revision 41674) [x86_64-darwin12.4.0]
My _config.yml:
$ cat _config.yml
timezone: Europe/Amsterdam
That is, for the most part I am just running with the defaults, which seems to work, since it knows where to find the include1 file.

Using the --watch command should automatically update your site when anything in your directory changes. It even updates the server when you create a new file.
Make sure that you're in your project's directory not im your _site directory. Your projetc dir should look like this:
_layouts
_includes
_site
_posts
.. Anything else
If for some reason the --watch command doesn't updatethe server you can always do the jekyll build command on your project directory.
What platform with what version of ruby are you using?

Related

Hugo site, deployed to public/ directory in html, gives weird results

I have a Hugo site with lots of folders and subfolders, containing both _index.md files and many others. It uses the docsy theme.
Running hugo server displays the site correctly in the browser at localhost:1313
When I run hugo or hugo -D to get the same pages as HTML files on the disk, and I get
a set of folders...
... containing only index.html and index.xml files,
but no other files. All the other files are missing.
links look like the raw .md file (example: [VPAT](https://docs.axway.com/bundle/AccessibilityVPATS_allOS_en_HTML5/page/Content/accessibility.htm)
The index.html files are unstyled, unlike the pages generated by the hugo server command.
I don't see how to use the index.xml files.
Here is an example of the files and folders produced by the hugo command:
public/
index.html
index.xml
docs/
index.html
index.xml
admin_intro/
index.html
index.xml
troubleshooting/
index.html
index.xml
...
Here is what the .md file structure looks like
content/
en/
_index.html
search.md
docs/
_index.md
admin_intro/
_index.md
amdin_page_1.md
amdin_page_2.md
amdin_page_3.md
troubleshooting/
_index.md
ts_page_1.md
ts_page_2.md
ts_page_3.md
...
It looks like maybe your postcss process isn't running correctly. I had this problem after upgrading Hugo and Docsy
The postcss process isn't used in the dev mod (hugo server) but it is in production (hugo) so you will unfortunately get different results.
Try running hugo locally with the --debug flag and see if any errors show up.

Is there a directory that will place items in the root of _site on build?

I have a bunch of static files (basically favicons, apple-site-icons, etc) that I want to be at the root of _site when it's built. Currently they're just sitting at the root of my main code folder (along with _posts, _scss, _layouts, etc). It builds fine but it would be nice to move them into a subdirectory so the main directory isn't cluttered up (it's an OCD thing).
Is there any folder where I can put these items so they automatically copy to the root of _site when I build? I know I can write a script to do this and trigger it after the build, and there's probably an extension I could lean on, but I'm looking for a solution that just automatically moves them when I run jekyll build for simplicity.
NBD if I can't do it, just curious because I'm kind of a neat freak.
Thanks!
Jekyll allows you to do exactly that using permalinks.
Permalinks are the output path for your pages, posts, or collections. They allow you to structure the directories of your source code different from the directories in your output.
A simple example extracted from the official page is a case where you have /my-pages/about-me.html with the front matter as follows:
---
permalink: /about/
---
This way you specify the output url. In this example, you could access it in local with localhost:4000/about/
The source option. You can specify this in your _config.yml or as a command line option (https://jekyllrb.com/docs/configuration/options/). How you set this has slightly different requirements/implications.
First, move everything that belongs to the Jekyll site into a folder (e.g. "src").
Then set one of these up (assuming you have a Gemfile):
Command line option with root Gemfile:
Keep Gemfile in the root folder
Run bundle install
Run bundle exec jekyll serve --source src
Command line option with nested Gemfile:
Run BUNDLE_GEMFILE=src/Gemfile bundle install
Run BUNDLE_GEMFILE=src/Gemfile bundle exec jekyll serve --source src
Config file option:
Keep Gemfile and _config.yml in the root folder
Add source: src somewhere in your _config.yml
Run bundle install
Run bundle exec jekyll serve
Each solution here might work better with other external services building your site. There are likely other ways to set this up, but this should get you started.

I can't edit Jekyll index.html

I'm trying to change /_site/about in index.html. When I edit the index.html and start jekyll, index.html back to it's original content.
Sorry for my english.Thank you very much for your help.
You don't edit files inside the /_site directory. When jekyll builds the site, it overwrites any and all files in that directory.
Edit the index.html file in the /about/ directory outside of the /_site/ folder.
Run the command jekyll build to apply these changes to the generated site.
Or use jekyll serve to automatically host the content locally and update the content when a change is made.
There's no need to edit Index.html file as it is generated from the markdown file your provided which as we all know is called index.md, whenever you change that file and run jekyll build it re-generates the index.html file hence if you edit once you would have to do the same again when you change index.md file.
So directly write html / markdown in index.md file in your jekyll directory.
Best,
Daksh

Jekyll Wiping My Directory

I followed the instructions for Jekyll Quickstart. Whenever I make changes in my site's directory, the changes get wiped somehow. For example, I modified some of the code in index.html, only to have it return to Jekyll's default. I also created a subdirectory in _site called 'otherservices' with an index.html. That gets wiped as well. Any idea why this may be happening? I can't really use Jekyll if it keeps wiping.
Jekyll is a static website generator, each time it generates a website it place files in the _site folder.
Any changes you make inside the above folder are lost because it is recreated when executing jekyll build or jekyll serve .
Changes should be made to the rest of the files or folders so they will be processed and locate the resulting files inside _site.
You should not write manually into _site directory, that is Jekyll's output.
If you need an otherservices directory in the output, place it one level above, like this:
_site/
otherservices/
index.html
index.md
Jekyll will copy every file and directory into _site, which is not excluded in the configuration and doesn't start with _ prefix. Files that have front-matter will be processed in addition to copying. So in result Jekyll will generate this structure:
_site/
otherservices/ (copies it)
index.html
index.html (generates it from index.md)
otherservices/
index.html
index.md
It is worth reading the documentation on how to create custom pages.

Jekyll overwrites output folder and CSS generated by Compass

I am trying to use Jekyll together with Compass.
On one command line I'm running jekyll --auto and in another one compass watch.
The SASS files are located in /stylesheets and are compiled into /_site/stylesheets.
Jekyll is configured to ignore /stylesheets.
Compiling the stylesheets works fine in the beginning, but everytime I change something that makes Jekyll regenerate the site, it overwrites the whole /_site folder and /_site/stylesheets is gone. Compass doesn't regenerate it since the source SASS files haven't changed.
Is there another way to use Jekyll together with Compass?
Can I configure Jekyll to not overwrite the complete output folder but just the files that changed?
Im using Jekyll & Compass for my github page. here: https://github.com/ardianzzz/ardianzzz.github.com
Simple,
I just put the generated css folder in the root folder. Jekyll will generate the file inside _site folder.
As you can see in my repository.
Just call the CSS with the following code
<link href = "/css/screen.css" ...
bad english, sorry. :)
The issue is that Jekyll, when run, scraps all the contents of the _site directory. The way I got around this was to use rake for deployment, and then have the following in my rakefile:
task :generate => :clear do
sh 'jekyll'
sh 'compass compile'
end
I then just run:
$ rake generate
Which populates the jekyll directory, and then puts the compass files over.
A neater solution might be to make your compass -watch process (assuming that is what you are running) compile the compass to projectdir/css. When you then run jekyll it will just pull that css directory directly into _site/css and you're done, no problems (see below for dir structure).
projectdir/
css/
stylesheets/
If you put anything in _site/css and then run jekyll after it will be removed, so you either need to run compass after, or put the compass files into the css folder in the root directory, and then jekyll will just copy the files correctly.