statiqdev / CleanBlog

A blogging theme for Statiq Web.
MIT License
53 stars 25 forks source link

Broken links to scss folder #30

Closed samuelwine closed 1 year ago

samuelwine commented 1 year ago

FIrstly thankyou for a fabulous framework! I'm trying to set up my blog with Statiq and have been following the docs to set up the generator, and then the page on themes to add the CleanBlog theme. I've tried this twice, and each time the links in the generated html to the scss folder are invalid. They are being generated as /scss/clean-blog.css, whereas really they ought to be ../scss/clean-blog.css, since the output files are in /output/posts. I must be doing something wrong but I still can't figure out what it is. Any help would be greatly appreciated!

daveaglick commented 1 year ago

I think this might be an easy one to solve. The trick here is that the output folder that Statiq generates isn't intended to be opened from the file system directly. In addition to paths there are other difficulties trying to view a full site straight from the file system. Instead the output folder is intended to be uploaded to a web server (the default assumption is that the site will be at the root of the URL, but there's a setting to provide a nested root and generate the site using that).

Obviously when you generate locally the files are on your computer though, not a web server. To replicate the "web server experience" though, Statiq provides it's own web server you can use to preview your generated site. The trick is to run Statiq with the preview command, something like:

dotnet run -- preview

Am I on the right track here, or did I totally misunderstand the question/problem?

samuelwine commented 1 year ago

You're totally on the right track and thanks for helping me out with this. It took me about half an hour to notice that its not --preview, rather -- preview, thankfully its working locally now.

With regards to deploying to Github Pages, I was using Github Actions to run the generator and then upload the /output/posts folder, which understandably didn't bring with the css. What is the recommended way to deploy to Github Pages? Thanks alot!

daveaglick commented 1 year ago

Great! Yeah, the way double-dashed can either mean "this separates the dotnet command from what gets passed to the project code or "this is an argument for the project to use" depending on whether it's the first set with a space after it can be confusing. I wish the .NET team had picked a different delimiter for the dotnet command, but that's water under the bridge at this point.

There's actually a built-in deployment capability for deploying a Statiq site to GitHub Pages: https://www.statiq.dev/guide/deployment/github-pages. What I usually do is have GitHub Actions run Statiq with the deploy command, which then takes care of deploying to GitHub Pages for you (so you don't have to worry about adding any sort of GitHub Pages step to your Action):

dotnet run -- deploy

If you go this route, just make sure to add your token to the GitHub Action and set the GitHub Pages settings as described in the linked Statiq documentation.

samuelwine commented 1 year ago

Thanks a lot @daveaglick, really appreciate you taking the time to help me out with all this

daveaglick commented 1 year ago

No problem! Happy to help as I'm able, even if my available time means it's not as quickly as I'd prefer :). Since it sounds like you've got a handle on this question, I'll close the issue - just let me know if we need to reopen it.