How to link the style sheet in Sigil?

JJ Joseph · 06-02-2012, 05:31 PM

In another thread, DiapDealer said:

Quote:

Originally Posted by DiapDealer

The stylesheet goes in the Styles folder. And you link each xhtml file (that you want to use it) to that stylesheet with:

Code:

<link href="../Styles/stylesheet-name.css" rel="stylesheet" type="text/css" />

in the head section.

My style sheet has its own file name (myfirstbook.css), but after I paste that file into Sigil, Sigil assigns it a new name "Style0001.css". So far, Sigil doesn't see my style sheet, even though it's right there in the Book Browser with the message "The resource is present in the OPF <manifest>, but it's not reachable (it's unused)". I'm not clear what Sigil is doing file-wise, so how do I ensure the text files see the style sheet as you've described it?

theducks · 06-02-2012, 05:53 PM

Quote:

Originally Posted by JJ Joseph

In another thread, DiapDealer said:

My style sheet has its own file name (myfirstbook.css), but after I paste that file into Sigil, Sigil assigns it a new name "Style0001.css". So far, Sigil doesn't see my style sheet, even though it's right there in the Book Browser with the message "The resource is present in the OPF <manifest>, but it's not reachable (it's unused)". I'm not clear what Sigil is doing file-wise, so how do I ensure the text files see the style sheet as you've described it?

If you brought it in separately (as opposed to coming IN with a book), sigil does not create the stylesheet link for you It does not know which file to use this one with (assumes many files might be present at some time now or later). You need to put a link (or more) in th <head> section of each file you want to use this stylesheet with.

Code:

<link href="../Styles/stylesheet.css" rel="stylesheet" type="text/css" />
<link href="../Styles/stylesheet2.css" rel="stylesheet" type="text/css" />

Where the Red is the name(s) of YOUR stylesheet(s) that will be used on that page. (note the example shows 2 sheets, you do NOT need to use 2

DiapDealer · 06-02-2012, 06:02 PM

In addition to what theducks posted while I was typing...

If you right-click on the Styles folder in the Book Browser, you will be given the options of:

"Add existing file" -- which is what you want if you have a pre-existing stylesheet (myfirstbook.css) that you just want to import into your ePub.

or "Add blank stylesheet" -- which appears to be what's happening to you if you end up with a file named "Style0001.css."

Either way, when you have a file in that Styles folder, the link needs to point to that exact file name (case sensitive). If the file is named "myfirstbook.css" then the code to add to the head section of your html should be:
<link href="../Styles/myfirstbook.css" rel="stylesheet" type="text/css" />

If it's named "Style0001.css" then:
<link href="../Styles/Style0001.css" rel="stylesheet" type="text/css" />

If you think you have it right and it still doesn't seem to be working, make sure you save the epub and close Sigil, and then open it back up again before you assume "it didn't work." Some of that CSS stuff doesn't always seem to take effect immediately and you could end up chasing your own tail if you don't restart just to make sure it "took."

JJ Joseph · 06-02-2012, 10:25 PM

Quote:

Originally Posted by DiapDealer

In addition to what theducks posted while I was typing...

Thanks for the quick replies - that's exactly what I was looking for. Now everything is sort of looking like a book, much more so than yesterday! For sure, that's not my last question, but I'm making progress again.

bhartford · 06-13-2012, 06:10 PM

Quote:

Originally Posted by DiapDealer

"Add blank stylesheet" -- which appears to be what's happening to you if you end up with a file named "Style0001.css."

Yes, that's what I did too. According to the Sigil User Guide (http://web.sigil.googlecode.com/git/index.html) I'm supposed to be able to then:

1. Select one or more files in the Book Browser
2. Right-click on the selection
3. Choose Link Stylesheets from the context menu

But that doesn't work. When I right-click on a file in the Book Browser, there is no "Link Stylesheets" menu choice.

Is the User Guide out of date, or (more likely) am I doing something wrong?

Thanks.

DiapDealer · 06-13-2012, 06:26 PM

Quote:

Originally Posted by bhartford

Yes, that's what I did too. According to the Sigil User Guide (http://web.sigil.googlecode.com/git/index.html) I'm supposed to be able to then:

1. Select one or more files in the Book Browser
2. Right-click on the selection
3. Choose Link Stylesheets from the context menu

But that doesn't work. When I right-click on a file in the Book Browser, there is no "Link Stylesheets" menu choice.

Is the User Guide out of date, or (more likely) am I doing something wrong?

Thanks.

The User Guide is a tiny bit ahead of date, actually

The context menu "Link Stylesheets" feature is only available in the very latest beta version (0.5.901) of Sigil, so far as I'm aware.

bhartford · 06-15-2012, 12:49 AM

Quote:

Originally Posted by DiapDealer

The User Guide is a tiny bit ahead of date, actually

The context menu "Link Stylesheets" feature is only available in the very latest beta version (0.5.901) of Sigil, so far as I'm aware.

Alas, the story of my life, always getting ahead of myself. Thanks for that explanation.

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Re: Aldiko ignoring style sheet property?	purcelljf	ePub	6	11-19-2012 08:15 AM
An example file of your CSS style sheet	roger64	Writer2ePub	6	04-11-2012 02:59 AM
Missing style sheet	mauvais	Barnes & Noble NOOK	3	12-05-2011 06:29 PM
Sigil Style Sheets	crutledge	Sigil	3	10-06-2010 08:48 AM
xthml file not refer to style sheet	droople	Sigil	11	08-22-2010 01:35 PM

06-02-2012, 06:02 PM	#3
DiapDealer Grand Sorcerer Posts: 27,549 Karma: 193191846 Join Date: Jan 2010 Device: Nexus 7, Kindle Fire HD	In addition to what theducks posted while I was typing... If you right-click on the Styles folder in the Book Browser, you will be given the options of: "Add existing file" -- which is what you want if you have a pre-existing stylesheet (myfirstbook.css) that you just want to import into your ePub. or "Add blank stylesheet" -- which appears to be what's happening to you if you end up with a file named "Style0001.css." Either way, when you have a file in that Styles folder, the link needs to point to that exact file name (case sensitive). If the file is named "myfirstbook.css" then the code to add to the head section of your html should be: <link href="../Styles/myfirstbook.css" rel="stylesheet" type="text/css" /> If it's named "Style0001.css" then: <link href="../Styles/Style0001.css" rel="stylesheet" type="text/css" /> If you think you have it right and it still doesn't seem to be working, make sure you save the epub and close Sigil, and then open it back up again before you assume "it didn't work." Some of that CSS stuff doesn't always seem to take effect immediately and you could end up chasing your own tail if you don't restart just to make sure it "took."