Jekyll Default index.html not displaying styles - html

Default site
The initial default index.html is not showing any style. I have not edited any code inside the folders that Jekyll created. When I try to run it on localhost this is what shows. No styles.
Basically just installed Jekyll on my system, then tried to create a new folder using "jekyll new 'foldername'" then ran "jekyll serve --watch". After that checked my localhost and it will not display the style.
This is the Repo Github

I just updated Jekyll to version 3.3.0 and styles now work. But still i didn't know why version 3.2.1 Doesn't display styles.

Related

Jekyll not rendering templated page

I'm running Jekyll 4.0.0 and Bundler version 1.17.2. As this time of posting, it is the latest version of both Jekyll and Bundler.
I have a template called default, which I use to standardize the appearance of navbar, footer, and location of content being displayed.
The directory structure of my website is as follows:
_data: a folder of yml data files for listings of open source projects I worked on
_includes: a folder containing footer and navbar html files
_layouts: a folder containing liquid templated layout files. This is where "default.html" layout file is located.
_posts: a directory of blog posts that I want rendered by Jekyll
CNAME img: image files index.html credits.html
lib: a directory that hosts all of my CSS, fonts, JavaScript files
logo.ico
opensource: a folder containing layouts related to open source
What I'm having trouble with is adding the credits.html page. Using index.html as a template (since index.html renders perfectly), I have the following meta data pasted at the top of credits.html:
---
title: <my name>
layout: default
description: <my description>
---
Under that are all the HTML related to the contents section of the page. When I test my website locally and on github pages, I noticed Jekyll gives me a 404 not found error. I know this is not true because the moment I put credits.html inside another folder (ie: /credits/credits.html) the page renders fine with the url localhost:4000/credits/credits.
I do have permalink set as "pretty" for the entire static website.
Does anyone know why I can't seem to render the credits page? The index page seems to work just fine. I've tried digging through the documentation, but I can't seem to figure out what is affecting that one page.
** EDIT **
I discovered that if I go to localhost:4000/credits/, the page renders perfectly. This is definitely a permalink issue. Can someone point me in the right direction of how I can fix this issue?
I solved the issue!
The reason is because I had permalink enabled in the global configuration file "_config.yml". Inside that file, I had permalink: pretty set. This is why localhost:4000/credits/ worked but not localhost:4000/credits.html.
To resolve this issue, I removed that setting from the global config file. I also realized at the same time that permalink was not necessary for my use case.
For anyone who is in this situation but requires permalink for other sections of your website, set permalink per template file via front matter instead.

Jekyll theme is working on local, but not working on remote

I forked this theme and created a simple pages, modified some css files - setting fonts for specific tags or disable italic on subheadings.
It works like a charm in local. But when I commit the files and push the repo, It shows contents but the design things are gone! I mean, It shows only html contents.
This is the page on local environment:
And this is the page on the remote server..?
I can use basic tags and change some properties of tags in CSS, but I don't know about more details.. Could you please give me some kinds of guide or how to fix this problem?
Edit -- Here is my git repository:
https://github.com/soldier4443/soldier4443.github.io
In _config.yml, remove baseurl: "/blog" to read baseurl: "".
FYI- if your theme is working locally but not working remotely(OP didn't have an issue with this, though this was my mistake), make sure that the remote repository is named .github.io
More info. from the official documentation: "GitHub Pages are initially configured to live under the username.github.io subdomain, which is why repositories must be named this way even if a custom domain is being used."
source: https://jekyllrb.com/docs/github-pages/

Change theme for Jekyll static site

I set up my User site on github-pages with the default "minima" theme - works just fine. However, I can't figure out how to change themes. Tried following these instructions to change theme to "architect":
To use the Architect theme:
Add the following to your site's _config.yml:
theme: jekyll-theme-architect
Optionally, if you'd like to preview your site on your computer, add the following to your site's Gemfile:
gem "github-pages", group: :jekyll_plugins
Seems really simple, right? But when I commit the changes and reload the page at http://username.github.io it's just a blank page.
I'm sure I'm missing something really obvious but if you can explain I would greatly appreciate it!
The theme you chose has only one layout, that is the default layout, while the minima theme has three, default, post and page.
Just change the layouts used by your posts and pages to default in their frontmatter or globally in the configuration.
you can't change the theme of an active jekyll site. you need to install a new theme when you create the site. it's kind of annoying, but if you're just getting started with the site, installing a new theme shouldn't be too difficult.

Jekyll default installation doesn't have _layouts directory

So I followed the guide on the Jekyll website by installing and running Jekyll (sure I don't have to post this here). And the site is up and running perfectly but for some reason I don't see the _layouts directory that's supposed to be there. In the pages I can see that it references some layouts i.e:
index.html
---
layout: default
---
<div class="home">
about.md
---
layout: page
title: About
permalink: /about/
---
This is the base Jekyll theme.
But when you look at the directory stucture of the project:
No layouts folder.. what's up with that? Everything works though. And it looks perfectly fine when run on localhost.
You must be running the recent Jekyll version 3.2, which introduces Gem based themes (from https://jekyllrb.com/docs/themes/):
Jekyll themes package layouts, includes, and stylesheets in a way that can be overridden by your site’s content.
The theme is set in _config.yml:
theme: minima
Initial files that were previously in _layouts, _includes, and _sass are now packaged with the theme.
Basically Jekyll wants you to use themes, so you can't see _layouts, _includes, _sass, _assets anymore.
To use previous behaviour simply copy from the gemfile:
open $(bundle show minima)
Copy the 4 folders into your jekyll directory
If you want the older style of Jekyll website directory which includes all the 4 folders then you can use this command :
jekyll new my-new-website-name --blank
I have done the same while creating a personal site.

Why site.baseurl doesn't work on Jekyll?

i have been trying to create jekyll site and host on git-pages. Localy everything works fine. But on github-pages works only first pages and 10 newest blog post.
But after going to any of other pages like "Blogas" or "Straipniai" every link starts with 'localhost:4000' and naturaly breaks css, javascript...
And i am not sure where is problem, because everything is same even if i make change in /_includes/header.html site.url to site.baseurl.
Here is git-hub
And site
I think the problem is that you somehow have both a .md and an .html version of the same pages. The .html version you built locally and GH is preferring it. it has localhost in the urls so it won't work. Try deleting the .html files in those sub folders and see what happens. For example, delete the index.html file from invisibleghostt.github.io/blogas/ and see if that page is fixed.
No idea how you got those files in there, they should not be there.
Look, there are a few things you'd better fix on your _config.yml:
url: "http://codas.lt" # add the site url
gems: # remove `jekyll` from gems
- jekyll-sitemap
- jekyll-gist
- octopress
include: [".htaccess"] # remove this line (GitHub Pages does not support .htaccess)
The other thing is, you'll need to remove all the folders from the folder _posts, as explained here:
If you organized your categories as
/_posts/code/2008-12-24-closures.md, you will need to restructure your
directories to put the categories above the _posts directories, as
follows: /code/_posts/2008-12-24-closures.md.
You are probably working locally with a Jekyll version which diverges from GitHub Pages' (currently is Jekyll 3.0.3). That's why your site works locally and doesn't work there. To avoid that, build Jekyll with Bundler (a dependency manager). On this answer you can see how to do that, step-by-step.
Hope to have helped! :)
Note: If you get stuck in how to adapt your theme to work with GitHub Pages, you can try GitLab Pages, as you can easily set the Jekyll version you want to use to build your site. For example, this project builds the site with Jekyll 2.5.3.