reference to external CSS or JS from XSL stylesheet

  • Thread starter allard poldermans
  • Start date
A

allard poldermans

How can I make a reference to an external CSS or JS file that is
relative to the XSL stylesheet, and not relative to the XML data?

If you simply put : <link rel="stylesheet" type="text/css"
href="ui/demo.css" ></link>
in your XSL file, this link will always be relative to the location
where the XML file is.


For example, suppose I have following XML data (test.xml):

<?xml version="1.0" ?>
<?xml:stylesheet type="text/xsl" href="ui/show.xsl" ?>
<demo>text</demo>

In a sub-folder "ui" I stored a CSS file (demo.css):
..demo {
color:red;
}

and the following XSL file (show.xsl):

<?xml version="1.0"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
version="1.0">
<xsl:template match="demo">
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="ui/demo.css" ></link>
</head>
<body>
<span class="demo"><xsl:value-of select="."/></span>
</body>
</html>
</xsl:template >
</xsl:stylesheet>


As you can see in show.xsl I had to use the relative path
"ui/demo.css" to include the CSS stylesheet, which is logic in the XSL
transformation sense, and it works, but is not a good solution,
because what if I move the XML file to another folder and change the
XSL reference in it? Then the reference to the CSS file will still be
relative to the XML data, and then it does not work anymore.

So, I am looking for a way to include these files relative to the XSL
file. I think there is no way to discover the "uri" to the XSL file,
from within the XSL file, is there? If so, this could be used to
adjust the references.

The only solution that I encountered so far is to store the CSS and JS
data in separate XSL files, and use the xsl:import or xsl:link, and
then use call-template to include the data. For testing and
maintenance I personally do not like this solution either...

Please help...
 
M

Maarten Wiltink

allard poldermans said:
How can I make a reference to an external CSS or JS file that is
relative to the XSL stylesheet, and not relative to the XML data?

When I started putting XML files in a subdirectory, I made soft
links to the library directories in it. So from every directory
with XML files in it, CSS and XSLT (or JS) directories at least
appear as immediate subdirectories, although in reality there's
only one real CSS directory, under the root; all the other ones
are links.

This sort of solves your general problem by assuring that any
other library directory is at ../X.

Groetjes,
Maarten Wiltink
 
A

allard poldermans

Thanks for your answer, but I'm afraid I don't understand it...

What do you mean with a soft link, do you have an example? Did you
place these links inside the XML files? (I hope not). And what do you
do under the root? In an offline scenario the root would be the root
of the client's pc. I think an example would help.

groetjes, Allard
 
M

Maarten Wiltink

allard poldermans said:
Thanks for your answer, but I'm afraid I don't understand it...

What do you mean with a soft link, do you have an example? Did you
place these links inside the XML files? (I hope not). And what do you
do under the root? In an offline scenario the root would be the root
of the client's pc. I think an example would help.

Excerpted from a recursive directory listing of the local mirror of
my public website:

<logical root>:
total 613
drwxrwxr-x 8 maarten 1024 Nov 4 23:43 ./
drwxrwxr-x 3 maarten 1024 Aug 5 15:07 ../
drwxrwxr-x 2 maarten 1024 Nov 3 14:35 css/
drwxrwxr-x 2 maarten 1024 Nov 2 14:33 dtd/
drwxrwxr-x 2 maarten 1024 Nov 5 17:00 xslt/
drwxrwxr-x 2 maarten 2048 Nov 5 00:19 properties/
-rw-rw-r-- 1 maarten 1584 Nov 4 22:40 caesar.xhtml
-rw-rw-r-- 1 maarten 275 Nov 2 15:58 codefragments.xml
-rw-rw-r-- 1 maarten 791 Nov 3 19:57 index.html
-rw-rw-r-- 1 maarten 3299 May 3 2002 nohtml.html
-rw-rw-r-- 1 maarten 925 Nov 3 19:58 personal.html
-rw-rw-r-- 1 maarten 2225 Nov 3 19:59 programming.html
-rw-rw-r-- 1 maarten 41522 Nov 3 19:59 programmingstyle.html
-rw-rw-r-- 1 maarten 65670 Nov 3 20:00 properties.html

