Welcome to WebmasterWorld Guest from 54.144.77.26

Forum Moderators: httpwebwitch

Message Too Old, No Replies

Italic not showing up xsl

     

hey suburbia

9:28 pm on Jul 8, 2008 (gmt 0)

5+ Year Member



I have this as my .xsl:

<?xml version="1.0" encoding="utf-8"?><!DOCTYPE xsl:stylesheet>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:fo="http://www.w3.org/1999/XSL/Format">
<xsl:output method="html" encoding="utf-8"/>

<xsl:template match="b">
<fo:inline font-style="bold">
<xsl:apply-templates />
</fo:inline>
</xsl:template>
<xsl:template match="i">
<fo:inline font-style="italic">
<xsl:apply-templates />
</fo:inline>
</xsl:template>

<xsl:template match="/">
<xsl:for-each select="bios/bio">
<div id="bios">
<div style="float:left; padding-right:12px;"><img src="bios/im/{image}"/></div>
<h4><xsl:value-of select="name"></xsl:value-of></h4>
<br />
<h5><xsl:value-of select="title"></xsl:value-of></h5>
<br /><br />
<div style="text-align:justify"><xsl:value-of select="description"/></div>
<br /><br />
<span class="bio_comment"><xsl:apply-templates select="comment"/></span>
</div>
<br /><br /><br />

</xsl:for-each>
</xsl:template>

<xsl:template match="br"><br/></xsl:template>

</xsl:stylesheet>

My XML looks like this:

<?xml version="1.0" encoding="utf-8"?>

<bios>
<bio>
<name>My Name</name>
<title>My Title</title>
<image>image.jpg</image>
<description>
tex text <i>This should be italic </i> text text
</description>
</bio>
</bios>

Everything works great, but nothing appears italic...

Any thoughts/suggestions?

httpwebwitch

5:36 am on Jul 9, 2008 (gmt 0)

WebmasterWorld Administrator httpwebwitch is a WebmasterWorld Top Contributor of All Time 10+ Year Member



You've posted the XML and the XSLT... now post the HTML that is output by the XSLT transformation.

I'm pretty certain if you look at the HTML, you can figure this one out...

hey suburbia

9:48 pm on Jul 9, 2008 (gmt 0)

5+ Year Member



The html renders great except no italics or ANYTHING where my <i></i> tags are in the xml.

EG. My xml line from above:
tex text <i>This should be italic </i> text text

Renders this:
tex text This should be italic text text

httpwebwitch

2:40 am on Jul 10, 2008 (gmt 0)

WebmasterWorld Administrator httpwebwitch is a WebmasterWorld Top Contributor of All Time 10+ Year Member



is the output XML, or HTML?

in HTML, an <i> means italic.
in XML, an <i> just means "i".

So if your browser thinks it's still XML, you won't see italics.
3 things come to mind which might get your browser to misinterpret: check the file extension, the mimetype, and the DOCTYPE declaration.

hey suburbia

2:16 pm on Jul 10, 2008 (gmt 0)

5+ Year Member



The output is html

The file extension is .php

My DOC declaration on the php file is:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

hey suburbia

2:28 pm on Jul 10, 2008 (gmt 0)

5+ Year Member



Also the DOC in the xml:
<?xml version="1.0" encoding="utf-8"?>

DOC for xsl:
<?xml version="1.0" encoding="utf-8"?><!DOCTYPE xsl:stylesheet>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:fo="http://www.w3.org/1999/XSL/Format">
<xsl:output method="html" encoding="utf-8"/>

hey suburbia

3:43 pm on Jul 10, 2008 (gmt 0)

5+ Year Member



I'll try to clear this up a bit:
Here is my entire .xsl file (it all works great).
I just want to have the ability to make words italic inside of <description>

<?xml version="1.0" encoding="utf-8"?><!DOCTYPE xsl:stylesheet>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:fo="http://www.w3.org/1999/XSL/Format">
<xsl:output method="html" encoding="utf-8"/>

<xsl:template match="/">
<xsl:for-each select="bios/bio">
<div id="bios">
<div style="float:left; padding-right:12px;"><img src="bios/im/{image}"/></div>
<h4><xsl:value-of select="name"></xsl:value-of></h4>
<br />
<h5><xsl:value-of select="title"></xsl:value-of></h5>
<br /><br />
<div style="text-align:justify"><xsl:value-of select="description"/></div>
<br /><br />
<span class="bio_comment"><xsl:apply-templates select="comment"/></span>
</div>
<br /><br /><br />

</xsl:for-each>
</xsl:template>

</xsl:stylesheet>

httpwebwitch

8:41 pm on Jul 10, 2008 (gmt 0)

WebmasterWorld Administrator httpwebwitch is a WebmasterWorld Top Contributor of All Time 10+ Year Member



OK I get it now

In the XML, you need to designate the description as CDATA - this means it's treated as a whole like Character Data, and elements within it are not interpreted as additional nodes in the XML.

Change the XML slightly, so it looks like this:

<?xml version="1.0" encoding="utf-8"?> 
<bios>
<bio>
<name>My Name</name>
<title>My Title</title>
<image>image.jpg</image>
<description>
[red]<![CDATA[[/red]tex text <i>This should be italic </i> text text[red]]]>[/red]
</description>
</bio>
</bios>

Then, you need to add to the XSLT, so it doesn't turn those angle-brackets into &lt; and &gt;. To do that, you add the "disable-output-escaping" attribute to that element. This is important when outputting text formatted with HTML.
The XSLT looks like this:

<?xml version="1.0" encoding="utf-8"?><!DOCTYPE xsl:stylesheet> 
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" encoding="utf-8"/>
<xsl:template match="/">
<xsl:for-each select="bios/bio">
<div id="bios">
<div style="float:left; padding-right:12px;"><img src="bios/im/{image}"/></div>
<h4><xsl:value-of select="name"></xsl:value-of></h4>
<br />
<h5><xsl:value-of select="title"></xsl:value-of></h5>
<br /><br />
<div style="text-align:justify"><xsl:value-of select="description" [red]disable-output-escaping="yes"[/red]/></div>
<br /><br />
<span class="bio_comment"><xsl:apply-templates select="comment"/></span>
</div>
<br /><br /><br />
</xsl:for-each>
</xsl:template>
</xsl:stylesheet>

Finally when you do the transformation, the HTML will come out with <i> tags intact.

<div xmlns:fo="http://www.w3.org/1999/XSL/Format" id="bios"><div style="float:left; padding-right:12px;"><img src="bios/im/image.jpg"></div>
<h4>My Name</h4>
<br>
<h5>My Title</h5>
<br>
<br>
<div style="text-align:justify">
tex text <i>This should be italic </i> text text
</div>
<br>
<br>
<span class="bio_comment"></span>
</div><br><br><br>