Register Guidelines E-Books Search Today's Posts Mark Forums Read

Go Back   MobileRead Forums > E-Book Formats > Workshop

Notices

Reply
 
Thread Tools Search this Thread
Old 06-16-2013, 06:27 PM   #1
valyria
Junior Member
valyria began at the beginning.
 
Posts: 6
Karma: 10
Join Date: Jun 2013
Device: iPad
Sidebars in Kindle books

What is the best way to incorporate sidebars in Mobi books?

My idea is to save the sidebars with the text and background as an image and then insert that image into the file. If I tried to leave the sidebar as text, I was concerned that the Kindle text-to-speech function won't work since it won't differentiate between sidebar content and main content.

Anyone have any ideas on what to do with sidebars?
valyria is offline   Reply With Quote
Old 06-18-2013, 10:24 AM   #2
RbnJrg
Wizard
RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.
 
Posts: 1,527
Karma: 6613969
Join Date: Mar 2013
Location: Rosario - Santa Fe - Argentina
Device: Kindle 4 NT
Quote:
Originally Posted by valyria View Post
What is the best way to incorporate sidebars in Mobi books?
If I were you, I'd use a styled div (a float div -to left or right-, with color, borders, custom fonts...what you want). But since my K4NT doesn't support TTS, I woudn't know to tell you how a "div" sidebar will work with that feature.

Quote:
My idea is to save the sidebars with the text and background as an image and then insert that image into the file.
To me, it's not bad idea, especially thinking on TTS.

Below you have an example of a sidebar made with pure css (it works also in ADE). The code I used is:

Code:
div#sidebar {
   float: left;
   width: 50%;
   font-size: 120%;
   text-indent: 0;
   text-align: justify;
   margin: 1em 1em 1em 1ex;
   padding: 1em 1em 1em 1ex;;
   border-top: 6px solid black;
   border-bottom: 6px solid black;
}

.fl {
   display: table-cell;
   width: 0.3em;
   font-size: 8em;
   line-height: 80%;
   color: rgb(192, 192, 192);
}

.tf {
   display: table-cell;
   vertical-align: bottom;
   padding-left: 0.5em;
}
and in the .html file:

Code:
<div id="sidebar">
    <div class="fl">
      “
    </div>

    <div class="tf">
       ... Some text...
    </div>
</div>
Regards
Rubén
Attached Thumbnails
Click image for larger version

Name:	sidebar.jpg
Views:	444
Size:	92.4 KB
ID:	107109  
Attached Files
File Type: epub sidebar.epub (2.8 KB, 248 views)

Last edited by RbnJrg; 06-18-2013 at 10:34 AM.
RbnJrg is offline   Reply With Quote
Old 06-18-2013, 05:17 PM   #3
Hitch
Bookmaker & Cat Slave
Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.
 
Hitch's Avatar
 
Posts: 11,445
Karma: 157030631
Join Date: Apr 2010
Location: Phoenix, AZ
Device: K2, iPad, KFire, PPW, Voyage, NookColor. 2 Droid, Oasis, Boox Note2
Quote:
Originally Posted by RbnJrg View Post
If I were you, I'd use a styled div (a float div -to left or right-, with color, borders, custom fonts...what you want). But since my K4NT doesn't support TTS, I woudn't know to tell you how a "div" sidebar will work with that feature.
<snip the code>

Regards
Rubén
Rubén:

Sorry, only glanced at this: what's the fallback for K7?

Hitch
Hitch is offline   Reply With Quote
Old 06-18-2013, 06:06 PM   #4
RbnJrg
Wizard
RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.
 
Posts: 1,527
Karma: 6613969
Join Date: Mar 2013
Location: Rosario - Santa Fe - Argentina
Device: Kindle 4 NT
Quote:
Originally Posted by Hitch View Post
Rubén:

Sorry, only glanced at this: what's the fallback for K7?

Hitch
Hi Hitch;

For K7 things are difficult Under K7 you better forget about the sidebars If that is the case, then Valyria will have to make magic in order to incorporate them. Of course, we can have media queries to manage some code for mobi8 and some code for mobi7 but, what code for mobi7? Right now I can't think of anything

Regards
Rubén

