Image as Header for Chapter - Page 2

Peter21 · 11-30-2013, 01:27 AM

Quote:

Originally Posted by Toxaris

Sure, no problem. Put this in your stylesheet:

Code:

.hidden { display: none; }

Then use the following in your HTML:

Code:

<h1 class="hidden">This is your hidden title.</h1><div>your image</div>

Word of warning. You can also use 'display: hidden', but that will occupy space. It will effectively show the header, but make the text color the same as the background. With 'display: none' it will not be displayed at all and will not occupy space on the page.

This works, but the text in the TOC for this chapter is now blue. The other chapter headings, also within h2 tags (I am using h2 rather than h1) are black in the TOC.....not sure why?

Thanks to all.

Toxaris · 11-30-2013, 02:16 AM

That does not make sense, as there are no anchors in the code I have shown. How does the code in your file looks like? There might be an inheritance issue.

Peter21 · 11-30-2013, 03:16 AM

Quote:

Originally Posted by Toxaris

That does not make sense, as there are no anchors in the code I have shown. How does the code in your file looks like? There might be an inheritance issue.

<body>
<h2 class="hidden">Introduction</h2>

<div><img alt="overviewmap" src="../Images/overviewmap.jpg" /></div>

relevant css is

.hidden { display: none; }

h2 {
margin-top:1em;
font-size: 150%;
text-indent: 0em;
font-style: italic;
text-align:center;
}

Toxaris · 11-30-2013, 03:32 PM

Very strange. The TOC is generated I presume? What is the code for the TOC?

eschwartz · 11-30-2013, 10:28 PM

Quote:

Originally Posted by Peter21

Thanks hitch

This is the code I used:
<h2 title="Introduction"><img alt="overviewmap" src="../Images/overviewmap.jpg" /></h2>

The book will be converted to a .mobi file, which I am previewing using kindlegen.
On the first run this line came out blue in the TOC; I got round this with the following line in CSS:
a, href {text-decoration: none; color: black;}

which I guess will turn all links black...a bit clumsy maybe? Any suggestions very welcome.

Peter

What's wrong with blue links?

When I read my books in calibre viewer, I am pretty sure every link is blue, in every one of my books, so it seems to be quite the trend.

No one will notice it on an e-ink reader, and even the people reading on a tablet/PC will probably not care at all, and in fact be used to it.

Jellby · 12-01-2013, 02:40 AM

Quote:

Originally Posted by eschwartz

What's wrong with blue links?

I hate them. They look default, webpage-ish and unprofessional.

Quote:

No one will notice it on an e-ink reader,

They will look grey and not black. And worse yet if they are underlined. I don't need an underline or colour change to tell me a TOC entry is a link.

Quote:

and even the people reading on a tablet/PC will probably not care at all, and in fact be used to it.

Most people will not care, that I agree with. But you see some do

eschwartz · 12-01-2013, 03:25 AM

On my e-ink reader, links I know are blue in calibre are black, not gray on the Kindle Touch.

I have noticed in Harry Potter the css "a {color:inherit}" is rendering links as black text. Not sure why this would do it, but it has done the trick in several browser-based readers. It works nicely with night mode, too.

Toxaris · 12-01-2013, 03:44 AM

The issue must be in the TOC, not in the actual header itself.

Peter21 · 12-02-2013, 07:04 AM

Quote:

Originally Posted by Toxaris

The issue must be in the TOC, not in the actual header itself.

This is the TOC code, generated by sigil.
Only the introduction entry is in blue.

<?xml version="1.0" encoding="UTF-8" standalone="no" ?>
<!DOCTYPE ncx PUBLIC "-//NISO//DTD ncx 2005-1//EN"
"http://www.daisy.org/z3986/2005/ncx-2005-1.dtd">
<ncx xmlns="http://www.daisy.org/z3986/2005/ncx/" version="2005-1">
<head>
<meta content="urn:uuid:8d2bf5fc-b9ba-4644-8817-f53dd144d9f0" name="dtb:uid"/>
<meta content="1" name="dtb:depth"/>
<meta content="0" name="dtb:totalPageCount"/>
<meta content="0" name="dtb:maxPageNumber"/>
</head>
<docTitle>
<text>Motor Homing in the Dordogne and the Garonne</text>
</docTitle>
<navMap>
<navPoint id="navPoint-1" playOrder="1">
<navLabel>
<text>Introduction</text>
</navLabel>
<content src="Text/introduction.xhtml"/>
</navPoint>
<navPoint id="navPoint-2" playOrder="2">
<navLabel>
<text>Campsites in the Medoc</text>
</navLabel>
<content src="Text/Campsites%20Medoc.xhtml"/>
</navPoint>
<navPoint id="navPoint-3" playOrder="3">
<navLabel>
<text>Campsites West of Bordeaux</text>
</navLabel>
<content src="Text/siteswestofbordeaux.xhtml"/>
</navPoint>
<navPoint id="navPoint-4" playOrder="4">
<navLabel>
<text>Example Images</text>
</navLabel>
<content src="Text/Example%20Images.xhtml"/>
</navPoint>
</navMap>
</ncx>

