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.
Related
I'm new to Jekyll and I am trying to get a custom theme up and running. Here's is what I've done so far:
Created my Jekyll site. CD to the directory I wanted to install it and ran
bundle exec jekyll serve
These files were created and I was able to see the site locally at the default 4000 port.
I then tried following the instructions here for installing your own theme. I entered this in my terminal:
$ jekyll new-theme skull_and_roses
As the instructions indicated it built out a new directory...
It also added a directory in the _site directory, not sure if that is correct:
I then followed these instructions:
But when I go to run it:
bundle exec jekyll serve --watch
I get an error:
The skull_and_roses theme could not be found.
Like I said, this is my first run at Jekyll so any help would be appreciated.
I also use jekyll theme template (It is a nice template with friendly manual) and customize it to set up my own github page recently.
Beside create repo on github use username (username.github.io), What I did on my mac (locally) are:
set up env for using Jekyll, you can reference: https://jekyllrb.com/docs/
$ git clone https://github.com/username/username.github.io.git (assuming you have already create the repo).
$ cd username.github.io
$ git clone <theme github repo>
put all the theme files into the root of your website files (dir we create in step2)
usually the theme template will have Gemfile, if really not, you can try to create Gemfile and type in:
source 'https://rubygems.org'
gem 'github-pages', group: :jekyll_plugins
After you confirm you have Gemfile, Run
$ bundle install
$ bundle exec jekyll serve
Now, you can enter localhost:4000 or 127.0.0.1:4000 to check the theme can run on local serve.
Then you can mainly modify _config.yml file, like title, author, and other from the theme template instructions. You can check it locally(localhost:4000 or 127.0.0.1:4000) whenever you update something and you want to check the result. Usually changing in _config.yml, you need to restart the jekyll serve (using ctrl+c to stop and run $ bundle exec jekyll serve to restart the service to check the modification. You may need to modify more than _config.yml file to meet your own requirement, at least like about.md or add your own posts in _post.
After you finish modification from theme template and make your own github page you like. You can push the local repo to remote repo (master branch of username.github.io). Btw, if you work locally, you can use branch to test features you want to add, checking result locally and then merge to master when you are satisfied with the result.
Finally, you can check: https://username.github.io and enjoy your own github page.
For your question about _site and other things you may want to know, you may also want to check followings:
Creating and Hosting a Personal Site on GitHub
Quick start & tutorials on jekyll
i have a mixed situation where i have my custom website generated in a _dev folder, and i want jekyll generated blog files to go in that same folder. of course i don't want jekyll to wipe up any of the files that are already there, but just to wipe up and rebuild the jekyll related files.
i don't want to list all the things i want to keep like this:
keep_files: [js,css,images,*.html]
plus the *.html, while building, throws an error. is there a way to tell jekyll to just wipe up and rebuild the jekyll related files only?
i can't find many options on this on the official documentation.
i'm on jekyll 3.4.3
By default Jekyll deletes the output folder before building the site. Unless you change that behaviour in source code you can build your website in a temporal folder and copy the contents replacing the old files in your website folder.
jekyll build --destination /tmp/jk
cp -r /tmp/jk/* _dev/
This way it will only replace the Jekyll related files.
I have been using Jekyll for my blog and it has been working fine. Now I am trying to add new posts from a computer running Ubuntu 14.04 and Jekyll 2.4.0. The problem is that, only on this computer, it does not generate index.html in _site.
I can't find anything in the documentation that helps, and in any event, I'm using git so I have the same configuration on all of my machines.
So the question is: How does one turn off generation of index.html in Jekyll, and how can it be turned back on?
[Update: I did gem uninstall jekyll followed by gem install jekyll, rebuilt the site, and everything works fine. The original install must not have completed properly.]
To turn generation off you can remove this file. Or to use static index.html file remove markdown section enclosed with double triple --- in header (in this case static index.html will be parsed). Also mention filename it in exclude: section of _config.yml to avoid copying to _site folder.
I'm considering Jekyll for a site I'm putting together that will be a blog with lots of images (and other larg-ish media files). It's easy enough to to make a directory for images and then link to them as needed in the posts. But, as I understand it, when the site is generated, all the image data will be duplicated into the generated _site directory that holds the static files. Each time the site is generated the _site directory is emptied, and repopulated with the static version of the site.
Is there any way to, for example, drop a symlink to the images directory inside the site directory, and then maybe have jekyll ignore it when the static files are generated?
Or is there another way to go about this that makes more sense?
Assuming you are running on an apache web server, you can setup an Alias directive to serve images from a directory outside of the normal docroot. You need access to edit the VirtualHosts config or some other ability to create aliases directives (e.g. via a control panel).
For an example of how this would work, let's say you are storing your jekyll files under a directory called "/web/jekyll". To get your images directory do the following:
Add an "_images" directory along with your basic jekyll tree. Ending up with something like:
_config.yml
_images/
_layouts/
_posts/
_site/
index.md
Update your apache config to add the Alias directive like:
Alias /images /web/jekyll/_images
Reload the apache config and run jekyll to build the site.
Since the image directory name starts with an underscore, jekyll won't push/copy it to the output _site during the build. Apache will happily serve most files from your _site directory as normal, but when it sees something like "http://jekyll/images/test.jpg", instead of looking for the file under "/web/jekyll/_site/_images/test.jpg", it'll serve it from "/web/jekyll/_images/test.jpg".
Incidentally, I like a little more separation of the source content and output content than jekyll defaults to. So, I setup my directory structure as follows:
/web/jekyll/html/
/web/jekyll/images/
/web/jekyll/source/
/web/jekyll/source/_config.yml
/web/jekyll/source/_layouts
/web/jekyll/source/_posts
/web/jekyll/source/index.md
With the following option set in _config.yml
destination: ../html
And the apache alias directive setup with:
Alias /images /web/jekyll/images
Jekyll is run in the "/web/jekyll/source" directory, but output is sent to the "/web/jekyll/html" dir. Similar to the first example, calls to "http://jekyll/images/test.jpg" are served from "/web/jekyll/images/test.jpg". This setup doesn't really make a difference from a site serving perspective. I just like the cleaner separation between the raw source files, the fully baked output files and the images which work via the alias.
Correct, the first part of the jekyll command removes everything in the destination directory. The problem with that is the symlinks must be manually created again. So next, go ahead and create a script that does this each time.
Be sure that:
exclude: [jekyll, css, img] in the _config.yml file
linux: The ";" symbol runs first, second, third.. commands.
script: A file named jekyll with executable permissions containing
jekyll;
ln -s /var/www/css /var/www/_site/css;
ln -s /var/www/img /var/www/_site/img;
Finally run (./jekyll) that program instead of jekyll.
-Dan
Make a project page for the images.
Set up directory structure
/home/git/svnpenn.github.io
/home/git/img
Run Jekyll
# We cant add the symlink until after jekyll is done. We will remove the
# site folder and wait for it to rebuild.
rm -r _site
jekyll --server &
while [ ! -f _site/index.html ]
do
sleep 1
done
ln -s ../images _site/images
Note I was using this because I thought it would help publish time on GitHub
pages. It does not. GitHub can take 1-10 minutes to publish depending on the
server.
I know this has already been answered, but I went a slightly different route. I hosted all of my images in a public directory on Dropbox and use grunt to generate a manifest of the images. It keeps my repository small because the images don't get checked in. I detailed it a while back in a blog post.
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.