I managed to get Hugo working on my local computer and I copied the public folder to my Amazon S3 bucket to serve the site from there. It works fine on localhost:1313 but I think the CSS style sheet is not working. It is just text on the page with no formatting. Here is my site, https://www.paulapplegate.com, I checked the index.html and it seems to link to the CSS folder and I think everything has read access. I set a bucket policy and checked it against random files and each was read only. I’m assuming it is a CSS problem, but you know what they say about assuming.
I read your tip/hint about the CSS file not loading from the main site/troubleshooting section, but my URL’s look right to me.
Any suggestions on why the site is not working?
I used rsync to upload, using this command, aws s3 sync ~/Documents/mysite/public s3://www.paulapplegate.com/ --exclude *.tmp
Maybe it’s the cache for the CDN service? But I did use the direct URL for the CDN site instead of the domain URL to check.
I’m using this theme: Hugo Bootstrap v4 Blog
Thanks,
Paul
I think you are just missing a / in the call for the stylesheets
<link href="https://paulapplegate.comcss/style.css" ...
Wow. I did not even notice that. A fresh set of eyes always helps. I’m away from my computer but I’ll fix soon.
Now since I literally did not modify much other the my name, was this typo generated by Hugo when it converted my site and output the public folder?
Chances are you forgot the / on config.toml baseurl. Or you can add it when using {{ .Site.BaseURL }}.
As far as I know, there isn’t a convention on whether the / should be in the baseURL or not.
@mrapplegate @brunoamaral best bet is to call your stylesheet with asbURL or relURL
1 Like
Stupid question, where did you see this? I can’t seem to find it.
Right in the head section of your site.
@mrapplegate I’m guessing you want to keep compatibility with the upstream of the theme. To do this, you’ll want to override the theme’s partial for the head and create an identical template in your project’s root layout directory. I would write more but I’m on my phone headed to a Meetup. Here are the corresponding docs:
https://hugodocs.info/themes/customizing/#overriding-template-files
To make the call to your stylesheet water-tight, I’d recommend calling the stylesheet as follows:
{{ "css/style.css" | relURL }}
Then you don’t have to worry about whether or not to include the closing slash. If you point me to a repo, I can help more in a couple hours…
Ok thanks you both. I’ll check it out again in a few.
Appreciate the help.