On 06.06.2023 11:57, Christian Moe wrote:
Hi,
I think there's a better approach. Tl;dr:
- A better way to have active CSS in SVG images is to link to the
external SVG file with the <object> rather than <img> tag, as we used
to.
- Without patching Org, you can embed an external SVG file as an SVG
island in Org HTML export simply by using #+INCLUDE.
Details:
1) Embedded SVG is not the only way to have active CSS etc. in SVG
images. Linking to an external SVG file with an OBJECT element instead
of IMG should work fine (tested in Firefox). You can test this by
exporting Gerard's mwe.org example and editing the mwe.html to replace
: img src="./doc8.svg"
with
: object type="image/svg+xml" data="./doc8.svg"
Indeed, the flower works after the replacement but the caption
disappears.
I do not understand why, because the caption is still present in the
HTML.
Org used to use OBJECT for SVG years ago, but switched to IMG at some
point. I'm not quite sure when or why that happened (forgive me for not
doing an exhaustive search of the archive or delving into the git
record). But I think perhaps the reason was this thread,
https://lists.gnu.org/archive/html/emacs-orgmode/2016-07/msg00380.html
where the issue was easy scaling, and that Jarmo Hurri's patch
switching
to IMG came to be applied at some point, even though Jarmo and I agreed
that adding a common CLASS="svgfig" attribute to OBJECT would solve his
issue, see this thread:
https://lists.gnu.org/archive/html/emacs-orgmode/2016-07/msg00410.html
I continue to think that OBJECT with an .svgfig class as default (or a
setting to give the user a choice between IMG and OBJECT) is the best
solution.
2) You can actually embed an SVG island in Org HTML export simply by
using #+INCLUDE. To try this, add the following line to Gerard's
mwe.org:
: #+INCLUDE: "./doc8.svg" export html
The exported HTML should now show the black flower from Gerard's
minimal
non-working example plus a working flower.
Indeed, the flower works, but the caption disappears because Org does
not
recognize the "#+INCLUDE ..." as a link, the caption does not show up in
the
HTML. Is there an easy solution for this issue.
(Some SVG files may start with an XML declaration; if the XML
declaration is on a separate first line, you can just skip it by adding
=:lines "2-"= to the #+INCLUDE instruction.)
Yours,
Christian
Thanks -- Gerard
Ihor Radchenko writes:
gerard.vermeu...@posteo.net writes:
I have been trying to export SVG images having links to CSS from Org
to
HTML
and I have found that the this CSS is not active in Firefox (only
browser I tried).
I have found that the CCS is only active under two conditions:
1. The HTML page should manage the CSS that the SVG image links to.
2. The SVG image should be embedded in the HTML page.
CCing Timothy, the maintainer.
Also, does the above mean that Firefox does not support custom CSS
user
stylesheets? What am I missing?
I wrote an ox-html derived export backend to embed SVG images:
https://forge.chapril.org/gav451/emacs.d/src/branch/main/site-lisp/ox-my-html/ox-my-html.el
and merged the SVG embedding functionality into ox-html.el leading to
the
attached patch.
Thanks! I will provide high-level comments from general ox.el
perspective.
+ (:html-embed-svg-excludes "HTML_EMBED_SVG_EXCLUDES" nil
+ org-html-embed-svg-excludes split)
+ (:html-embed-svg-includes "HTML_EMBED_SVG_INCLUDES" nil
+ org-html-embed-svg-includes split)
This is awkward. To do per-image export adjustments, we usually use
export attributes (#+ATTR_HTML: ...). And why "split"?
+ (:with-html-svg-embedding nil "html-embed-svg"
org-html-embed-svg)
We have :html-inline-images. Maybe better :html-embed-svg ?
+(defcustom org-html-embed-svg nil
...
+ :version "30.0"
We do not use :version tag. Please use :package-version.
See Elisp manual section "15.1 Common Item Keywords".
Also, maybe instead of t/nil boolean values here, we may allow the
value
to be a list of regular expressions or a string representing regular
expression. This will allow what you are trying to do with
HTML_EMBED_SVG_INCLUDES. The list elements might also be (not "..."),
replicating HTML_EMBED_SVG_EXLCUDES.
Even more generally, we may turn this into HTML_EMBED_IMAGES and embed
all the images (possibly filtered by regexp). This will be slightly
beyond the scope of this patch though.
+(defun org-html--embed-svg-p (link path info)
+ "Check whether LINK and INFO specify to embed the SVG file named
PATH.
+LINK must have no contents and link to an SVG file. INFO may
contain
+lists of SVG files to include in and/or to exclude from embedding."
+ (and (not (org-element-contents link))
Please use `org-export-inline-image-p'.
+(defun org-html-svg-contents (path)
+ "Return the SVG contents of the file named PATH."
+ (with-temp-buffer
+ (insert-file-contents path)
+ ;; Delete text preceding something starting as an SVG root
element.
+ ;; The intent is to remove XML declarations (and XML comments).
+ ;; This breaks in case of a preceding XML comment with <svg
inside
+ ;; or a preceding XML element with an SVG element inside.
+ ;; See https://emacs.stackexchange.com/a/57433 for the original
code.
But the original code is different, no?