Last edited by RbnJrg; 06-18-2013 at 06:12 PM.
RbnJrg is offline   Reply With Quote
Old 06-18-2013, 06:41 PM   #5
Hitch
Bookmaker & Cat Slave
Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.
 
Hitch's Avatar
 
Posts: 11,445
Karma: 157030631
Join Date: Apr 2010
Location: Phoenix, AZ
Device: K2, iPad, KFire, PPW, Voyage, NookColor. 2 Droid, Oasis, Boox Note2
Quote:
Originally Posted by RbnJrg View Post
Hi Hitch;

For K7 things are difficult Under K7 you better forget about the sidebars If that is the case, then Valyria will have to make magic in order to incorporate them. Of course, we can have media queries to manage some code for mobi8 and some code for mobi7 but, what code for mobi7? Right now I can't think of anything

Regards
Rubén
Rubén:

Well, that's kind of my point. It's not clear to me that the OP knows that this solution won't work for millions of e-ink Kindles. I mean, not only will it not work, it'll be an unreadable mess. Nor will it work to make them as images and cram them, floating, into the text, as K7 can't float images. There's a solution, that would work both in K8 and K7, but it requires a lot of "hands in file" time and coding.

A better solution is to come up with a box-like formatting that will work across all devices, particularly for a beginner. I don't know what this person's skill level is, as asking about using sidebars for a MOBI file in the first place somewhat indicates an unfamiliarity with MOBI formatting.

Valyria: Can you tell us what your familiarity and skill level is, so maybe we can help you with something suitable? The coding that Ruben gave you is not going to work unless you're making a fixed-format book for Kindle, and if you're doing that, you're going to need a mess of additional formatting as well. Is this for your personal use or do you plan to put it on sale, and if the latter, are you trying to make a fixed-format book that will be limited to K8 devices only?

Hitch
Hitch is offline   Reply With Quote
Old 06-18-2013, 08:17 PM   #6
RbnJrg
Wizard
RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.
 
Posts: 1,527
Karma: 6613969
Join Date: Mar 2013
Location: Rosario - Santa Fe - Argentina
Device: Kindle 4 NT
Quote:
Originally Posted by valyria View Post
What is the best way to incorporate sidebars in Mobi books?
Hi valyria;

As Hitch told previously, if you plan to build your book for mobi7 (old book type of Kindle) then you can't have sidebars because mobi7 doesn't support the property "float" (nor many other properties ). So when you build a book for Kindle, you have to have a code for mobi8 (the modern type of books) and a code for mobi7 (the old type of books). I could find something that is readible for mobi7 and also allows sidebars in mobi8. The code is the following:

Code:
@media amzn-kf8 { /* this code only applies for mobi8 books*/

hr.m7 {
  display: none; /* horizontal lines are hidden under mobi8 */
}

div#sidebar {
 float: left;
 width: 50%;
 font-size: 120%;
 text-indent: 0em;
 text-align: justify;
 margin: 1em 1em 1em 1ex;
 padding: 1em 1em 1em 1ex;;
 border-top: 6px solid black;
 border-bottom: 6px solid black;
}

.fl {
 display: table-cell;
 width: 0.3em;
 font-size: 8em;
 line-height: 80%;
 color: rgb(192, 192, 192);
}

.tf {
 display: table-cell;
 vertical-align: bottom;
 padding-left: 0.5em;
}
}

@media amzn-mobi {  /* this code only applies for mobi7 books*/
hr.m7 {
  margin-top: 0.25em;
  margin-bottom: 0.25em;
 }

div#sidebar {
 text-align: center;
}

.fl {
 display: none; /* this class is hidden under mobi7 */
}

.tf {
 font-size: 1.2em;
 font-weight: bold;
 margin-left: 20%;
}
}
and in the .html page:

Code:
<hr class="m7" />

<div id="sidebar">
    <div class="fl">
      “
    </div>

    <div class="tf">
    ...sometext...
    </div>
</div>

<hr class="m7" />
Below you can see a screenshot about how the book looks in mobi8 and in mobi7.

Regards
Rubén
Attached Thumbnails
Click image for larger version

Name:	screen_shot-18501.gif
Views:	377
Size:	37.0 KB
ID:	107131   Click image for larger version

