MobileRead Forums - View Single Post - Cover and pictures in e-pub

Turtle91 · 05-05-2019, 11:37 AM

You need to save the image as a file, then add it to the epub. Finally you will need to create a link in your epub to the correct image file. I would recommend using the best resolution image you can find...usually downloading will be better than an embedded image.

In Word you can right click on the image and "Save As Picture". eg. "MyPic.jpg"

Then in your html:

Code:

<div><img alt="" src="../Images/MyPic.jpg" /></div>
/* make sure you have the correct path (inside the epub) to your image file */

or

Code:

<div><img alt="" src="../Images/cover.jpg" /></div>
<div><img alt="" src="../Images/map.jpg" /></div>

or even more advanced - you can wrap it in an SVG container for a full page image like a map or cover:

Code:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>Cover</title>
</head>

<body style="margin:0; padding:0; text-align:center; background-color:black">
  <h1 style="display:none" title="Cover"/>

  <div style="margin:0; padding:0">
    <svg 
           xmlns="http://www.w3.org/2000/svg"
           height="100%" width="100%"
           preserveAspectRatio="xMidYMid meet" version="1.1"
           viewBox="0 0 1066 1600"
           xmlns:xlink="http://www.w3.org/1999/xlink">
       <image width="1066" height="1600" xlink:href="../Images/cover.jpg"/>
    </svg>
  </div>
</body>
</html>