Here is the style sheet I am currently using. It has the name epub.css and it is a plain-text file unto itself. You are welcome to copy it or adapt it for your own use. - NJ
p {
margin-top:0.0em;
margin-bottom:0.0em;
text-indent:1.5em;
text-align:justify;
}
p.first {
margin-top:0.5em;
margin-bottom: 0.0em;
text-indent:0.0em;
text-align:justify;
}
p.left {
margin-top:0.5em;
margin-bottom: 0.0em;
text-indent:0.0em;
text-align:left;
}
p.center {
margin-top:0.0em;
margin-bottom:0.25em;
text-indent:0.0em;
text-align:center;
}
h2 {
margin-top:1em;
font-size: 150%;
text-indent: 0em;
font-style: italic;
text-align:center;
}
h3 {
margin-top:1em;
font-size: 125%;
text-indent: 0em;
text-align:center;
}
h4 {
margin-top:1em;
font-size: 125%;
text-indent: 0em;
text-align:left;
}
p.large {
font-weight: bold;
margin-top:1em;
margin-bottom:1em;
font-size: 200%;
font-style: italic;
text-indent: 0em;
text-align:center;
}
p.medium {
font-weight: bold;
font-size: 150%;
font-style: italic;
margin-top:1.0em;
margin-bottom:1.0em;
text-indent: 0em;
text-align:center;
}
p.small {
font-weight: bold;
margin-bottom:1em;
font-size: 125%;
text-indent: 0em;
text-align:center;
}
p.block {
font-family: courier, monospace;
text-indent: 1em;
text-align:left;
margin:0em 0em 0em 1em;
}
p.blockfirst {
font-family: courier, monospace;
text-indent: 1em;
text-align:left;
margin:0.5em 0em 0em 1em;
}
p.blockcenter {
font-family: courier, monospace;
text-align:center;
margin:0.5em 0em 0em 1em;
}
span.smallcap {
font-size: 90%;
font-weight: bold;
}
div.image {
text-align:center;
margin-bottom: 0.25em;
}
div.icon {
text-align:center;
margin-bottom: 1em;
}
div.caption {
margin-bottom: 1em;
text-align:center;
font-style:italic;
}
This comment has been removed by a blog administrator.
ReplyDeleteHi Mr Notjohn, Thanks for this! I have a stupid question though. How do you apply this style sheet? I've worked with coding for PHP but not for e-publishing. The book I wish to publish also has many .jpg images. How do you apply both of your templates to format? You're really sweet for having this available! Thanks! D
ReplyDeleteIn the sample Template (the full-length one, not Plan B) you will see the link to the style sheet, which has the name epub.css -- NJ
DeleteThis was EXACTLY what I was looking for! I didn't want my ePub files to have pre-set fonts, margins and line spacing as my iPhone reader is able to do this. My initial solution was to remove the complete stylesheet from the epub file, but that removes all formatting. Your stylesheet does what it shout do: let the user choose font type, margins, justification and line spacing but keep paragraph formatting, italic, etc.
ReplyDeleteMany many thanks!!
I just purchased your book and I'm even more confused than before!!!! I had already created my book in Word - I'm starting to get a huge headache with all of this html stuff. I need help!!! golddawn2000@yahoo.com
ReplyDeleteWell, you can always try uploading your Word doc and seeing how it converts. If it's a mess, then try the free resources mentioned in the blog post http://notjohnkdp.blogspot.com/2014/01/all-about-e-publishing.html
DeleteThank you! I have problems when I use the following font styles for programming code:
ReplyDeletefont-family:"Courier New";
font-style: courier, monospace;
When I change to what you suggest all these font problems just disappear:
font-family: courier, monospace;
How about this?
font-family:"Times New Roman","serif";
is there any possible problems in the defination?
Yes, that "courier, monospace" seems to be required if Courier is to work on all Kindle devices. (I think it was the PaperWhite that required the "monospace," while "courier" works on the others.)
DeleteI wouldn't call for TNR because that's not what Kindle uses. The default on the older Kindles is a very legible serif font called Caecilia. Let the defaults rule! Specifying nothing gets you Caecilia on the e-ink Kindles while giving owners of the Fire tablets the ability to choose anything they like. I think it's a good idea to let the reader do what he or she likes, even though it's not what we would have chosen.
Why no H1 tag?
ReplyDeleteGood question! H1 naturally was reserved for the book title on the title page (H2 for sub-title, H3 for author) but then I realized this was bad form and that headings should not be used in that fashion. So H1 became p class="large" (and an H2 equivalent is p class="medium" etc). You can certainly call the chapter title H1 if you like.
DeleteI'm having a headache getting straight answers from the support people at KDP. I haven't been too impressed with their helpdesk so far. I'm hoping you can answer a question they seem in capable of answering:
ReplyDeleteRIght now I'm using an HTML editor called Brackets. I have my HTML code, along with a separate .css file. My question is, how do I "include" the css file with my code when I upload my book? All I see is the Upload button (which I have used to upload my .html file, but of course, it's then missing my stylesheet).
I'm guessing there must be a way to combine the .html and .css files, then convert them to epub, but for the life of me, I can't find an answer to that. Can you help?
Thanks,
Andy
Either put the style sheet at the top of the html file, in the [head] section, or download and use the excellent Sigil software and link to it as a separate file. I do the latter. Sigil saves as epub, which converts beautifully on the KDP platform. You will link to the external style sheet (again, in the [head] section) with a statement like this: [link href="../Styles/epub.css" rel="stylesheet" type="text/css" /]
DeleteI have to use square brackets instead of angle brackets because of the limitations of the Blogger software.
Awesome information. Thanks. I'm a newbie - first time uploading my wife's book to KDP. I took your advice, and downloaded Sigil (love it!). Then copied your epub.css to create my own. I linked my 18 pages to the css (how easy is that!). The p and h2 work perfectly. But I have trouble with anything else. I'll try a test paragraph using, say [p.center] but when I save it, the code reverts to [p]. Any ideas? What am I doing wrong?
ReplyDeleteThanks
Rick
Rick, for anything more than a plain old [p] paragraph, you need to specify a CLASS, like this: [p class="center"] -- that's in the text, of course, not the style sheet. (And use angle brackets, of course.)
DeleteSame with divisions. Like: [div class="image"].
Yeah, Sigil is the greatest thing since computers came along.
Thanks for the clear, quick reply. Obviously, I'm still learning, but that explains it. Simple once you know.
DeleteFor freeware, Sigil is unusually intuitive and well documented.
Thanks for your help!
I just bought and read your latest guide to epublishing and it was very informative, but still didn't answer my basic question which is how do I change fonts. I have written a small Bible study and I want scripture in TNR (or something like it) and my commentary in Arial (or something like it.) Would I modify one of the p. in the stylesheet to include another font family? Thank you.
ReplyDeleteThe simple solution is to use the regular paragraph styles when you want something similar to TNR, and the courier/monospace styles for the commentary. However, you may not like the result. I generally use italics for occasional quotations, so if your commentary is short, that might work for you. The only way to get a specific font is to embed it. That requires some technical knowledge, doesn't always work, can annoy readers who different a font of their own choosing, and requires a license or the use of free fonts. If you really want to do this, I urge you to hire a professional like Hitch at booknook.biz
ReplyDelete" who different a font of their own choosing"
DeleteWho PREFER a font of their own choosing!
Well I've gotten a little closer to my goal. I have a style sheet with the fonts I want. Now for a simplistic question but one which I can't find an answer to. How do you indicate in the html of the book which style to use where?
ReplyDeleteIf you embed fonts, you're a braver publisher than I am! It's difficult, it may require a license fee, Amazon sometimes strips them out, and they can annoy readers if done wrong. I leave this to the professionals. Sorry!
DeleteNo, you misunderstand me. I'm following your suggestion and using your stylesheet.
ReplyDeleteThe simple solution is to use the regular paragraph styles when you want something similar to TNR, and the courier/monospace styles for the commentary. However, you may not like the result.
But I still don't know how to tell the book when to use the regular paragraph style and when to use courier/monospace.
This comment has been removed by the author.
ReplyDeleteAh, sorry! For the default font, you simply begin each paragraph with [p]. For paragraphs in Courier, use [p class="block"] or blockfirst or blockcenter, depending on the effect you want. And the brackets are angle-brackets < or >, not square ones, but I can't use them here.
ReplyDeleteI changed [p] to [p class="first"] (using angle brackets)
ReplyDeleteAnd I got an error
The operation you requested cannot be performed because ....xhtml is not a well-formed xml document
An error was found at or above line 27. That tag isn't allwed here Currently open tags: html, body. . .
Thank you for all your help.
Make sure that you indeed have a style sheet that contains a class that begins p.first
ReplyDeleteAnd make sure that the file containing that p class="first" tag is linked to the style sheet in the heading, something like
[link href="../Styles/epub.css" rel="stylesheet" type="text/css"/]
with angle brackets instead of square ones, of course.
epub.css can be something else, depending on the name of your style sheet. And of course it must be in the folder labeled Styles. Sigil should create such a folder, and every time you split a file, Sigil will add the necessary link to the next file.
You might also look at line 27 in your file, to see where things went wrong. Probably it's p class="first", but possibly it's something else.
Still no luck. At the very bottom below the text there is a box that says "find" epub.css is in that box and there is a suspicious looking red box with an X in it to the left.
ReplyDeleteAll I want is for there to be 2 fonts in the document. One for scripture, one for commentary. If all else fails I will just use italics. I know how to do them.
Actually, I have switched almost entirely to using italics. It's easier to read than Courier as displayed on many computers and e-readers. But you really should have a working style sheet, or alternatively put the entire style sheet at the top of every file in the book. Do you really have a style sheet named epub.css, and is it indeed located in the Styles folder of your epub? You can name it anything you like, but the style sheet's name must agree with the pointer that's pointing to it.
DeleteThis is perfect! Thank you! I was looking for a general purpose style sheet to use in a small epub I've been working on. This fits the bill and saves me a bit of time.
ReplyDeleteThank you for the code. I wonder if you could help a bit further. I would like to have two languages in two different fonts, how to modify your code?
ReplyDeleteWell, I don't do fonts, and I think it's a bad idea to try to embed them. (You need to own that right, you need to know how to embed them, and you have to hope Amazon etc don't simply rip them out.) For two western-alphabet languages like English and Spanish, I don't think any modification is needed. For Indian, Arabic, Traditional Chinese, and other such scripts, I doubt it can be done. The usual route is to upload a Word doc in that script, and Amazon takes it from there. You might inquire of Hitch at BookNook dot Biz or Sarah at SleepingCatBooks dot Com, both amiable and professional formatters.
DeleteI object to calling html "code". It's really just a system of tagging words, phrases, or paragraphs to make them appear as you want on an electronic screen.
Hello I really need help, I have your book and been trying to make this work for DAYS, arg!
ReplyDeleteI have my document in Sigil, I feel ok about working with the html (brought over from Word, painstakingly brought over from Indesign, cleaned up as per instructions), but for the life of me I cannot get the stylesheet to register. I have it saved under styles, I have the code in the right place at the top, here it is with square brackets:
[link href="../Styles/epub.css" type="text/css" rel="stylesheet"/]
The styles don't show up in the preview pane, or if i save the file, the styles don't show up in any ebook reader (kindle, ibook, etc). Im working on a Mac. I have changed a few things on the stylesheet to suit me better. Please help!!!!
On the left of your screen you should see a list of html files in your book, and down at the bottom several folders which may or may not be empty. One of them is Styles. Your style sheet must be added there, and every Sigil file must point to it. For example:
Delete[link href="../Styles/style.css" rel="stylesheet" type="text/css"/]
But replace the square brackets [ and ] with left- and right-pointing carets: < and >
(I can't post html on Blogger, unfortunately -- NJ)