Hi
Well, I have done it! I have created a script in php which grabs all the parts of the book in a mysql db and creates automatically the series of files for the ebook in epub format. For me it is worth to do that as I have a series of stories in db that I can publish easily that way. I also like the idea of automating the creation of the book and the control over the layout. Anyway this is working for me. If anyone is interested, I am willing to share the script.
The first chapter of the book can be seen and downloaded on the
Kids of Nature website. Please send me your comments and test the file on different reader (I only have an iPhone).
I have also posted some request for advise on the
upload forum.
Here I would like to discuss 2 technical issues :
1/ Image size. The way I have done it does not seem to work nicely for inline images, or when there are several images on the same line. See epub file or below. Please advise.
2/ TOC. It is too long because of the many emails in the book for which of them I have created a separated xhtml file, so they always start at the top of the page. If I drop the email in the navpoint TOC, the flow of the book is going from chapter to chapter only. How can I hide the email TOC but keep the flow through them?
CSS
p.image-cover { margin-bottom:0em; margin-top:0em; margin-right:0em; margin-left:0em; text-align: center; }
p.image-center { margin-bottom: 1em; margin-top: 1em; margin-right:0em; margin-left:0em; text-align: center; }
span.image-right { float:right; margin-top: 0.2em; margin-bottom: 0.2em; margin-left:1em; margin-right:1em; }
span.image-left0 { float:left; margin-top: 0.2em; margin-bottom: 0.2em; margin-left:-1em; margin-right:1em; }
span.image-right0 { float:right; margin-top: 0.2em; margin-bottom: 0.2em; margin-left:1em; margin-right:-1em; }
span.image-left { float:left; margin-top: 0.2em; margin-bottom: 0.2em; margin-left:1em; margin-right:1em; }
span.image-right img, span.image-left img { width: 100%; max-width: 100%; }
span.size40 { width:1em; max-width: 40%; }
.image2 { width:20em; max-width: 45%; }
.image3 { width:15em; max-width:30%; }
.image4 { width:10em; max-width:22%; }
Code samples for images
<p class="image-center"><img class="image4" alt="PG_116209" src="../images/PG_116209.jpg" /> <img class="image4" alt="PG_116201" src="../images/PG_116201.jpg" /> <img class="image4" alt="PG_116482" src="../images/PG_116482.jpg" /> <img class="image4" alt="PG_116215" src="../images/PG_116215.jpg" /></p>
<p class="email-text"><span class="image-right"><img class="image1" alt="Illustration_GlobeBecomingPluto1.gif" src="../images/Illustration_GlobeBecomingPluto1.gif" /></span>James thinks it's his camera that took us there, but I say it's my magic globe.</p>
Paul