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

Go Back   MobileRead Forums > E-Book Formats > ePub

Notices

Reply
 
Thread Tools Search this Thread
Old 03-11-2013, 05:17 PM   #16
Derek R
Zealot
Derek R began at the beginning.
 
Derek R's Avatar
 
Posts: 104
Karma: 20
Join Date: Jun 2011
Location: County Down, Northern Ireland
Device: none
As a postscript I should add that I've just had a "duh" moment. My wit is obviously getting dulled with age. The dimensions that I should have given for the svg are 900 x 1200 to maintain a 3/4 ratio. You were obviously too polite to point out my idiocy.
Derek R is offline   Reply With Quote
Old 03-13-2013, 08:17 AM   #17
Nigelinspain
Member
Nigelinspain began at the beginning.
 
Posts: 21
Karma: 10
Join Date: Mar 2013
Device: Kindle
Please excuse my ignorance, but where exactly does this code go?

Is it between the <body> and </body> or between the <head> and </head>?

I´ve tried putting this in to a couple of different places but when I view it in book view is Sigil it shows the image the same huge size as before but with a light blue tinted box above it.
Nigelinspain is offline   Reply With Quote
Advert
Old 03-13-2013, 08:26 AM   #18
Derek R
Zealot
Derek R began at the beginning.
 
Derek R's Avatar
 
Posts: 104
Karma: 20
Join Date: Jun 2011
Location: County Down, Northern Ireland
Device: none
Here is the full code for the cover page I created using the svg wrapper:

Code:
<?xml version="1.0" encoding="utf-8" standalone="no"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
  "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
  <title>In the Celtic Past</title>
  <link href="../Styles/style.css" rel="stylesheet" type="text/css" />
</head>

<body>
  <div>
    <svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid meet" version="1.1" viewBox="0 0 1200 1600" xmlns:xlink="http://www.w3.org/1999/xlink">
      <image height="1600" width="1200" xlink:href="../Images/cover.jpg"></image>
    </svg>
  </div>
</body>
</html>
This has worked a treat. Just change the dimensions in the viewBox and image tag to the actual dimensions of your image. Obviously, you would have your own title between the title tags... oh, and change the name of the image if yours isn't "cover.jpg".

Last edited by Derek R; 03-13-2013 at 08:31 AM.
Derek R is offline   Reply With Quote
Old 03-13-2013, 08:27 AM   #19
Pablo
Guru
Pablo ought to be getting tired of karma fortunes by now.Pablo ought to be getting tired of karma fortunes by now.Pablo ought to be getting tired of karma fortunes by now.Pablo ought to be getting tired of karma fortunes by now.Pablo ought to be getting tired of karma fortunes by now.Pablo ought to be getting tired of karma fortunes by now.Pablo ought to be getting tired of karma fortunes by now.Pablo ought to be getting tired of karma fortunes by now.Pablo ought to be getting tired of karma fortunes by now.Pablo ought to be getting tired of karma fortunes by now.Pablo ought to be getting tired of karma fortunes by now.
 
Pablo's Avatar
 
Posts: 970
Karma: 4999999
Join Date: Mar 2009
Location: Rosario, Argentina
Device: SONY PRS-505, PRS-T2
Quote:
Originally Posted by Nigelinspain View Post
Please excuse my ignorance, but where exactly does this code go?

Is it between the <body> and </body> or between the <head> and </head>?

I´ve tried putting this in to a couple of different places but when I view it in book view is Sigil it shows the image the same huge size as before but with a light blue tinted box above it.
The image goes inside the body.
If you see the image in Sigil's Book View, it will scale to fit the size of the view window (keeping aspect ratio, if configured to do so).
Pablo is offline   Reply With Quote
Old 03-13-2013, 10:28 AM   #20
Nigelinspain
Member
Nigelinspain began at the beginning.
 
Posts: 21
Karma: 10
Join Date: Mar 2013
Device: Kindle
Many thanks - that´s very helpful.
Nigelinspain is offline   Reply With Quote
Advert
Old 03-24-2013, 04:53 PM   #21
Alda
Zealot
Alda began at the beginning.
 
Posts: 104
Karma: 22
Join Date: Jun 2010
Device: none
Hello,

