jpg as a cover, how to adjust it as a 1st page?

shlomof · 02-27-2011, 05:05 PM

Hello,
I had aproblem that when converting one of word doc tempalates to HTML, it would save that format. so I did a workaround and changed the whole 1st page into a sinlge jpg and added it as a cover.

so far so good.

now, when converting it into an epub in calibre I see that the jpg is only on half of the 1st page. how can I make it to automatically adjust itself as a whole page to whatever screen size the user is using?

thanks,
Shlomo

Adjust · 02-27-2011, 05:14 PM

you can adjust the cover in your CSS file image Height = 100%

If you are not sure about how to go about doing that try this Program for editing ePubs.

https://www.mobileread.com/forums/showthread.php?t=52493

shlomof · 02-27-2011, 05:20 PM

Thanks!!!
can you please tell me what exctly is the code to add and where as I"m not a css person...

thanks,
Shlomo

Adjust · 02-27-2011, 05:30 PM

Add this to your template.CSS file. (you can edit it in either a text editor like textwrangler or in dreamweaver, something which saves as UTF-8)

PHP Code:


			
.image {

     margin-top: 1em;

     margin-bottom: 1em;

     margin-left: 1.2em;

     text-align: center;

     max-height: 100%

}

Then open your Cover.XHTML (or whatever it's called and change the code to match mine

PHP Code:


			
<?xml version="1.0" encoding="utf-8"?>

<!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>Cover</title>

        <link href="template.css" rel="stylesheet" type="text/css" />

    </head>

    <body>

        <div id="cover">

            <div class="image">

                <img src="images/Cover.jpg" alt="Cover.jpg" height="100%" />

    </div>

    </div>

    </body>

</html>

02-27-2011, 05:05 PM	#1
shlomof Junior Member Posts: 9 Karma: 10 Join Date: Feb 2011 Device: none	jpg as a cover, how to adjust it as a 1st page? Hello, I had aproblem that when converting one of word doc tempalates to HTML, it would save that format. so I did a workaround and changed the whole 1st page into a sinlge jpg and added it as a cover. so far so good. now, when converting it into an epub in calibre I see that the jpg is only on half of the 1st page. how can I make it to automatically adjust itself as a whole page to whatever screen size the user is using? thanks, Shlomo

02-27-2011, 05:30 PM	#4
Adjust Addict Posts: 351 Karma: 70000 Join Date: Jul 2010 Location: Australia Device: ADE, iPad	Add this to your template.CSS file. (you can edit it in either a text editor like textwrangler or in dreamweaver, something which saves as UTF-8) PHP Code: `.image { margin-top: 1em; margin-bottom: 1em; margin-left: 1.2em; text-align: center; max-height: 100% }` Then open your Cover.XHTML (or whatever it's called and change the code to match mine PHP Code: <?xml version="1.0" encoding="utf-8"?> <!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>Cover</title> <link href="template.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="cover"> <div class="image"> <img src="images/Cover.jpg" alt="Cover.jpg" height="100%" /> </div> </div> </body> </html>

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
"add metadata as 1st page" won't work on batch [send to device]	Bellychaser	Devices	3	01-25-2011 03:25 PM
Calibre changes size of cover.jpg when copy to new Libary --> see PDF attached	icq70610	Calibre	5	10-02-2010 01:29 PM
JPG cover files not removed from Novel	js4c	Calibre	5	08-03-2010 09:27 PM
Can't update cover if file cover.jpg is already in the directory ?	q345	Calibre	14	06-08-2010 06:23 AM
PRS-900 Problem with 1st line on a page cut off?	Marcy	Sony Reader	7	02-17-2010 01:20 AM

02-27-2011, 05:14 PM	#2
Adjust Addict Posts: 351 Karma: 70000 Join Date: Jul 2010 Location: Australia Device: ADE, iPad	you can adjust the cover in your CSS file image Height = 100% If you are not sure about how to go about doing that try this Program for editing ePubs. https://www.mobileread.com/forums/showthread.php?t=52493

02-27-2011, 05:20 PM	#3
shlomof Junior Member Posts: 9 Karma: 10 Join Date: Feb 2011 Device: none	Thanks!!! can you please tell me what exctly is the code to add and where as I"m not a css person... thanks, Shlomo