Here we are again!
As I told you, I tried Sigil for the HTML to ePub conversion. And finally I've got what I wanted.
For everyone interested in the topic, here is a very simple and useful guide (click the blue square to go to the original post):
Quote:
Originally Posted by Pablo
EDIT (March 9th, 2013)
Uploaded version 3 covering Sigil 0.7.1
EDIT (April 20th, 2013)
Uploaded version 3 in ePub format
Pablo
|
I know a little HTML and CSS, so this was all I need; by the way, it seems a really good guide for all newbie coders.
Long story short: I've had alredy tried what
jackie_w said. I didn't get the expected result due to the fact that I didn't write the right path for the Dark Courier font. So I've embedded the font in the ePub, in a known folder, and using (this time) the right path for the @font-face declaration I got what I want.
I think that the main problem with Calibre was that it will do too many task automatically, and I didn't have a very good control on what's happening. With Sigil I have to do manymanymany task manually, but I can see all the folder tree of the ePub (side note: just learned that the ePub is nothing more than a "zip" file...), and I can have a good view of what's happening.
So, the Style.css file includes this
Code:
@font-face {
font-family: "Dark Courier";
font-weight: normal;
font-style: normal;
src: url(../Fonts/Dark Courier-Regular.ttf);
}
@font-face {
font-family: "Dark Courier";
font-weight: bold;
font-style: normal;
src: url(../Fonts/Dark Courier-Bold.ttf);
}
@font-face {
font-family: "Dark Courier";
font-weight: normal;
font-style: italic;
src: url(../Fonts/Dark Courier-Italic.ttf);
}
@font-face {
font-family: "Dark Courier";
font-weight: bold;
font-style: italic;
src: url(../Fonts/Dark Courier-BoldItalic.ttf);
}
pre {
white-space: pre-wrap;
background: #eeeeee;
}
code {
font-family: "Dark Courier";
}
The .ttf files path is: parent folder (.xhtml files are in "Text" folder") than "Fonts" folder.
You can find the ePub structure attached.
In the .xhtml files I use this
Code:
<p>Here is a sample</p>
<pre><code>int d; // a variable</code></pre>
<p>That's it!</p>
I use the <pre> tag for blocks of code (useful for indentation and newlines); to use the monospace font inside a paragraph I just use the <code> tag:
Code:
<p>Sample paragraph with <code>some code</code> and normal text</p>
Thanks to everyone for all the hints!
MIX