Jellby · 12-02-2013, 10:15 AM

There's no styling (there can't be) in the NCX file. So this is either something the reader is creating by itself, or you should be looking into a different file (an inline TOC).

Hitch · 12-02-2013, 01:46 PM

Quote:

Originally Posted by Peter21

Thanks hitch

This is the code I used:
<h2 title="Introduction"><img alt="overviewmap" src="../Images/overviewmap.jpg" /></h2>

The book will be converted to a .mobi file, which I am previewing using kindlegen.
On the first run this line came out blue in the TOC; I got round this with the following line in CSS:
a, href {text-decoration: none; color: black;}

which I guess will turn all links black...a bit clumsy maybe? Any suggestions very welcome.

Peter

Quote:

Originally Posted by Jellby

I hate them. They look default, webpage-ish and unprofessional.

They will look grey and not black. And worse yet if they are underlined. I don't need an underline or colour change to tell me a TOC entry is a link.

Most people will not care, that I agree with. But you see some do

Jellby:

Given the problem with night-mode, and that many readers don't recognize color:inherit for the color, what are you doing for links that need to be recognized as links in the book? And does whatever you do work on all platforms?

Hitch

Jellby · 12-02-2013, 02:10 PM

Quote:

Originally Posted by Hitch

Given the problem with night-mode, and that many readers don't recognize color:inherit for the color, what are you doing for links that need to be recognized as links in the book? And does whatever you do work on all platforms?

I don't claim to have the perfect solution.

Personally, I don't often find, if ever, links that must be recognized as links. As I think I have said elsewhere, I, as a user, expect some "obvious" things to be links, like references to chapter names or numbers, footnotes, etc. Those, I style with "color: inherit; text-decoration: none". Fortunately the reader I use supports that, and I don't care too much about those that don't, since I don't have clients

If I was asked to make links stand out, I'd probably choose some colour other than blue (at least change the hue and quality of the default blue) and/or add a border instead of an underline, just to be different.

This applies to the body of a book. I don't care so much about how links may look in the copyright page (when you may have some URL links) or, for instance, the "back" link in footnotes.

Hitch · 12-02-2013, 03:35 PM

Quote:

Originally Posted by Jellby

I don't claim to have the perfect solution.

Personally, I don't often find, if ever, links that must be recognized as links. As I think I have said elsewhere, I, as a user, expect some "obvious" things to be links, like references to chapter names or numbers, footnotes, etc. Those, I style with "color: inherit; text-decoration: none". Fortunately the reader I use supports that, and I don't care too much about those that don't, since I don't have clients

If I was asked to make links stand out, I'd probably choose some colour other than blue (at least change the hue and quality of the default blue) and/or add a border instead of an underline, just to be different.

This applies to the body of a book. I don't care so much about how links may look in the copyright page (when you may have some URL links) or, for instance, the "back" link in footnotes.

Jellby:

