Jekyll on github pages not displaying CSS

I experimented with Jekyll using Octopress for deployment. It works fine for me on localhost, but for some reason CSS doesn't load when the site loads on Github Pages. I would appreciate any help understanding why.

When I browse the site loading with the Github URL, it shows a 404 error for main.css. The initiating column (using the developer tools in BTO) indicates that this comes from the index.html file in the line in the HTML head:

  <link rel="stylesheet" href="/css/main.css">

The tree for the directory _siteon my local machine:

.
├── 2015
│   └── 11
│       └── 09
│           ├── another-jekyll-blog.html
│           ├── fifth-time-is-the-charm.html
│           └── jekyll-and-octopress-is-this-thing-on.html
├── about
│   └── index.html
├── css
│   └── main.css
├── feed.xml
├── index.html
└── jekyll
    └── update
        └── 2015
            └── 11
                └── 09
                    └── welcome-to-jekyll.html

This tree exactly matches in the Github repository after the site was clicked (I used jekyll buildand then octopress deploy).

"" , :

[USER].imtqy.com
|-css
|   |-main.css
|
|-octo-5
|   |-(index)

localhost, :

localhost:4000
|-css
|   |-main.css
|
|-(index)

, , main.css Github. , , main.css /css/main.css, . , Github Pages. , , , Jekyll .

, _config.yml . , Octopress:

# Site settings
title: Test Site
email: your-email@domain.com
description: > # this means to ignore newlines until "baseurl:"
  Site description here...
baseurl: "" # the subpath of your site, e.g. /blog
url: "http://yourdomain.com" 
twitter_username: jekyllrb

## --- Octopress defaults --- ##
# Default extensions for new posts and pages
post_ext: markdown
page_ext: html

# Default templates for posts and pages, found in _templates/
post_layout: post
page_layout: page

# Format titles with titlecase?
titlecase: true

# Change default template file (in _templates/)
post_template: post
page_template: page
draft_template: draft

, : https://github.com/bg-scro/octo-5

+4
2

_config.yml root: /octo-5.

css, :

<link rel="stylesheet" href="{{ root_url }}/css/main.css">
+2

( ) html , css head :

'/css/main.css' 

, , css/main.css . /css/main.css index.html. .

, css , _config.yml

root: /

git root.

, , ,

root: /octo-5

EDIT: , root /, , , . . . jekyll, baseurl url, _config.yml, , .

,

baseurl: /
url: http://USERNAME.imtqy.com

,

baseurl: /PROJECT
url: http://USERNAME.imtqy.com

. https://help.github.com/articles/user-organization-and-project-pages/

+2

Source: https://habr.com/ru/post/1615280/


All Articles