Register Guidelines E-Books Search Today's Posts Mark Forums Read

Go Back   MobileRead Forums > E-Book Software > Sigil

Notices

Reply
 
Thread Tools Search this Thread
Old 07-11-2013, 12:59 PM   #1
RbnJrg
Evangelist
RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.
 
Posts: 453
Karma: 318996
Join Date: Mar 2013
Location: Rosario - Santa Fe - Argentina
Device: Kindle 4 NT
How good Sigil supports SVG images?

Hi friends;

I'm very confused; I want to use SVG images (text images) with fonts embedding. The following code, in theory, should work but Sigil doesn't show anything:

Code:
<?xml version="1.0" standalone="yes"?>
<svg width="400px" height="300px" version="1.1"
 xmlns= "http://www.w3.org/2000/svg">  
  <defs>
    <style type="text/css">
      <![CDATA[
   	    @font-face {
	    font-family: Symbola;
	    src: url("..Fonts/Symbola.ttf");
	    }
      ]]>
   </style>
  </defs>
  <text x="1" y="1" style="font-family: Symbola; font-weight:normal; font-style: normal; font-size: 1.2em; line-height: 2em">
Text using CSS @font-face
</text>
</svg>
Above is the code for my svg image. I can't find any way, any method that works, to insert that image in a .html (.xhtml) file.

Please, someone can tell me what am I doing wrong?

Many thanks in advance.
Rubén
RbnJrg is offline   Reply With Quote
Old 07-11-2013, 02:12 PM   #2
Toxaris
Wizard
Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.
 
Toxaris's Avatar
 
Posts: 2,956
Karma: 3363559
Join Date: Oct 2009
Location: Heemskerk, NL
Device: PRS-300, PRS-T1
If the SVG image works, you can insert it like any other image. However, it will be treated as an image then, not a SVG.

You might check the specifications with regards to SVG, a lot is not supported.
Toxaris is offline   Reply With Quote
 
Enthusiast
Old 07-16-2013, 12:38 PM   #3
Tex2002ans
Evangelist
Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.
 
Posts: 493
Karma: 379915
Join Date: Jul 2012
Device: Nook
It could potentially be a missing '/':

Code:
src: url("../Fonts/Symbola.ttf");
Tex2002ans is offline   Reply With Quote
Old 07-16-2013, 05:12 PM   #4
RbnJrg
Evangelist
RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.
 
Posts: 453
Karma: 318996
Join Date: Mar 2013
Location: Rosario - Santa Fe - Argentina
Device: Kindle 4 NT
Quote:
Originally Posted by Tex2002ans View Post
It could potentially be a missing '/':

Code:
src: url("../Fonts/Symbola.ttf");
Hi Tex;

Many thanks for your answer. Yes, I wrote the url bad but in my image in Sigil was ok. Finally, after lots of "trials and errors", I could find out what was wrong: font-size must be in PIXELS. Theorically, "em" size is supported by text inside a svg wrapper BUT doesn't work in Sigil (maybe a Sigil bug, I don't know). Also, the "y" position of the text, must be equal to the text-size (so, if the text is -for example- of 40px, then "y" has to be y=40). The correct code after all these changes would be:

Code:
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="50px" height="40px">
<defs>
  <style type="text/css">
   <![CDATA[
    @font-face {
        font-family: Symbola;
        src: url("../Fonts/Symbola.ttf");
    }
   ]]>
 </style>
</defs>
<text x="1" y="40" style="font-family: Symbola; font-weight:normal; font-style: normal; font-size: 40px">
☙
</text>
</svg>
Many thanks again for answering.
Rubén
RbnJrg is offline   Reply With Quote
Old 07-17-2013, 01:17 AM   #5
Toxaris
Wizard
Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.Toxaris ought to be getting tired of karma fortunes by now.
 
Toxaris's Avatar
 
Posts: 2,956
Karma: 3363559
Join Date: Oct 2009
Location: Heemskerk, NL
Device: PRS-300, PRS-T1
I do remember that now you mention it. It is not just Sigil, but also ADE if I recall correctly.
Toxaris is offline   Reply With Quote
Old 07-17-2013, 02:16 PM   #6
Tex2002ans
Evangelist
Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.Tex2002ans ought to be getting tired of karma fortunes by now.
 
Posts: 493
Karma: 379915
Join Date: Jul 2012
Device: Nook
Hmmm glad you could sort that out. SVG is DEFINITELY an area I need to look into and start experimenting with.

Mind putting up a sample SVG EPUB with working code?
Tex2002ans is offline   Reply With Quote
Old 07-17-2013, 05:36 PM   #7
RbnJrg
Evangelist
RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.
 
Posts: 453
Karma: 318996
Join Date: Mar 2013
Location: Rosario - Santa Fe - Argentina
Device: Kindle 4 NT
Quote:
Originally Posted by Tex2002ans View Post

Mind putting up a sample SVG EPUB with working code?
Below you can see an epub with a SVG image used as a fleuron. Instead of embedding a full font file; I saved some glyphs as SVG images. Why do I use a SVG image instead of a .png image? A .png image of the same fleuron used in this epub is about the half in size regarding the SVG image but when you change the size of the book font, the quality of the svg image is perfect. One more word: the method I have employed in this epub doesn't work in ADE (in my Kindle works great). ADE doesn't support the pseudo-class "after"; so, if you want to use the svg image in ADE you should inserted by employing the <img> tag:

<p><img alt="Fleuron1" src="../Images/Fleuron1.svg"/></p>

Of course, you can style the "container" <p> as you wish.

Regards
Rubén
Attached Thumbnails
Click image for larger version

Name:	screen_shot-9206.gif
Views:	75
Size:	30.9 KB
ID:	108333  
Attached Files
File Type: epub SVG Fleuron.epub (5.5 KB, 55 views)

Last edited by RbnJrg; 07-17-2013 at 05:45 PM.
RbnJrg is offline   Reply With Quote
Old 07-18-2013, 03:08 AM   #8
Jellby
frumious Bandersnatch
Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.
 
Jellby's Avatar
 
Posts: 6,146
Karma: 4792399
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
Quote:
Originally Posted by RbnJrg View Post
One more word: the method I have employed in this epub doesn't work in ADE (in my Kindle works great). ADE doesn't support the pseudo-class "after";
You should be aware that the CSS properties content, background, and background-size are not required by the ePub 2.0.1 spec. So even a perfectly compliant ePub reader (if it existed) would probably not support that method.
Jellby is offline   Reply With Quote
Reply

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
blank pages after SVG images in Kobo jobalcaen ePub 3 05-19-2013 01:19 PM
can I use SVG images in mobi? sarah_pnix Kindle Formats 4 01-07-2013 04:21 PM
Sigil and SVG image links Rand Brittain Sigil 1 01-05-2013 05:39 PM
How to center/fit page width SVG images with <OBJECT> amoroso ePub 0 07-31-2010 11:48 AM
E-book format that supports images? scarab1 Workshop 11 03-05-2010 03:21 AM


All times are GMT -4. The time now is 05:48 PM.


MobileRead.com is a privately owned, operated and funded community.