css, dtd, and xslt are directories with library files; properties contains
content materials.


css:
total 5
drwxrwxr-x 2 maarten 1024 Nov 3 14:35 ./
drwxrwxr-x 8 maarten 1024 Nov 4 23:43 ../
-rw-rw-r-- 1 maarten 206 Nov 3 18:41 delphi-code.css
-rw-rw-r-- 1 maarten 140 Nov 3 18:40 narrative.css
-rw-rw-r-- 1 maarten 174 Nov 3 18:41 programming.css

dtd:
total 4
drwxrwxr-x 2 maarten 1024 Nov 2 14:33 ./
drwxrwxr-x 8 maarten 1024 Nov 4 23:43 ../
-rw-rw-r-- 1 maarten 168 Nov 2 14:33 pages-1.0.dtd
-rw-rw-r-- 1 maarten 264 Nov 1 16:04 pages-1.1.dtd
lrwxrwxrwx 1 maarten 13 Nov 2 14:32 pages-1.dtd -> pages-1.1.dtd
lrwxrwxrwx 1 maarten 11 Oct 23 23:07 pages.dtd -> pages-1.dtd

xslt:
total 22
drwxrwxr-x 2 maarten 1024 Nov 5 17:00 ./
drwxrwxr-x 8 maarten 1024 Nov 4 23:43 ../
-rw-rw-r-- 1 maarten 4624 Nov 2 15:56 codefragments.xslt
-rw-rw-r-- 1 maarten 447 Nov 5 16:57 id.xslt
-rw-rw-r-- 1 maarten 8487 Nov 4 23:43 links.xslt
-rw-rw-r-- 1 maarten 3709 Nov 5 00:02 pages.xslt

properties:
total 82
drwxrwxr-x 2 maarten 2048 Nov 5 00:19 ./
drwxrwxr-x 8 maarten 1024 Nov 4 23:43 ../
lrwxrwxrwx 1 maarten 6 Nov 1 20:28 css -> ../css/
lrwxrwxrwx 1 maarten 6 Nov 2 22:25 dtd -> ../dtd/
lrwxrwxrwx 1 maarten 7 Nov 2 16:47 xslt -> ../xslt/
-rw-rw-r-- 1 maarten 1993 Nov 4 12:45 index.xhtml
-rw-rw-r-- 1 maarten 2022 Nov 4 12:45 index.xml
-rw-rw-r-- 1 maarten 1262 Nov 5 00:12 properties-01.xhtml
-rw-rw-r-- 1 maarten 4244 Nov 4 20:10 properties-02.xhtml
-rw-rw-r-- 1 maarten 4369 Nov 4 20:10 properties-03.xhtml
-rw-rw-r-- 1 maarten 2879 Nov 4 20:10 properties-04.xhtml
-rw-rw-r-- 1 maarten 5258 Nov 4 20:10 properties-05.xhtml
-rw-rw-r-- 1 maarten 6939 Nov 4 20:11 properties-06.xhtml
-rw-rw-r-- 1 maarten 8177 Nov 4 20:12 properties-07.xhtml
-rw-rw-r-- 1 maarten 5203 Nov 4 20:12 properties-08.xhtml
-rw-rw-r-- 1 maarten 7839 Nov 4 20:11 properties-09.xhtml
-rw-rw-r-- 1 maarten 6503 Nov 4 20:11 properties-10.xhtml
-rw-rw-r-- 1 maarten 7673 Nov 4 20:11 properties-11.xhtml
-rw-rw-r-- 1 maarten 8552 Nov 4 20:11 properties-12.xhtml

This is a non-root directory with content in it. It has symbolic links
to all the library files, so from any "content" file, any "library"
file will be in a ./X path, and from any library file, any other library
file will be in a ../X path.

Groetjes,
Maarten Wiltink
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,755
Messages
2,569,535
Members
45,007
Latest member
obedient dusk

Latest Threads

Top