To steal a line from "Steel Magnolias," you know that I love ya better than my luggage, (and I'm always hot for your CSS {smile}), but seriously, as you don't have clients, and you're only making books to meet your own expectations, well, *&^%$#@!

I mean...you don't have to worry that readers won't see the links, or "get" that they are links; you don't have clients that don't understand that night-mode won't work if you have black links...that's an entirely different world.

We have a different environment, plus, for the vast, vast, vast majority of our books, we have Amazon Big Daddy looking over our shoulders. Whole different world. Trust me, if inherit worked everywhere, I'd bloody use it.

Hitch

Peter21 · 12-03-2013, 07:44 AM

It is getting better, but still not resolved....

I am writing the ebook using sigil on a mac book air, running OSX version 10.9 (Mavericks). Mavericks has a built in epub reader (ibooks) and when i preview the epub on his, the last heading in the TOC clicked on is always blue...so looks a little amateurish.

However if the epub is exported to an iPad...by syncing through iTunes...the TOC looks good on the iPad's version of ibooks....no sign of a dodgy blue link...so far so good.

When the epub is converted to a .mobi file, it previews OK on the kindle previewer on the laptop, but when sent to the iPad, (via the 'send to kindle" app) to be checked on the iPad kindle reader, the TOC is greyed out....no index ...so what's going on there?

Toxaris · 12-03-2013, 09:41 AM

An ePUB version 2 uses the NCX as a TOC. You can also include an external TOC, which is just a HTML page with links. Although it is called external, it is just a chapter in the ePUB. As of version 3, the NCX is deprecated.
The mobi format (regardless of the version) does not support the NCX because it is a different format altogether. So, for a mobi you need the external TOC. I believe that some conversion programs can create an external TOC based on the NCX. If you use another conversion and do not have an external TOC in the ePUB, you will end up with no TOC in your mobi.

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Chapter Break Image Problem	Fidney	Calibre	2	04-22-2012 07:25 AM
Image header on the actual auto-TOC generated page?	Muckraker	Calibre	1	06-05-2011 10:57 AM
Using images to make chapter header fonts in Kindle (opinions?)	Stodder	Kindle Formats	1	05-18-2011 12:58 AM
Strange chapter header issue?	bfollowell	Kindle Formats	27	04-05-2011 05:58 PM
Image maps as Chapter Headings?	kjk	Sigil	6	10-17-2009 06:27 PM

11-30-2013, 02:16 AM	#17
Toxaris Wizard Posts: 4,520 Karma: 121692313 Join Date: Oct 2009 Location: Heemskerk, NL Device: PRS-T1, Kobo Touch, Kobo Aura	That does not make sense, as there are no anchors in the code I have shown. How does the code in your file looks like? There might be an inheritance issue.

11-30-2013, 03:32 PM	#19
Toxaris Wizard Posts: 4,520 Karma: 121692313 Join Date: Oct 2009 Location: Heemskerk, NL Device: PRS-T1, Kobo Touch, Kobo Aura	Very strange. The TOC is generated I presume? What is the code for the TOC?

12-01-2013, 03:25 AM	#22
eschwartz Ex-Helpdesk Junkie Posts: 19,421 Karma: 85397180 Join Date: Nov 2012 Location: The Beaten Path, USA, Roundworld, This Side of Infinity Device: Kindle Touch fw5.3.7 (Wifi only)	On my e-ink reader, links I know are blue in calibre are black, not gray on the Kindle Touch. I have noticed in Harry Potter the css "a {color:inherit}" is rendering links as black text. Not sure why this would do it, but it has done the trick in several browser-based readers. It works nicely with night mode, too.

12-01-2013, 03:44 AM	#23
Toxaris Wizard Posts: 4,520 Karma: 121692313 Join Date: Oct 2009 Location: Heemskerk, NL Device: PRS-T1, Kobo Touch, Kobo Aura	The issue must be in the TOC, not in the actual header itself.

12-02-2013, 10:15 AM	#25
Jellby frumious Bandersnatch Posts: 7,523 Karma: 19000001 Join Date: Jan 2008 Location: Spaniard in Sweden Device: Cybook Orizon, Kobo Aura	There's no styling (there can't be) in the NCX file. So this is either something the reader is creating by itself, or you should be looking into a different file (an inline TOC).

12-03-2013, 07:44 AM	#29
Peter21 Enthusiast Posts: 29 Karma: 12580 Join Date: Aug 2013 Location: UK Device: iPad 4	It is getting better, but still not resolved.... I am writing the ebook using sigil on a mac book air, running OSX version 10.9 (Mavericks). Mavericks has a built in epub reader (ibooks) and when i preview the epub on his, the last heading in the TOC clicked on is always blue...so looks a little amateurish. However if the epub is exported to an iPad...by syncing through iTunes...the TOC looks good on the iPad's version of ibooks....no sign of a dodgy blue link...so far so good. When the epub is converted to a .mobi file, it previews OK on the kindle previewer on the laptop, but when sent to the iPad, (via the 'send to kindle" app) to be checked on the iPad kindle reader, the TOC is greyed out....no index ...so what's going on there?

12-03-2013, 09:41 AM	#30
Toxaris Wizard Posts: 4,520 Karma: 121692313 Join Date: Oct 2009 Location: Heemskerk, NL Device: PRS-T1, Kobo Touch, Kobo Aura	An ePUB version 2 uses the NCX as a TOC. You can also include an external TOC, which is just a HTML page with links. Although it is called external, it is just a chapter in the ePUB. As of version 3, the NCX is deprecated. The mobi format (regardless of the version) does not support the NCX because it is a different format altogether. So, for a mobi you need the external TOC. I believe that some conversion programs can create an external TOC based on the NCX. If you use another conversion and do not have an external TOC in the ePUB, you will end up with no TOC in your mobi.

Advert

Advert