Reading EPUB manga on Kobo Glo HD

[acee]

I recently bought some manga from Humble Bundle and was hoping to read it on my Kobo Glo HD, especially since the manga is provided in EPUB.

However, I found that the image sizes in the ebooks are too big, which has them being truncated off the right and bottom edges.

It seems there is no way to zoom out? I also tried using Calibre to "convert" the EPUB files I have using an output profile with a resolution lower than the Kobo Glo HD's screen. However, the result was that the image quality was just reduced. (It looks like the images were scaled down, but then the Kobo Glo HD just scaled them back up again to the same dimensions, which truncates the image again).

Is it something with the DPI settings of the image embedded in the EPUB? Any ideas on how to change this?

[GeoffR]

The most likely(*) problem is that the publisher has used pixel (px) or absolute (in, mm, etc.) sizes in the stylesheet for images, instead iof a screen-relative (%) size. This means that the book will display perfectly on devices with one particular size screen, but images will be too small or too big on all other devices.

Although it is usually quite easy to fix these sorts of publishing problems by editing the stylesheet and/or html files in the book, there are so many different ways the publisher can mess it up that it is hard to describe how to fix it without seeing the relevent parts of the book's stylesheet and html files.

So generally speaking, you need to go through the css and html files in the book to find where the publisher is setting the width and height properties for the images. If they look something like {height:2100px; width:1400px;} then change them to something iike {height:100%; width:auto;} In some cases you might need to change the min-height, max-height,min-width, and max-width properties also.

(*) Edit: Most likely in my experience with ePub novels, but I've never read any manga. There are other things such as margin and padding styles that could cause a similar problem.

[acee]

Thanks! That was exactly it. The CSS had hard-coded width/height in the main div class:

div.page {position: absolute;top: 0px;left: 0px;width: 1194px;height: 1672px;overflow: hidden;background-size: 1194px 1672px;}
img.backgroundImage {position: absolute;top: 0px;left: 0px;width: 100%;margin: 0px;}
div.linkhotspot {position:absolute;}
div.linkhotspot > a {-webkit-tap-highlight-color:rgba(0,0,0,0);}
span.linkhotspot {display:inline-block;width:100%;height:100%;}

I changed it to this and it helps shrink the page down such that the entire page is visible:

div.page {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 95%;
	height: 100%;
	/*overflow: hidden;*/
	background-size: 100% 100%;
}
img.backgroundImage {position: absolute;top: 0px;left: 0px;width: 100%;margin: 0px;}
div.linkhotspot {position:absolute;}
div.linkhotspot > a {-webkit-tap-highlight-color:rgba(0,0,0,0);}
span.linkhotspot {display:inline-block;width:100%;height:100%;}

The only thing is that the title page display is a little off now... it only displays a thin narrow horizontal strip of the original tile page instead of the whole title page. But that's ok for now, the actual pages display ok when reading the EPUB.

Now to see if the CSS is consistent across all of the volumes in the series...!

[davidfor]

@acee: Did the HumbleBundle supply a CBR or CBZ version? When I have looked at comics on my Kobo device, I didn't find the epub versions to be particularly good, or add anything to the experience. The devices can handle CBR and CBZ natively. The pages will be sized to fit the screen and allow zooming. If the Manga pages are suitable to view without any zooming on most pages, this might be the better method.

Having said that...

You might also want to consider sending the books as kepubs. These have the advantage that they allow zooming on the images. The KoboTouchExtended driver is the simplest way to achieve this.

For the cover page problems you are now seeing, is this the cover that calibre added during the conversion? If so, it might be coded differently to the other pages. You will need to check that separately.

And for either epub and kepub viewing, you might want to enable full screen mode. To do this, add the following the the "Kobo eReader.conf" file on the device:

[FeatureSettings]
FullScreenReading=true

If you are using Windows, make sure you use a Unix line-end aware editor when doing this. I recommend Notepad++ for any text editing on Windows.

Once the above lines are added, there is an option in the reading setting to show the header and footer. Unchecking this hides them and lets the page display full screen.

[acee]

Thanks for the tips! I did find that they provide CBZ versions too, but the first time I tried one on my Kobo, it complained that it could not open the file. However, I tried it again with another volume, and it worked great. I already went through editing all the CSS files, but there were a couple volumes that had really odd epubs, where the text was separate from the comic images.. so it's good to know that I can use the CBZ versions of those instead.

I also did try out the full screen option and that helps a lot too, giving me a bit more screen space.

Comics/manga on the Kobo is relatively new to me - I've only been using traditional book epubs from the library and kepubs from the Kobo store so far.

Thanks for your help, GeoffR and davidfor!