how can i fix failing to load resource status 404 github pages - html

I have deployed my project on Github and it gives this 👇
errors on the console and how may i fix it?
and link to the git is: https://blessja.github.io/Bottelary/
github repo: https://github.com/blessja/Bottelary

Change the incorrect file URLs in the index.html.
For example, you have written <link rel="stylesheet" href="/css/main.css"> which targets to https://blessja.github.io/css/main.css, which gives a error 404.Instead type <link rel="stylesheet" href="./css/main.css"> or <link rel="stylesheet" href="css/main.css"> which will get you to the right file, i.e. https://blessja.github.io/Bottelary/css/main.css
And try changing all the incorrect file paths mentioned in the index.html file.

Related

What path do I need to write to get css to work in GitHub pages?

I have tried multiple file paths in my HTML head to get the CSS to load in GitHub pages but it won't. It loads locally but not on pages.
I tried
<link rel="stylesheet" type="text/css" href="css/components/style.css">
<link rel="stylesheet" type="text/css" href="/css/components/style.css">
<link rel="stylesheet" href="css/components/style.css">
<link rel="stylesheet" href="/css/components/style.css">
None work, any help would be amazing
my repo
page
I tried changing the file name multiple times expecting the gh pages css to load it did not
The answer to this question is already here. Check out this stack overflow answer, which worked for me.

How can I solve thymeleaf css not found error?

How can I solve thymeleaf css not found error?
The bootstrap.min.css file is located in resources/templates/css/bootstrap.min.css.
The following sources were used to refer to this file.
<head>
<meta charset="UTF-8">
<link th:href="#{/css/bootstrap.min.css}"
href="../css/bootstrap.min.css" rel="stylesheet">
<title>Title</title>
</style>
</head>
The result rendered on the server is <link href="/css/bootstrap.min.css" rel="stylesheet">.
If you access the address
I get an error GET http://localhost:8080/css/bootstrap.min.css net::ERR_ABORTED 404.
How can I solve this problem?
Best Regards
Create a directory called static under resources/templates/ and move css directory into it. The css and js should be in a directory called static so that the framework recognises them. The path for the css file should look as follows:
resources/templates/static/css/bootstrap.min.css

After upload, my page is referencing incorrect folders

I recently finished up a mock site for a project that looks perfect locally. However, when I uploaded it to my server and Github pages, none of the styling is added. I checked the console, and see this:
Failed to load resource: the server responded with a status of 404 (Not Found)
style.css Failed to load resource: the server responded with a status of 404 (Not Found)
/favicon.png Failed to load resource: the server responded with a status of 404 (Not Found)
reset.css Failed to load resource: the server responded with a status of 404 (Not Found)
style.css Failed to load resource: the server responded with a status of 404 (Not Found)
So, I checked the sources in DevTools, and see that in my "resources" directory," there are two folders that don't actually exist: CSS and CSS_reset. Well, "CSS" is there, but it's referenced in my HTML as "css," so that's breaking the styling. CSS_reset doesn't exist AT ALL. Here's a screenshot of my directory tree on my server:
http://imgur.com/AQGY5W8
And here's the HTML referencing the CSS:
<link href="./resources/CSS_reset/reset.css" type="text/css" rel="stylesheet">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.css" />
<link href="./resources/CSS/style.css" type="text/css" rel="stylesheet">
<link rel="icon" href="/favicon.png" type="image/x-icon">
<link href="https://fonts.googleapis.com/css?family=Monoton%7COpen+Sans:400,600,700" rel="stylesheet">
And here's the link to Github:
https://github.com/pauljhollis/jumpstart
I've uploaded about 15 pages to this server and github, and have NEVER seen this happen before. I have no idea what's causing this, and have checked all through devtools, and removed/re-added the files on my own server several times. Any help is greatly appreaciated.
Edit: Answered. Something changed my code and changed "css" to "CSS" and added "CSS_reset," which isn't even a directory on my computer. This didn't happen on my pc last night, but I'm working on a different one today. Super weird. Thanks for the help/suggestions. I didn't even notice this had happened.
Try:
<link href="../resources/CSS/style.css" type="text/css" rel="stylesheet">
Another method is to use a base tag...
<base href="https://www.[yourwebsite].com/resources/" target="_blank">
...then link to the resource accordingly:
<link href="CSS/style.css" type="text/css" rel="stylesheet">
Also, note the CSS directory. I would make sure that's how it's spelled on the server. Some are case-sensitive, so if the dir was "css" and you called "CSS", it wouldn't find it.

CSS file path changes on the browser

I have specified the following css path but when i am trying to load page it converts the file path as below
In the html code i had given the path like :
<link href="css/style.default.css" type="text/css" rel="stylesheet">
But after inspecting on browser it gets converted as below:
<link href="css/A.style.default.css.pagespeed.cf.cgR25iXVvw.css" type="text/css" rel="stylesheet">
It is your server changes filepath. This is because you have turned on addidtional cache for files.

External CSS stylesheet link failure

I am having this issue here:
http://arflux-rpg.com/game/index.php
On line 5:
<link type="text/css" rel="stylesheet" href="/src/style.css">
The stylesheet exists (and is populated in correct syntax), I am linking correctly, and yet the styles fail to apply.
EDIT: Removed clickability of link as it's generating Google malware warning.
You actually mean to link to
<link type="text/css" rel="stylesheet" href="src/style.css">
Starting your url with / will treat it like an absolute path from your domain, without the slash it treats it as a relative path from the current directory.
Replace
<link type="text/css" rel="stylesheet" href="/src/style.css">
with
<link type="text/css" rel="stylesheet" href="../src/style.css"/>
Hope it helps
Your stylesheet may exist, but not under that path. Try to access it directly at http://arflux-rpg.com/style.css - you'll get a 404 Page Not Found error.
Check your path - you're specifying an absolute path with the leading /, so make sure the stylesheet is actually located in the "src" directory directly under your document root directory.