Glo prevent glo from resizing images ?

leftright · 05-15-2014, 03:05 AM

All my books are epubs, sideloaded from Calibre.

Images are not displayed full screen in the Glo, I have verified the images and they are well within the Glo's screen size yet it still displays a smaller image in the top right corner.

Any ideas on what I have to do to get the Glo to display the image full screen ?.

I use Sigil and Calibre for editing epubs.

I would like to thank the developers of the various hacks for their efforts, especially the Calibre Kobo plug-in. Fantastic work.

davidfor · 05-15-2014, 03:35 AM

It is probably the code in the epub that is doing it. There are various ways to position and size the image in the book. For the cover, I have good settings, but for images within the book, I am not sure what the best options are. Can you post a sample that we can look at?

GeoffR · 05-15-2014, 03:41 AM

To make the image as big as possible (which will depend on the page margins the user has set), one way is to add height:100% or width:100% to the img style (depending in whether the image is tall or wide):

Code:

<div style="margin:0; padding:0; text-align:center;">
 <img alt="Cover" src="images/cover.jpg" style="height:100%"/>
</div>

another is to use an svg block (e.g. for a 600x900 image):

Code:

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100%" height="100%" viewBox="0 0 600 900" preserveAspectRatio="xMidYMid meet">
 <image width="600" height="900" xlink:href="images/cover.jpg" />
</svg>

Beware that Calibre will reduce the size of the images inside the epub when it transfers the book to the device unless you have the output profile set to "Tablet". This won't affect the final screen size if you use the methods above, but it will reduce the quality of the image significantly. A common mistake is to set the output profile to "Kobo Reader" which refers to the old low-resolution devices, use "Tablet" instead.

leftright · 05-15-2014, 03:45 AM

the code; Many thanks.

<?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">
<head>
<title>The Looming Tower</title>
<link href="../Styles/stylesheet.css" rel="stylesheet" type="text/css" />
<link href="../Styles/page_styles.css" rel="stylesheet" type="text/css" />
</head>

<body class="calibre">
<div class="calibre1" id="fm1">
<p class="fmh"></p><span class="center"><img alt="image" class="calibre2" src="../Images/Wrig_9780307266088_epub_m01_r1.jpg" /></span>
</div>
</body>
</html>

davidfor · 05-15-2014, 03:46 AM

Quote:

Originally Posted by GeoffR

Beware that Calibre will reduce the size of the images inside the epub when it transfers the book to the device unless you have the output profile set to "Tablet". This won't affect the final screen size if you use the methods above, but it will reduce the quality of the image significantly. A common mistake is to set the output profile to "Kobo Reader" which refers to the old low-resolution devices, use "Tablet" instead.

Good suggestions for the images. But, the above is only used during a conversion. When sending a book to a device, the only changes calibre does are to update the metadata and cover.

GeoffR · 05-15-2014, 04:03 AM

Quote:

Originally Posted by leftright

What does the .calibre2 style contain (in stylesheet.css)? You might try adding width:100%; or height:100%; to that style.

leftright · 05-15-2014, 04:04 AM

I did as Geoff suggested by adding height% and it worked, now full screen on the Glo. Outstanding.

<body class="calibre">
<div class="calibre1" id="fm1">
<p><img alt="image" class="calibre2" src="../Images/Wrig_9780307266088_epub_m01_r1.jpg" style="height:100%" /></p>

Many thanks to both of you for your speedy responses.

05-15-2014, 03:05 AM	#1
leftright Addict Posts: 224 Karma: 55704 Join Date: Sep 2013 Device: Kobo Glo	prevent glo from resizing images ? All my books are epubs, sideloaded from Calibre. Images are not displayed full screen in the Glo, I have verified the images and they are well within the Glo's screen size yet it still displays a smaller image in the top right corner. Any ideas on what I have to do to get the Glo to display the image full screen ?. I use Sigil and Calibre for editing epubs. I would like to thank the developers of the various hacks for their efforts, especially the Calibre Kobo plug-in. Fantastic work.

05-15-2014, 03:41 AM	#3
GeoffR Wizard Posts: 3,821 Karma: 19162882 Join Date: Nov 2012 Location: Te Riu-a-Māui Device: Kobo Glo	To make the image as big as possible (which will depend on the page margins the user has set), one way is to add height:100% or width:100% to the img style (depending in whether the image is tall or wide): Code: <div style="margin:0; padding:0; text-align:center;"> <img alt="Cover" src="images/cover.jpg" style="height:100%"/> </div> another is to use an svg block (e.g. for a 600x900 image): Code: <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100%" height="100%" viewBox="0 0 600 900" preserveAspectRatio="xMidYMid meet"> <image width="600" height="900" xlink:href="images/cover.jpg" /> </svg> Beware that Calibre will reduce the size of the images inside the epub when it transfers the book to the device unless you have the output profile set to "Tablet". This won't affect the final screen size if you use the methods above, but it will reduce the quality of the image significantly. A common mistake is to set the output profile to "Kobo Reader" which refers to the old low-resolution devices, use "Tablet" instead.

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
resizing in-line images	pdurrant	ePub	12	08-16-2013 04:08 AM
Resizing multiple images but only if larger than...?	arash84	Workshop	5	08-21-2012 06:51 PM
resizing images in recipes?	schuster	Recipes	5	05-16-2011 11:10 AM
Automatically resizing epub images	dhume01	Conversion	4	03-15-2011 05:45 PM

05-15-2014, 03:35 AM	#2
davidfor Grand Sorcerer Posts: 24,905 Karma: 47303824 Join Date: Jul 2011 Location: Sydney, Australia Device: Kobo:Touch,Glo, AuraH2O, GloHD,AuraONE, ClaraHD, Libra H2O; tolinoepos	It is probably the code in the epub that is doing it. There are various ways to position and size the image in the book. For the cover, I have good settings, but for images within the book, I am not sure what the best options are. Can you post a sample that we can look at?

05-15-2014, 03:45 AM	#4
leftright Addict Posts: 224 Karma: 55704 Join Date: Sep 2013 Device: Kobo Glo	the code; Many thanks. <?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"> <head> <title>The Looming Tower</title> <link href="../Styles/stylesheet.css" rel="stylesheet" type="text/css" /> <link href="../Styles/page_styles.css" rel="stylesheet" type="text/css" /> </head> <body class="calibre"> <div class="calibre1" id="fm1"> <p class="fmh"></p><span class="center"><img alt="image" class="calibre2" src="../Images/Wrig_9780307266088_epub_m01_r1.jpg" /></span> </div> </body> </html>

05-15-2014, 04:04 AM	#7
leftright Addict Posts: 224 Karma: 55704 Join Date: Sep 2013 Device: Kobo Glo	I did as Geoff suggested by adding height% and it worked, now full screen on the Glo. Outstanding. <body class="calibre"> <div class="calibre1" id="fm1"> <p><img alt="image" class="calibre2" src="../Images/Wrig_9780307266088_epub_m01_r1.jpg" style="height:100%" /></p> Many thanks to both of you for your speedy responses.

Advert

Advert