search

bjacquemet / personal-web

Hugo Template for Freelancer Portfolio and Blog
MIT License
137 stars 107 forks source link

URLs render incorrectly for hosting on GitHub Pages (project option) #15

Closed homerhanumat closed 3 years ago

homerhanumat commented 4 years ago

I plan to host my site on my GiHub project page via the docs folder. Thus for the GitHub repository project the base URL is set in config.toml to "https://username.github.io/project/" and publishDir is set to "docs".

But in deployment I lose CSS and images. For example, the compiled URL for an image turns out to be:

https://username.github.io/relative-path-to-image

instead of

https://username.github.io/project/relative-path-to-image

homerhanumat commented 4 years ago

Here is an example, built directly from the theme's example site:

https://github.com/homerhanumat/test-pweb

suhana13 commented 4 years ago

I am facing a similar issue. When I deploy the site via Github Pages, I lose the CSS formatting and I see a distorted webpage. I am not sure though if this error is specific to this theme or is prevalent across all Hugo themes

bjacquemet commented 4 years ago

Hey, as indicated in the issue #14 , you should have a look at Hugo's documentation for hosting on Github pages. @homerhanumat Your website doesn't seem to be built correctly. Don't hesitate to post your solution here as there are a few people looking for the answer.

homerhanumat commented 4 years ago

I did follow the Hugo documentation you reference, for project pages.

I have re-worked the repo https://github.com/homerhanumat/test-pweb so that the docs folder is built straight from the theme's exampleSite with a custom hugo command, without any moving of files or editing of config.toml. The README details how to reproduce such a site.

There is no longer a CSS problem (I think in my original test I did not correctly handle the resources folder) but the other issues remain. In particular:

  1. site icon points to https://homerhanumat.github.io, not to https://homerhanumat.github.io/test-pweb;
  2. portfolio image lnks are broken.

For issue (1), setting the href to "{{ .Site.Home }}" rather than "/" in sidebar.html should work all the time.

For issue (2) I'm uncertain how to proceed. The generated URL for the portfolio image on the home page is "/portfolio/sample-project/sample.jpg", which by the structure of the docs folder should work. But in fact "/test-pweb/portfolio/sample-project/sample.jpg" is what works. (Edit the link in the web inspector to verify.)

It might be possible to resolve issues by working entirely with relative URLs, but that would require many revisions, i think.

If I find a quick solutiuons to (2) I will work up a pull request. Thanks for creating this nice theme!