![]() |
#1 |
Member
![]() Posts: 14
Karma: 10
Join Date: May 2017
Device: Android tablet
|
Sigil's "Tools > Add Cover..." not auto resizing
I am trying to add a cover to my EPUB using Tools > Add Cover... in Sigil 2.0.
My cover image is 1000 x 1600 pixels. It does add a cover.xhtml file to my EPUB and all seems good, but when I open my EPUB in Thorium (an EPUB viewer), the cover image does not resize nicely within the window (on my smaller laptop screen... on my larger external 4K monitor, the problem goes unnoticed) and I have to scroll up and down to see the entire image. Other EPUBs have their cover automatically resize to the Thorium window and do not require me to scroll up and down to see the entire image. The code inserted by Sigil looks like this: Code:
... <body> <div style="text-align: center; padding: 0pt; margin: 0pt;"> <svg xmlns="http://www.w3.org/2000/svg" height="100%" preserveAspectRatio="xMidYMid meet" version="1.1" viewBox="0 0 1000 1600" width="100%" xmlns:xlink="http://www.w3.org/1999/xlink"> <image width="1000" height="1600" xlink:href="etc/Cover.jpg"/> </svg> </div> </body> ... |
![]() |
![]() |
![]() |
#2 |
Sigil Developer
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 7,985
Karma: 5449552
Join Date: Nov 2009
Device: many
|
That code was generated for epub2. For epub3 Sigil now uses 100vh for height and 100vw for width instead of 100% for each. Thorium is a full featured epub3 reader but should read epub2 as well. Try making that change.
|
![]() |
![]() |
![]() |
#3 |
Member
![]() Posts: 14
Karma: 10
Join Date: May 2017
Device: Android tablet
|
Thanks for your reply. It... almost... works. Actually, it does resize as expected, but there is a peculiar problem... Some sort of dimensionless page (like some 0 width page) is appended after the cover page and the Thorium scroll bar moves to the left, then to the right again as I keep flipping through the pages...
|
![]() |
![]() |
![]() |
#4 |
Member
![]() Posts: 14
Karma: 10
Join Date: May 2017
Device: Android tablet
|
Or actually, is there an updated plugin, config file, etc. that I should add to my Sigil install to bring the "Add Cover..." option to epub3 standards?
|
![]() |
![]() |
![]() |
#5 |
Sigil Developer
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 7,985
Karma: 5449552
Join Date: Nov 2009
Device: many
|
It already is. Sigil looks at what you chose for epub type for your epub, then uses the appropriate code. What epub type are you editing or creating?
|
![]() |
![]() |
![]() |
#6 | ||
Sigil Developer
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 7,985
Karma: 5449552
Join Date: Nov 2009
Device: many
|
Quote:
Quote:
Last edited by KevinH; 10-04-2023 at 08:49 AM. |
||
![]() |
![]() |
![]() |
#7 |
Sigil Developer
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 7,985
Karma: 5449552
Join Date: Nov 2009
Device: many
|
See this related earlier thread.
https://www.mobileread.com/forums/sh...d.php?t=354137 Note, there are bugs in ADE and now Thorium about using 100% that means a bit a trial and error will be needed to get this to work on most platforms. Another possible solution is to leave the 100% for height and width but instead add height="98vh" to the parent div style so that it will constrain the vertical height of the svg element to fit on one page vertically. And .., If you are editing an epub2, and want to update it to epub3, you can use the ePub3itizer plugin in Sigil. Last edited by KevinH; 10-04-2023 at 08:56 AM. |
![]() |
![]() |
![]() |
#8 |
Member
![]() Posts: 14
Karma: 10
Join Date: May 2017
Device: Android tablet
|
|
![]() |
![]() |
![]() |
#9 |
Member
![]() Posts: 14
Karma: 10
Join Date: May 2017
Device: Android tablet
|
|
![]() |
![]() |
![]() |
#10 |
Sigil Developer
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 7,985
Karma: 5449552
Join Date: Nov 2009
Device: many
|
And once you have a cover page that works on all the reading platforms you want, remember to save just that file using Sigil's BookBrowser and you can use it to create your own cover template that Sigil can then use in place of its own.
To create the template start with your saved version and use placeholders to replace image specific items (see below) to create a cover-template2.xhtml and/or cover-template3.xhtml and placie it into your Sigil Preferences folder. It will be used next time. To illustrate here is the epub3 default cover source code that shows the placeholders and how they are used: Code:
const QString HTML5_COVER_SOURCE = "<?xml version=\"1.0\" encoding=\"UTF-8\" standalone=\"no\" ?>\n" "<!DOCTYPE html>\n\n" "<html xmlns=\"http://www.w3.org/1999/xhtml\" xmlns:epub=\"http://www.idpf.org/2007/ops\">\n" "<head>\n" " <title>Cover</title>\n" "</head>\n" "" "<body>\n" " <div style=\"height: 100vh; text-align: center; padding: 0pt; margin: 0pt;\">\n" " <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"100%\" preserveAspectRatio=\"xMidYMid meet\" version=\"1.1\" viewBox=\"0 0 SGC_IMAGE_WIDTH SGC_IMAGE_HEIGHT\" width=\"100%\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n" " <image width=\"SGC_IMAGE_WIDTH\" height=\"SGC_IMAGE_HEIGHT\" xlink:href=\"SGC_IMAGE_FILENAME\"/>\n" " </svg>\n" " </div>\n" "</body>\n" "</html>\n"; SGC_IMAGE_WIDTH SGC_IMAGE_HEIGHT SGC_IMAGE_FILENAME In your case you would need to tweak the height: 100vh to 95vh in the div's inline style. Hope this helps. Last edited by KevinH; 10-04-2023 at 09:28 AM. |
![]() |
![]() |
![]() |
Tags |
auto-resize, cover |
|
![]() |
||||
Thread | Thread Starter | Forum | Replies | Last Post |
Indexing in SIGIL - How to add "See also..." | roland1 | Sigil | 13 | 12-17-2021 12:21 PM |
"Add cover" feature request | Phssthpok | Editor | 4 | 11-24-2017 11:13 AM |
How do I add image files to my library with thumbnails in the "cover" view? | woodr2011 | Library Management | 6 | 09-25-2015 06:56 PM |
a cover "page" in html for Sigil | Notjohn | Sigil | 9 | 07-26-2013 06:39 PM |
Add cover and "shelves" in recipe? | ehead | Recipes | 7 | 06-28-2013 10:32 PM |