Images not visible while deploying on github - github-pages

I am facing a problem with the site published using GitHub. The images are not getting displayed when I publish the site. However, it is displayed on my local computer.
The images are present in the img folder.
I am not able to get where is the problem occurring and how to resolve it.
github repo link: https://github.com/Scientist69/Gym-Webpage
GitHub deployment link: https://scientist69.github.io/Gym-Webpage/

try removing the first slash(/) in image links in index.html.
<img src="/img/bg.webp" alt="" />
To
<img src="img/bg.webp" alt="" />

Related

Images folder not loading from Github repo to Github Pages

Website link hosted on Github pages : https://rohanchoudhary.in
Repository Link: https://github.com/therohanchoudhary/Portfolio-Rohan/
When you try inspect element it doesn't load images folder.
please change your image file extension from uppercase to lowercase. Eg:
<img src="./images/rohan.jpeg" alt="Rohan Choudhary Profile Photo" class="profile-image">
instead of
<img src="./images/rohan.JPEG" alt="Rohan Choudhary Profile Photo" class="profile-image">
I inspected your code, there is a spelling mistake in your Image filename.
The image https://rohanchoudhary.in/images/cloud.PNG is not available on the repository instead there is a image https://rohanchoudhary.in/images/cloud.png available in the repository.
This gives you a 404 File Not Found error.
So you'll need to fix the following:
<img src="./images/cloud.PNG" alt="cloud-img" class="bottom-cloud">
To:
<img src="./images/cloud.png" alt="cloud-img" class="bottom-cloud">
Just rename all the images properly and your error will be solved.

Django:URL Mapping ,Page not found (404)

I am a newbie to Django. Trying to create my first webapp.
I ran into a problem. I have 3 templates store, kart and checkout. I am able to navigate from store to kart without any issues. Now I wish to move to checkout page from the kart page. I am using a button for this purpose.
Below given is the code present in my kart.html page.
I am facing the below issue:
Below given is my urls.py file
And this is my views.py file
Could anyone tell me what I am doing wrong. Thanks in advance!!
There is a typo you are missing %
href="{% url 'checkout' %}"

project set up using github pages not loading

I hosted one of my project using GitHub pages but, for some reason, when I access the URL the page doesn't loads, and when I check it in the dev console it shows this error.
This is my GitHub page URL: https://prasunk96.github.io/colorsgame/
I checked that all the internal links that I have in my html file are all correct.
I have tried it several times but it showing the same problem again and again.
There are two issues with your CSS link:
It is not relative to your html file so the browser is trying to go directly from the base prasunk96.github.io/ and not include the /colorsgame/.
Github.io urls are case sensitive so your colorGamepro.css isn't being matched to the ColorGamepro.css file.
To correct the relative url you can either add a base tag to your HTML file or use a relative href. Once you correct the file name it should be able to find your file at https://prasunk96.github.io/colorsgame/css/ColorGamepro.css
In short use: href="./css/ColorGamepro.css"
Github project pages can sometime take a bit before being updated. See "My GitHub page won't update its content" for a similar issue.
I do see (a few hours later) a 404 for your css:
Try and see if using an anchored url works better:
<link rel="stylesheet" type="text/css" href="/css/colorGamepro.css">
^^^
|

Displaying a PDF from the Blobstore

I have various PDF documents as blobs in the App Engine blobstore. Now, I want to preview them on a HTML page. From various other questions, I figured the HTML setup should be:
<embed src="{{ url_to_my_pdf_blob }}" width="500" height="600">
While experimenting, I found that in the SDK the get_serving_url function will not only work for images but will also work for PDF blobs. This approach unfortunately fails in production.
I looked at the example using blobstore_handlers.BlobstoreDownloadHandler but could not figure out how to wire this to my view (my app is based on Django, the HTML file with the preview is served by a Django view class).
How do I get the url of the blob?
You need to define a ServeHandler, as described here:
https://developers.google.com/appengine/docs/python/blobstore/#Python_Serving_a_blob
For examples of the implementation, see Downloaded filename with Google App Engine Blobstore.

Facebook's og:image is not working on production site

I have the problem. There is two identical sites: production and test one.
I'm placing in head
<meta
property="og:image"
content="http://{{ site.domain }}{{ MEDIA_URL }}{{ post.preview.image }}"
>
And that image showing on facebook share page https://www.facebook.com/sharer/sharer.php with test site's link, but now showing with prodiction's one. The sites are fully identical except servers. Production is placing in Hetzner dedicated server, test server on DigitalOcean VPS.
The problem disappears after debugging the link in facebook object debugger https://developers.facebook.com/tools/debug/og/object?q=http%3A%2F%2Finvestcafe.ru%2Fblogs%2F05525565%2Fposts%2F38607. After debugging image shows excellent.
Any ideas? This problem makes me angry >_<
Facebook will cache the shared site. After running debugger, it will refreshed it's cache