After I deployed my blog to Amazon S3, I realized that there was no CSS applied to the pages. In Octopress, the look and feel of website is managed by stylesheets/screen.css
. It was fine in rake preview
but not on the S3 bucket. I looked around for a few hours to no avail. There was one other person who had the same issue on stackoverflow but no answers. Relevant xkcd:
Wisdom of the Ancients
I finally found my answer. There are other static websites out there so I removed Octopress from my search terms (facepalm! I got my first MSc. in query expansion). This stackoverflow answer sent me to Adam Wilcox's website and saved the day. Thanks Adam.
Simple fix, go to Amazon S3 bucket web interface. Find stylesheets/screen.css
. Go to metadata tab and change content-type
to text/css
. This has to be repeated every time screen.css
is updated (unless I can find how to do this with S3cmd
). Usually this is not the case, when I generate my blog again I can see the following indicating that screen.css
is not changed (unless you change the theme?):
root@kali:~/Desktop/octopress# rake generate
## Generating Site with Jekyll
identical source/stylesheets/screen.css
Configuration from /root/Desktop/octopress/_config.yml
Building site: source -> public
Successfully generated site: source -> public