faulty path to css file in octopress generation - html

Question

I'm just getting started with Octopress; pretty green on web development, and I'm having the following issue:
When I run rake generate to make my octopress page, it mostly generates everything fine but it's not giving a good reference to the .css file. Here is the link it generates:
<link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css">
This leaves my index.html page with bare html formatting. But if I change the link to read:
<link href="stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css">
it works. All I did was take out the forward slash.
My question is this: what do I need to change for rake generate to put the proper reference in the html file?

Answer 1

A slash in front will point to the root directory of the project.
Whereas without slash, it will point to the current directory of the HTML file
So if in your case, project structure is:
Project/something/index.html
Any link with "/stylesheets/" will point to a folder in the Project directory. ie it will look for "Project/stylesheets"
Whereas a link with "stylesheets/" will point to a folder in the something directory, which is the current directory of the project.

Answer 2

You need to edit your Rakefile.
I wrote an article about Rake commands in Octopress here:
http://www.tomordonez.com/blog/2013/03/12/rake-commands-in-octopress-on-github/
Inside your main Octopress directory there should be a file called "Rakefile"
Open this file and look for this line:
desc "Generate jekyll site
task :generate do
In here there is a line that says:
system "compass compile -css-dir #{source_dir}/stylesheets"
The source_dir is assigned toward the top of the Rakefile where it says ## Misc Configs ##.
It should say:
source_dir = "source"
I gave you almost all the solution. Put these together and try it out to see if you can make it work :)

Answer 3

Since you're new, I'll give you some ideas as to how this can work
--
Assets
Firstly, when you make use of the asset piepline in Rails, it does a lot of the work for you. Specifically, the stylesheet feature is very well documented:
<%= stylesheet_link_tag "screen" %>
If your page has hard-coded references to your stylesheets, it's going to cause all sorts of compatibility issues down the line (with production etc).
I know this is not an answer to your question directly, but you need to ensure your HTML files are making use of the Rails helper methods - these create dynamic paths, which your app will automatically follow
--
Generate
As for your generator, I've got no experience with octopress
If the gem is not written by you, I would not worry about the generator too much. Having written my own gems & other software, it's very difficult to create a system which works for every single system
If you have the ability to change the path yourself (after generation), I'd do that, and raise an issue with the author on Github