I am running a jekyll server for a local site with bundle exec jekyll serve. When I make edits to a file in the site, jekyll regenerates the files automatically. I'd also like a script I have to be triggered to automatically to refresh my browser. How can I trigger this script?
In short words, run Jekyll with the --livereload parameter.
The command will look like this:
bundle exec jekyll serve --livereload
For more information, call help command:
jekyll help serve
Here are the parameters that may be useful:
-l, --livereload Use LiveReload to automatically refresh browsers
--livereload-ignore ignore GLOB1[,GLOB2[,...]] Files for LiveReload to ignore. Remember to quote the values so your shell won't expand them
--livereload-min-delay [SECONDS] Minimum reload delay
--livereload-max-delay [SECONDS] Maximum reload delay
--livereload-port [PORT] Port for LiveReload to listen on
You can of course combine options.
For example:
To run second project with Jekyll at the same time you need to set other port and another port for LiveReload.
bundle exec jekyll serve --livereload --livereload-port 8080 --port 4001
And now in your browser you can see the second project at http://localhost:4001/ or http://0.0.0.0:4001/
Related
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.
In order for me to view the site, it looks like I need to run bundle exec jekyll serve and open the server address in my web browser.
How do I go about having the viewing the site without running the command. I've went into the _site and clicked on the index.html file without running the server and noticed this.
Do you have any suggestions on how to go about this? There is no styling and none of the links works.
Is it possible to just place the .md file in posts folder and be able to view it without having to run a server still styled?
Any help would be appreciated.
You can build your static files using bundle exec jekyll build, then all your files will be in _site.
Now you need a server to serve theses static files. You can install something like nginx or apache.
Once it's done you'll want to copy your static files that are inside _site under /var/www/html/ and make sure your server is started with a command like:
sudo service nginx start
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've created a new jekyll project precisely following the simple command sequence at https://jekyllrb.com/. However it seems like the server is not looking for the right main.css:
GET http://example.com/css/main.css 404 (Not Found)
This error in the browser console seems to imply an irrelevant domain for a local project, so I wonder whether those instructions just mentioned are not what one should do for bootstrapping and running/testing a jekyll project on your local server. In that case, what is the right procedure for working locally? and is there an automated command for setting a different host name for deploying to a real server?
I am using a fresh install of jekyll 3.2.1.
Thanks!
Dirty temporary patch (because of this issue).
In _config.yml, set url: http://matanster.github.io/bloglike or wathever is your production url.
Create a config_dev.yml and add url: http://127.0.0.1
Locally, you can serve with :
bundle exec jekyll serve --config _config.yml,_config_dev.yml
I installed jekyll and run it from cli:
jekyll --server --auto
But when I change _config.yml I can't see that my changes where applied and I have to restart server every time.
I really need to restart server every time when I change _config.yml? Or there is some workaround?
I believe you are correct; that changes to _config.yml always require restarting the server.
After all, _config.yml provides options that you can override in the call to Jekyll. So it is unclear how auto should behave if an option is called on the command line run of jekyll which overrides some of the _config.yml settings, and then the config is edited. Which would take precedence then? the _config.yml or the original command line argument?
If you have the server running, you don't need to restart it. A (little bit) quicker way to is to run jekyll build or bundle exec jekyll build after editing your _config.yml file.
Parker Moore, maintainer of Jekyll, confirms that _config.yml changes are not autogenerated or picked up by a running, watching Jekyll server.
No I remember why we can't do this: if you change either source or destination, you're eff'd, so we said 👎 to this suggestion. Definitely use _data if you're using custom data. Otherwise, a quick ^C and restart should be 👌
https://github.com/jekyll/jekyll/issues/2302#issuecomment-43160557
I really need to restart server every time when I change _config.yml?
Or there is some workaround?
There is some workaround:
1) Install watchy.
npm i -D watchy
2) Restart on config change (for example as a package.json script)
"scripts": {
"restart": "watchy -w _config.yml -- bundle exec jekyll serve --drafts --watch",
(--drafts is unrelated, but I am assuming you do this locally in dev/authoring mode...)