09-17-2010, 10:08 PM | #1 |
Fanatic
Posts: 527
Karma: 1048576
Join Date: May 2009
Device: bebook; prs-950; nook simple touch; HTC Jetstream tablet
|
hotlinking png image
I wondered if anyone could help me with this problem.
I'd like to construct a hotlink TOC with links to images in my epub file. Here's the TOC: <p class="noindent"><a href="../Text/Section003.xhtml#frontispiece.png">Frontispiece.</a></p> and here's the .png image code in the epub Section0003.xhtml: <div class="center"><img alt="frontispiece" class="size-1" src="../Images/frontispiece.png" /></div> </body> This works perfectly in Adobe DE on my pc (I don't have a touch screen ereader yet so can't check on a reader), but it gives a validation error with ThreePress validation check. What must I do to eliminate the validation error?? Perhaps someone knows about an epub file on MR that has already solved my probem? |
09-17-2010, 10:21 PM | #2 |
Wizzard
Posts: 11,517
Karma: 33048258
Join Date: Mar 2010
Location: Roundworld
Device: Kindle 2 International, Sony PRS-T1, BlackBerry PlayBook, Acer Iconia
|
Forgive me if I'm overlooking something really obvious, but if you wanted to hotlink to an image, would you not point the entry in your TOC directly to "../Images/frontispiece.png" and not out to "../Text/Section003.xhtml#frontispiece.png" which implies an id or name="frontispiece.png" attached to a tag somewhere in the xhtml of Section003?
Or if by hotlinking, you mean you just want to have it jump directly to that part of Section003 where the image is shown, and not just to the image file itself, then you'll be wanting to add said id="frontispiece" to either the <img> or <div> tag immediately preceding, and have your TOC code as "../Text/Section003.xhtml#frontispiece" or whatever you choose to id it as. Hope this helps. |
Advert | |
|
09-17-2010, 11:07 PM | #3 |
Fanatic
Posts: 527
Karma: 1048576
Join Date: May 2009
Device: bebook; prs-950; nook simple touch; HTC Jetstream tablet
|
Thanks ATDrake,
I tried the first suggestion "../Images/frontispiece.png" and that won't work with Adobe DE. I had also had tried earlier to use the id="frontispiece.png" in the <div> and in the <img> tag but neither worked either (also tried id="frontispiece"). Perhaps, though, I'm doing something wrong - I'll work on your suggestions tomorrow and see if I have any better success. Bob Last edited by bobcdy; 09-17-2010 at 11:10 PM. |
09-17-2010, 11:31 PM | #4 |
Wizzard
Posts: 11,517
Karma: 33048258
Join Date: Mar 2010
Location: Roundworld
Device: Kindle 2 International, Sony PRS-T1, BlackBerry PlayBook, Acer Iconia
|
Well, quite possibly you're not doing anything technically wrong and it's just ADE being quirky again, especially if it's not obeying the id="frontispiece.png"/"frontispiece" stuff in Section003 and the # fragment identifier in the TOC matches.
Because it really does look like the ThreePress validation tool would be complaining about the original corresponding id="frontispiece.png" not being found if it's linked from the TOC but you didn't have it somewhere in your text. Though perhaps it's caught on some completely different error like an unclosed tag or something else which just happens to be in the vicinity of your hotlinking code. Anyway, good luck and hope it all works out for you. |
09-17-2010, 11:32 PM | #5 |
Fanatic
Posts: 527
Karma: 1048576
Join Date: May 2009
Device: bebook; prs-950; nook simple touch; HTC Jetstream tablet
|
I found that Sigil works perfectly with ATDrakes first suggestion "../Images/frontispiece.png", but Adobe DE will not. Does Adobe DE have a bug about hotlinking images? Perhaps the only solution is to live with the epub validation errors, because all works perfectly with Adobe DE in spite of the errors?
Bob The validation error check indicates a fragment identifier is not defined: "ERROR: An Introduction to Geology, 2nd Ed_a.epub/OEBPS /Text/TOC.xhtml(67): 'frontispiece.png': fragment identifier is not defined in 'OEBPS/Text/Frontispiece.xhtml'" ER Last edited by bobcdy; 09-17-2010 at 11:36 PM. Reason: added info about validation error type. |
Advert | |
|
09-18-2010, 12:26 AM | #6 |
Fanatic
Posts: 527
Karma: 1048576
Join Date: May 2009
Device: bebook; prs-950; nook simple touch; HTC Jetstream tablet
|
Well, after experimenting a bit as far as I can determine, simply changing:
<p class="noindent"><a href="../Text/Section003.html#Frontispiece.png">Frontispiece.</a></p> to: <p class="noindent"><a href="../Text/Section003.xhtml">Frontispiece.</a></p> works with Adobe DE because Section003.xhtml only contains the frontispiece.png image, and gives no validation errors because there is no missing defined identifier. Bob |
09-18-2010, 04:21 AM | #7 | |
Bookmaker & Cat Slave
Posts: 11,482
Karma: 158448243
Join Date: Apr 2010
Location: Phoenix, AZ
Device: K2, iPad, KFire, PPW, Voyage, NookColor. 2 Droid, Oasis, Boox Note2
|
Quote:
I must be missing something--you can do this easily with Sigil, and it will validate perfectly in 1.05 EPUBCheck. Just open the image "page" up in CV, and do this: Code:
<div class="center"><h1 title="whatever you want it to say in the TOC"><img alt="frontispiece" class="size-1" src="../Images/frontispiece.png" /></h1></div> </body> If there's something else going on that I've missed or don't understand, sorry; otherwise, hope this is useful. Hitch |
|
09-18-2010, 11:29 PM | #8 |
Fanatic
Posts: 527
Karma: 1048576
Join Date: May 2009
Device: bebook; prs-950; nook simple touch; HTC Jetstream tablet
|
Hitch
Actually I do that also for a Sigil-derived external TOC, but I was trying to do an internal href hotlink TOC in addition to the standard external TOC. The problem with the external TOC for an image is that it requires a caption associated with it (although one can eliminate it with a white text color, it still takes up space that reduces the maximum viewable image size) so I generally don't show images in the external TOC. ATDrake's first suggestion "../Images/frontispiece.png", for an href toc works with Sigil and would work with a web html page, but I could not get it to work with Adobe DE. I'm sure there are more elegant and correct ways to accomplish what I wanted, but my last post (yesterday, 11:26 pm) showed a simple-minded way to work around my validation error problem. Bob |
09-19-2010, 02:27 AM | #9 | |
Bookmaker & Cat Slave
Posts: 11,482
Karma: 158448243
Join Date: Apr 2010
Location: Phoenix, AZ
Device: K2, iPad, KFire, PPW, Voyage, NookColor. 2 Droid, Oasis, Boox Note2
|
Quote:
I make kids' books like this every day. No text on the page; all the text in the header tags to create a TOC. I use it for illustrations, imaged tables; I use it for authors who want something like "Chapter 1" in the actual TOC, but only want the number itself on the page, e.g., "1." Please look again at the example I gave you, inside the code box. No text ON the page; only in the TOC. Hitch |
|
09-19-2010, 10:27 AM | #10 | |
Well trained by Cats
Posts: 30,406
Karma: 58055234
Join Date: Aug 2009
Location: The Central Coast of California
Device: Kobo Libra2,Kobo Aura2v1, K4NT(Fixed: New Bat.), Galaxy Tab A
|
Quote:
He thought I was the only one doing this and closed the ticket. |
|
09-19-2010, 04:54 PM | #11 | |
Bookmaker & Cat Slave
Posts: 11,482
Karma: 158448243
Join Date: Apr 2010
Location: Phoenix, AZ
Device: K2, iPad, KFire, PPW, Voyage, NookColor. 2 Droid, Oasis, Boox Note2
|
Quote:
To be honest, this feature is how I initially became a Sigil-aficionado. I couldn't do hotlinks to illustrations in one author's book in MBP Creator (that I was only doing for Kindle--he did Smashwords for his epub versions, and they look like excrement, FWIW), so I did it in Sigil. From that point forward, I was a Sigil addict. Now I do all epubs first, then ->.mobi. Sigil is absolutely my "go-to" ebook creation software; I do everything in it. Humorously enough, I don't think the OP has come back to this thread, and therefore doesn't know that he CAN do what he wants to do. Bummer. Hitch |
|
09-19-2010, 06:53 PM | #12 |
Not who you think I am...
Posts: 374
Karma: 30283
Join Date: Jan 2010
Location: Honolulu
Device: PocketBook 360 -- Ivory
|
I just tried a cool trick recently to make "invisible" text: set the font size to 0.
|
09-19-2010, 07:58 PM | #13 |
Fanatic
Posts: 527
Karma: 1048576
Join Date: May 2009
Device: bebook; prs-950; nook simple touch; HTC Jetstream tablet
|
Capidamonte - thanks for the 'invisible' text trick. I'll remember it for later.
Hitch - I'll repeat again that I wanted an internal hotlink toc NOT an external toc and my problem was with the internal toc. Please refer to my original post. I'll also remember your approach for the captionless external Sigil TOC; I didn't realize that would work. It probably would be best to have the images referred to both in the internal and external tocs because some readers prefer one or the other. If you have any suggestions for a better solution than the one I gave for my problem with internal hotlink image toc and Adobe DE, I'd really appreciate that. Bob |
09-19-2010, 09:44 PM | #14 | |
Wizzard
Posts: 11,517
Karma: 33048258
Join Date: Mar 2010
Location: Roundworld
Device: Kindle 2 International, Sony PRS-T1, BlackBerry PlayBook, Acer Iconia
|
Quote:
Because it seems like that might be slightly easier and perhaps take fewer steps. Of course, if you'd rather get the basic structure in place before fine-tuning the "captions", then that makes sense. Last edited by ATDrake; 09-19-2010 at 09:47 PM. |
|
09-19-2010, 09:46 PM | #15 | |
Not who you think I am...
Posts: 374
Karma: 30283
Join Date: Jan 2010
Location: Honolulu
Device: PocketBook 360 -- Ivory
|
Quote:
As far as I can tell, you seem otherwise valid. I use something similar all the time, and my epubs validate. |
|
|
Similar Threads | ||||
Thread | Thread Starter | Forum | Replies | Last Post |
ERROR: ... .png | saytionne | ePub | 17 | 10-04-2010 07:13 PM |
Strainge PNG Background in Book Details | dml33 | Calibre | 5 | 08-08-2010 10:48 AM |
convert png & jpeg into wmv or mp3; Manga for my phone | Johnnyjohn | Introduce Yourself | 6 | 08-06-2010 01:51 PM |
where to get autorun.xml, icon.png, key.png, lut.bin for PRS-505 | obender | Sony Reader Dev Corner | 2 | 01-25-2009 03:20 PM |
Combining multiple .gif or .png files into a specific PDF page. | Raventhon | 0 | 10-03-2007 01:06 AM |