An SVG wrapper is just a way to use some of the built-in functionality of an SVG and apply it to a non-SVG image. Something like this:
Code:
<svg xmlns="http://www.w3.org/2000/svg" version="1.1"
xmlns:xlink="http://www.w3.org/1999/xlink"
preserveAspectRatio="xMidYMid meet"
height="100%" width="100%"
viewBox="0 0 512 512">
<image width="512" height="512" xlink:href="../Images/img_faq.png"/>
</svg>
The key functionality is the preserveAspectRatio="xMidYMid meet" which allows the
image to be centered and fill the entire screen while maintaining the correct aspect ratio. The image size is defined (
height,
width)
There are other, more advanced uses, that allow you to add captions and limit the image size so it doesn't take up the full screen.
In Sigil you can set up a template file that will do most of the work for you when you use the "Add Cover" tool. You can find the exact instructions in the
User Guide. I made a template like this for ePub2 (you can make another one for ePub3):
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">
<head>
<title>enter-title</title>
<style type="text/css">
* {padding:0; margin:0; background-color:black}
h1 {display:none}
div {width:97vw; height:97vh ; margin:1.3vh auto}
</style>
</head>
<body>
<h1 title="Cover"/>
<div>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1"
xmlns:xlink="http://www.w3.org/1999/xlink"
preserveAspectRatio="xMidYMid meet"
height="100%" width="100%"
viewBox="0 0 SGC_IMAGE_WIDTH SGC_IMAGE_HEIGHT">
<image width="SGC_IMAGE_WIDTH" height="SGC_IMAGE_HEIGHT" xlink:href="SGC_IMAGE_FILENAME"/>
</svg>
</div>
</body>
</html>
I use the surrounding <div> and the leading <h1> to help with styling and ToC generation.
This works great for a cover page, but if you want to make additional pages then you can either copy/paste the appropriate section, or you could use one of the plugins from the
Sigil Plugin Index called
InsertImageSVG to help.