Name:	sidebar2.jpg
Views:	423
Size:	60.4 KB
ID:	107132  
Attached Files
File Type: epub sidebar.epub (3.0 KB, 265 views)
RbnJrg is offline   Reply With Quote
Old 06-22-2013, 06:56 AM   #7
PoP
 curly᷂͓̫̙᷊̥̮̾ͯͤͭͬͦͨ ʎʌɹnɔ
PoP ought to be getting tired of karma fortunes by now.PoP ought to be getting tired of karma fortunes by now.PoP ought to be getting tired of karma fortunes by now.PoP ought to be getting tired of karma fortunes by now.PoP ought to be getting tired of karma fortunes by now.PoP ought to be getting tired of karma fortunes by now.PoP ought to be getting tired of karma fortunes by now.PoP ought to be getting tired of karma fortunes by now.PoP ought to be getting tired of karma fortunes by now.PoP ought to be getting tired of karma fortunes by now.PoP ought to be getting tired of karma fortunes by now.
 
PoP's Avatar
 
Posts: 3,002
Karma: 50506927
Join Date: Dec 2010
Location: ♁ ᴺ₄₅°₃₀' ᵂ₇₃°₃₇' ±₆₀"
Device: K3₃.₄.₃ PW3&4₅.₁₃.₃
Quote:
Originally Posted by valyria View Post
...
If I tried to leave the sidebar as text, I was concerned that the Kindle text-to-speech function won't work since it won't differentiate between sidebar content and main content
...
Quote:
Originally Posted by RbnJrg View Post
If I were you, I'd use a styled div (a float div -to left or right-, with color, borders, custom fonts...what you want). But since my K4NT doesn't support TTS, I woudn't know to tell you how a "div" sidebar will work with that feature
....
Just to report my Kindle Keyboard 3.4 TTS results : The normal text is spoken and as the ereader encounters the sidebar text, it speaks all of it and then resumes speaking the normal text. That happens regardless of the way the sidebar is displayed, floating left or as a simple insert.
PoP is offline   Reply With Quote
Old 06-22-2013, 01:07 PM   #8
DaleDe
Grand Sorcerer
DaleDe ought to be getting tired of karma fortunes by now.DaleDe ought to be getting tired of karma fortunes by now.DaleDe ought to be getting tired of karma fortunes by now.DaleDe ought to be getting tired of karma fortunes by now.DaleDe ought to be getting tired of karma fortunes by now.DaleDe ought to be getting tired of karma fortunes by now.DaleDe ought to be getting tired of karma fortunes by now.DaleDe ought to be getting tired of karma fortunes by now.DaleDe ought to be getting tired of karma fortunes by now.DaleDe ought to be getting tired of karma fortunes by now.DaleDe ought to be getting tired of karma fortunes by now.
 
DaleDe's Avatar
 
Posts: 11,470
Karma: 13095790
Join Date: Aug 2007
Location: Grass Valley, CA
Device: EB 1150, EZ Reader, Literati, iPad 2 & Air 2, iPhone 7
Quote:
Originally Posted by PoP View Post
Just to report my Kindle Keyboard 3.4 TTS results : The normal text is spoken and as the ereader encounters the sidebar text, it speaks all of it and then resumes speaking the normal text. That happens regardless of the way the sidebar is displayed, floating left or as a simple insert.
this is often what the user would do also so I would think this is ok. A sidebar should not start inside a paragraph for this reason.

Dale
DaleDe is offline   Reply With Quote
Reply

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
Kindle Guide: How To FInd ALL Free Books & Free Audio Books for Kindle iksanivica Self-Promotions by Authors and Publishers 0 12-30-2012 05:43 PM
Free (Kindle/Nook)(some at Sony/iBooks) Six books from Writers Digest Books arcadata Deals and Resources (No Self-Promotion or Affiliate Links) 12 11-13-2011 02:10 PM
Jeff Bezos on Kindle Fire presentation : Physical books vs. Kindle Books sold Kris777 General Discussions 1 09-30-2011 01:15 AM
Sidebars on Kindle? TravellingTwo Amazon Kindle 10 04-15-2011 01:32 AM
Sidebars Across Multiple Pages Rand Brittain Sigil 0 01-08-2011 12:11 AM


All times are GMT -4. The time now is 01:55 AM.


MobileRead.com is a privately owned, operated and funded community.