I followed the instructions above for my cover image, using this code to wrap it in:

Quote:
<div>
<svg xmlns="http://www.w3.org/2000/svg" height="100%" preserveAspectRatio="xMidYMid meet" version="1.1" viewBox="0 0 783 1200" width="100%" xmlns:xlink="http://www.w3.org/1999/xlink">
<image height="1200" width="783" xlink:href="../Images/cover.jpg"></image>
</svg>
</div>
However, the cover does not show up in Adobe Digital Editions, for some reason (what I'm using to preview the ePub version of my book). It looks fine in Calibre, though.

Anyone have an idea what the problem is?

Thanks!

Alda
Alda is offline   Reply With Quote
Old 03-25-2013, 01:35 AM   #22
dgatwood
Curmudgeon
dgatwood ought to be getting tired of karma fortunes by now.dgatwood ought to be getting tired of karma fortunes by now.dgatwood ought to be getting tired of karma fortunes by now.dgatwood ought to be getting tired of karma fortunes by now.dgatwood ought to be getting tired of karma fortunes by now.dgatwood ought to be getting tired of karma fortunes by now.dgatwood ought to be getting tired of karma fortunes by now.dgatwood ought to be getting tired of karma fortunes by now.dgatwood ought to be getting tired of karma fortunes by now.dgatwood ought to be getting tired of karma fortunes by now.dgatwood ought to be getting tired of karma fortunes by now.
 
dgatwood's Avatar
 
Posts: 629
Karma: 1623086
Join Date: Jan 2012
Device: iPad, iPhone, Nook Simple Touch
*shrugs* Mine works, and the only things obviously different between your snippet and what I'm using for my cover are that my svg tag also has the following:

Code:
    xmlns:svg="http://www.w3.org/2000/svg"
    id="blahblahblah"
and I have a pile of CSS, no standalone="no" in the <?xml ...> tag, and the namespace for SVG declared early on:

Code:
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:svg="http://www.w3.org/2000/svg">
I'd be surprised if any of those differences mattered, though. It might be a difference in what you're doing in the OPF file.
dgatwood is offline   Reply With Quote
Old 03-25-2013, 08:49 AM   #23
Alda
Zealot
Alda began at the beginning.
 
Posts: 104
Karma: 22
Join Date: Jun 2010
Device: none
Very strange. If I just upload a regular cover, without the wrap code above, it appears in ADE. The moment I put in the wrap code, the cover is no longer there.

It's a shame, because the wrap code was working really well in other respects.

So I guess I'm back to square one, wondering what the optimal cover size is to use so it will look good in ADE and elsewhere. Any thoughts?
Alda is offline   Reply With Quote
Old 03-25-2013, 12:01 PM   #24
Turtle91
A Hairy Wizard
Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.
 
Turtle91's Avatar
 
Posts: 3,068
Karma: 18727053
Join Date: Dec 2012
Location: Charleston, SC today
Device: iPhone 11/X/6/iPad 1,2,Air & Air Pro/Surface Pro/Kindle PW & Fire
Quote:
Originally Posted by Alda View Post
So I guess I'm back to square one, wondering what the optimal cover size is to use so it will look good in ADE and elsewhere. Any thoughts?
iBooks and Amazon both have minimum image size requirements for their covers. I would use whichever one is larger - that way you are covered... (Definitely intended )

Then just use your img {max-height:100%; max-width:100%} in your CSS to make sure your image is constrained by whatever your screen size happens to be - while keeping the proper aspect ratio.

Yes, your ePub might be slightly larger because if the larger cover image, but at least it should work properly on all most devices.
Turtle91 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
cover art on purchsed books/ EPUB to EPUB tongsan Library Management 5 05-27-2011 10:23 AM
Convert to ePub - optimal settings paulfiera Calibre 4 01-08-2011 08:29 AM
Optimal Settings in Calibre for creating Kobo eReader EPUB Files lchen Kobo Reader 15 05-07-2010 05:25 PM
Optimal cover size readyread Calibre 4 12-19-2009 12:47 PM
PRS-500 optimal resolution for images? ghostwheel Sony Reader Dev Corner 5 01-01-2007 12:59 PM


All times are GMT -4. The time now is 11:09 AM.


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