rss style with css

Mitra 81 posts 196 karma points

Oct 11, 2013 @ 15:04

XSLT

Hello - I have create a rss page with umbraco, but the problem is i cannot style it with the css i made in stylesheet folder.

I have added this line to my xml:

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/css" href="../css/rss.css"?>
<!DOCTYPE xsl:stylesheet [ <!ENTITY nbsp " "> ]>
<xsl:stylesheet
version="1.0" .......

and added some css code to rss.css like:

item {
display: block;
margin-bottom: 30pt;
margin-left; 0;
}

Title{
   padding: 0 0 20px 0;
   color: #57AB81;
   font-size: 30px;
   font-weight:bold;
   display: block;
   width:100%;
   text-align:center;
   clear:both;
}

anybody knows why the css file doesn't do anything?

Thanks in advance,

Mitra

Copy Link

Dennis Aaen 4499 posts 18254 karma points admin hq c-trib

Oct 11, 2013 @ 15:33

Hi Mitra and welcome to our :-),

Did you put your stylesheets into the CSS folder in Umbraco. Or did you use another folder, that you have created yourself.

I you use the bulid in CSS folder with Umbraco you could try this.

<?xml-stylesheet type="text/css" href="/css/rss.css"?>

Hope this helps you

/Dennis

Copy Link

Mitra 81 posts 196 karma points

Oct 12, 2013 @ 17:32

Thanks Dennis for your reply.

I have made it under stylesheets and the css is in my css folder next to the other css for the website.

Name

Path

~/css/rss.css

item {

  display: block;

  margin-bottom: 30pt;

  margin-left; 0;

Title{

padding: 0 0 20px 0;

color: #57AB81;

font-size: 30px;

font-weight:bold;

display: block;

width:100%;

text-align:center;

clear:both;

Copy Link

Dennis Aaen 4499 posts 18254 karma points admin hq c-trib

Oct 12, 2013 @ 18:15

Hi Mitra,

Okay have you tried to change from this:

<?xml-stylesheet type="text/css" href="../css/rss.css"?>

To this: Does this have any effect, on the XML document.

<?xml-stylesheet type="text/css" href="/css/rss.css"?>

/Dennis

Copy Link

Mitra 81 posts 196 karma points

Oct 13, 2013 @ 02:00

I have tried every combination. It looks like it is not reading the css file at all. Is there any way that i add the stylesheet in the xml file?

Many thanks,

Mitra

Copy Link

Mitra 81 posts 196 karma points

Oct 13, 2013 @ 11:08

This is the xml file: (I cannot even see the news titles in internet explorer or firefox)

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

<?xml-stylesheet href="/css/rss.css" type="text/css" ?>

<!DOCTYPE xsl:stylesheet [ <!ENTITY nbsp " "> ]>

<xsl:stylesheet

version="1.0"

xmlns:xsl="http://www.w3.org/1999/XSL/Transform"

xmlns:rssdatehelper="urn:rssdatehelper"

xmlns:dc="http://purl.org/dc/elements/1.1/"

xmlns:content="http://purl.org/rss/1.0/modules/content/"

xmlns:msxml="urn:schemas-microsoft-com:xslt"

xmlns:umbraco.library="urn:umbraco.library" xmlns:Exslt.ExsltCommon="urn:Exslt.ExsltCommon" xmlns:Exslt.ExsltDatesAndTimes="urn:Exslt.ExsltDatesAndTimes" xmlns:Exslt.ExsltMath="urn:Exslt.ExsltMath" xmlns:Exslt.ExsltRegularExpressions="urn:Exslt.ExsltRegularExpressions" xmlns:Exslt.ExsltStrings="urn:Exslt.ExsltStrings" xmlns:Exslt.ExsltSets="urn:Exslt.ExsltSets"

exclude-result-prefixes="msxml umbraco.library Exslt.ExsltCommon Exslt.ExsltDatesAndTimes Exslt.ExsltMath Exslt.ExsltRegularExpressions Exslt.ExsltStrings Exslt.ExsltSets ">

<xsl:output method="xml" omit-xml-declaration="yes"/>

<xsl:param name="currentPage"/>

<xsl:variable name="RSSNoItems" select="string('10')"/>

<xsl:variable name="RSSTitle" select="string('iwonder RSS News Feed')"/>

<xsl:variable name="SiteURL" select="concat('http://',umbraco.library:RequestServerVariables('HTTP_HOST'))"/>

<xsl:variable name="RSSDescription" select="string('iwonder management team, have over 40 years of experience working with insurance technology and have developed a range of products to help brokers and aggregators thrive')"/>

<xsl:variable name="publicationDate">

<xsl:for-each select="$currentPage/* [@isDoc]">

<xsl:sort select="@publicationDate" data-type="text" order="descending" />

<xsl:if test="position() = 1">

<xsl:value-of select="publicationDate" />

</xsl:if>

</xsl:for-each>

<!--<xsl:for-each select="$currentPage/* [@isDoc]">

<xsl:if test="newsVisible = 1">

<xsl:apply-templates/>

</xsl:if>

</xsl:for-each>-->

</xsl:variable>

<xsl:template match="/">

<xsl:value-of select="umbraco.library:ChangeContentType('text/xml')"/>

<xsl:text disable-output-escaping="yes"><?xml version="1.0" encoding="UTF-8"?></xsl:text>

<rss version="2.0"

xmlns:content="http://purl.org/rss/1.0/modules/content/"

xmlns:wfw="http://wellformedweb.org/CommentAPI/"

xmlns:dc="http://purl.org/dc/elements/1.1/"

>

<Title>

<xsl:value-of select="$RSSTitle"/>

</Title>

<link>

<xsl:value-of select="$SiteURL"/>

</link>

<xsl:value-of select="$publicationDate"/>

</pubDate>

<generator>umbraco</generator>

<xsl:value-of select="$RSSDescription"/>

</description>

<xsl:apply-templates select="$currentPage/news/* [@isDoc and string(umbracoNaviHide) != '1']">

<xsl:sort select="@publicationDate" order="descending" />

</xsl:apply-templates>

</channel>

</rss>

</xsl:template>

<xsl:template match="* [@isDoc]">

<xsl:if test="position() <= $RSSNoItems">

<xsl:variable name="Visible" select="newsVisible" />

<xsl:if test="$Visible = '1'" >

<item>

<Title>

<xsl:value-of select="newsHeadline"/>

</Title>

<link>

<xsl:value-of select="$SiteURL"/>

<xsl:value-of select="umbraco.library:NiceUrl(@id)"/>

</link>

<xsl:value-of select="publicationDate"/>

</pubDate>

<!--<guid>

<xsl:value-of select="$SiteURL"/>

<xsl:value-of select="umbraco.library:NiceUrl(@id)"/>

</guid> -->

<content:encoded>

<xsl:value-of select="newsSummary" disable-output-escaping="yes"/>

</content:encoded>

</item>

</xsl:if>

</xsl:template>

</xsl:stylesheet>

Copy Link

Dennis Aaen 4499 posts 18254 karma points admin hq c-trib

Oct 13, 2013 @ 11:17

Hi Mitra,

It´s should be posible to style a RSS feed in XML document with CSS. Have you tried to click on the link to stylesheet. Just to check that the browser can find and load the stylesheet.

/Dennis

Copy Link

Dennis Aaen 4499 posts 18254 karma points admin hq c-trib

Oct 13, 2013 @ 11:31

Hi Mitra,

It´s should be posible to style a RSS feed in XML with inline CSS.

You should be able to use the STYLE attribute to add styles to individual elements inline, i.e., within the XML document. The generic inline style syntax is :

http://usefultechtalk.blogspot.dk/2012/09/all-about-styling-xml-with-internal-and.html

I hope this can help you solve your issue, with styling the XML.

/Dennis

Copy Link

Chriztian Steinmeier 2798 posts 8788 karma points MVP 7x admin c-trib

Oct 13, 2013 @ 12:26

Hi Mitra (+ Dennis)

The reason for the stylesheet not taking effect is that the xml-stylesheet processing instruction is part of the XSLT stylesheet, not the output document. So in effect, you're actually assigning the CSS stylesheet to the XSLT stylesheet (which is perfectly possible :-)

You need to generate the processing instruction as part of the output using the <xsl:processing-instruction /> element, like this:

<xsl:processing-instruction name="xml-stylesheet">type="text/css" href="/css/rss.css"</xsl:processing-instruction>

/Chriztian

Copy Link

Mitra 81 posts 196 karma points

Oct 13, 2013 @ 23:02

Hi Chriztian and Dennis,

I added the code you told me, and tried all possible ways, but it does not show the style :(
I cann't see the title of the news in ie or firefox too... I cannot understand why.

I post the code here:

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

<!DOCTYPE xsl:stylesheet [ <!ENTITY nbsp " "> ]>

<xsl:stylesheet

version="1.0"

xmlns:xsl="http://www.w3.org/1999/XSL/Transform"

xmlns:rssdatehelper="urn:rssdatehelper"

xmlns:dc="http://purl.org/dc/elements/1.1/"

xmlns:content="http://purl.org/rss/1.0/modules/content/"

xmlns:msxml="urn:schemas-microsoft-com:xslt"

xmlns:umbraco.library="urn:umbraco.library" xmlns:Exslt.ExsltCommon="urn:Exslt.ExsltCommon" xmlns:Exslt.ExsltDatesAndTimes="urn:Exslt.ExsltDatesAndTimes" xmlns:Exslt.ExsltMath="urn:Exslt.ExsltMath" xmlns:Exslt.ExsltRegularExpressions="urn:Exslt.ExsltRegularExpressions" xmlns:Exslt.ExsltStrings="urn:Exslt.ExsltStrings" xmlns:Exslt.ExsltSets="urn:Exslt.ExsltSets"

exclude-result-prefixes="msxml umbraco.library Exslt.ExsltCommon Exslt.ExsltDatesAndTimes Exslt.ExsltMath Exslt.ExsltRegularExpressions Exslt.ExsltStrings Exslt.ExsltSets ">

<xsl:output method="xml" omit-xml-declaration="yes"/>

<xsl:param name="currentPage"/>

<xsl:variable name="RSSNoItems" select="string('10')"/>

<xsl:variable name="RSSTitle" select="string('iwonder RSS News Feed')"/>

<xsl:variable name="SiteURL" select="concat('http://',umbraco.library:RequestServerVariables('HTTP_HOST'))"/>

<xsl:variable name="RSSDescription" select="string('iwonder management team, have over 40 years of experience working with insurance technology and have developed a range of products to help brokers and aggregators thrive')"/>

<xsl:variable name="publicationDate">

<xsl:for-each select="$currentPage/* [@isDoc]">

<xsl:sort select="@publicationDate" data-type="text" order="descending" />

<xsl:if test="position() = 1">

<xsl:value-of select="publicationDate" />

</xsl:if>

</xsl:for-each>

<!--<xsl:for-each select="$currentPage/* [@isDoc]">

<xsl:if test="newsVisible = 1">

<xsl:apply-templates/>

</xsl:if>

</xsl:for-each>-->

</xsl:variable>

<xsl:template match="/">

<xsl:value-of select="umbraco.library:ChangeContentType('text/xml')"/>

<xsl:text disable-output-escaping="yes"><?xml version="1.0" encoding="UTF-8"?></xsl:text>

<rss version="2.0"

xmlns:content="http://purl.org/rss/1.0/modules/content/"

xmlns:wfw="http://wellformedweb.org/CommentAPI/"

xmlns:dc="http://purl.org/dc/elements/1.1/"

>

<xsl:processing-instruction name="xml-stylesheet">type="text/css" href="/css/rss.css"</xsl:processing-instruction>

<Title>

<xsl:value-of select="$RSSTitle"/>

</Title>

<link>

<xsl:value-of select="$SiteURL"/>

</link>

<xsl:value-of select="$publicationDate"/>

</pubDate>

<generator>umbraco</generator>

<xsl:value-of select="$RSSDescription"/>

</description>

<xsl:apply-templates select="$currentPage/news/* [@isDoc and string(umbracoNaviHide) != '1']">

<xsl:sort select="@publicationDate" order="descending" />

</xsl:apply-templates>

</channel>

</rss>

</xsl:template>

<xsl:template match="* [@isDoc]">

<xsl:if test="position() <= $RSSNoItems">

<xsl:variable name="Visible" select="newsVisible" />

<xsl:if test="$Visible = '1'" >

<item>

<Title>

<xsl:value-of select="newsHeadline"/>

</Title>

<link>

<xsl:value-of select="$SiteURL"/>

<xsl:value-of select="umbraco.library:NiceUrl(@id)"/>

</link>

<xsl:value-of select="publicationDate"/>

</pubDate>

<!--<guid>

<xsl:value-of select="$SiteURL"/>

<xsl:value-of select="umbraco.library:NiceUrl(@id)"/>

</guid> -->

<content:encoded>

<xsl:value-of select="newsSummary" disable-output-escaping="yes"/>

</content:encoded>

</item>

</xsl:if>

</xsl:template>

</xsl:stylesheet>

Copy Link

Mitra 81 posts 196 karma points

Oct 13, 2013 @ 23:09

Hi Chriztian and Dennis, I added the code you told me, and tried all possible ways, but it does not show the style :( (it generates the code in output though: ) I can't see the title of the news in ie or firefox too... I cannot understand why.

I post the code here:

' ]>

        <xsl:for-each select="$currentPage/* [@isDoc]">

  <xsl:sort select="@publicationDate" data-type="text" order="descending" />
  <xsl:if test="position() = 1">
    <xsl:value-of select="publicationDate" />
  </xsl:if>

</xsl:for-each>

          <!--<xsl:for-each select="$currentPage/* [@isDoc]">

-->

<!-- change the mimetype for the current page to xml -->
<xsl:value-of select="umbraco.library:ChangeContentType('text/xml')"/>

<xsl:text disable-output-escaping="yes">&lt;?xml version="1.0" encoding="UTF-8"?&gt;</xsl:text>
<rss version="2.0"
xmlns:content="http://purl.org/rss/1.0/modules/content/"
xmlns:wfw="http://wellformedweb.org/CommentAPI/"
xmlns:dc="http://purl.org/dc/elements/1.1/"
          >
<xsl:processing-instruction name="xml-stylesheet">type="text/css" href="/css/rss.css"</xsl:processing-instruction>

  <channel>
    <Title>
      <xsl:value-of select="$RSSTitle"/>
    </Title>
    <link>
      <xsl:value-of select="$SiteURL"/>
    </link>
    <pubDate>
      <xsl:value-of select="$publicationDate"/>
    </pubDate>
    <generator>umbraco</generator>
    <description>
      <xsl:value-of select="$RSSDescription"/>
    </description>
    <language>en</language>

                      <xsl:apply-templates select="$currentPage/news/* [@isDoc and string(umbracoNaviHide) != '1']">
      <xsl:sort select="@publicationDate" order="descending" />


    </xsl:apply-templates>
  </channel>
</rss>

'

Copy Link

Mitra 81 posts 196 karma points

Oct 13, 2013 @ 23:16

Hi Chriztian and Dennis, I added the code you told me, and tried all possible ways, but it does not show the style :( I cann't see the title of the news in ie or firefox too... I cannot understand why.

I post the code here: ]>

  <xsl:sort select="@publicationDate" data-type="text" order="descending" />
  <xsl:if test="position() = 1">
    <xsl:value-of select="publicationDate" />
  </xsl:if>

</xsl:for-each>

  <!--<xsl:for-each select="$currentPage/* [@isDoc]">

-->

<!-- change the mimetype for the current page to xml -->
<xsl:value-of select="umbraco.library:ChangeContentType('text/xml')"/>

<xsl:text disable-output-escaping="yes">&lt;?xml version="1.0" encoding="UTF-8"?&gt;</xsl:text>
<rss version="2.0"
xmlns:content="http://purl.org/rss/1.0/modules/content/"
xmlns:wfw="http://wellformedweb.org/CommentAPI/"
xmlns:dc="http://purl.org/dc/elements/1.1/"
  >
<xsl:processing-instruction name="xml-stylesheet">type="text/css" href="/css/rss.css"</xsl:processing-instruction>

Copy Link

Chriztian Steinmeier 2798 posts 8788 karma points MVP 7x admin c-trib

Oct 14, 2013 @ 08:52

Hi again, Mitra

It looks like your comments are now getting caught in the Spam filter, I'll see if I can have someone look at that.

Meanwhile, to fix your problem - try moving the processing instruction up so it appears before the <rss root element.

/Chriztian

Copy Link

Mitra 81 posts 196 karma points

Oct 14, 2013 @ 12:09

Thanks a lot Chriztian, for some reason i cannot post anything here.

I'll try what you wrote and will let you know.

Copy Link

Mitra 81 posts 196 karma points

Oct 15, 2013 @ 14:50

Chriztian, I have made my wqebsite in visial studio 2010 and the database in SQLYog - now i have to convert it to VS 2008 and database SQL server.

I have spent lots of time but i cannot open the .sql in SQL server... when i open it as a script file, then i get lots of syntax error.... So i am going to start the website from the begining :(

I just thought to put this question here to see if you or anyone else knows if there is any quicker way. (also do you know if i vb 2008 will be ok with umbraco or not? i had some difficulty before)

many thanks,

Mitra

Copy Link

Mitra 81 posts 196 karma points

Oct 29, 2013 @ 13:43

Hello again,

I just noticed that my RSS page shows some code after the news items at the bottom of the page JUST in google chrome. this is my code. anybody knows why? :(

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE xsl:stylesheet [ <!ENTITY nbsp " "> ]>

<xsl:stylesheet
version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:rssdatehelper="urn:rssdatehelper"
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:content="http://purl.org/rss/1.0/modules/content/"
xmlns:msxml="urn:schemas-microsoft-com:xslt"
xmlns:umbraco.library="urn:umbraco.library" xmlns:Exslt.ExsltCommon="urn:Exslt.ExsltCommon" xmlns:Exslt.ExsltDatesAndTimes="urn:Exslt.ExsltDatesAndTimes" xmlns:Exslt.ExsltMath="urn:Exslt.ExsltMath" xmlns:Exslt.ExsltRegularExpressions="urn:Exslt.ExsltRegularExpressions" xmlns:Exslt.ExsltStrings="urn:Exslt.ExsltStrings" xmlns:Exslt.ExsltSets="urn:Exslt.ExsltSets"
exclude-result-prefixes="msxml umbraco.library Exslt.ExsltCommon Exslt.ExsltDatesAndTimes Exslt.ExsltMath Exslt.ExsltRegularExpressions Exslt.ExsltStrings Exslt.ExsltSets ">

<xsl:output method="xml" omit-xml-declaration="yes"/>

<xsl:param name="currentPage"/>


<xsl:variable name="RSSNoItems" select="string('10')"/>
<xsl:variable name="RSSTitle" select="string('iwonder RSS News Feed')"/>
<xsl:variable name="SiteURL" select="concat('http://',umbraco.library:RequestServerVariables('HTTP_HOST'))"/>
<xsl:variable name="RSSDescription" select="string(' iwonder management team, have over 40 years of experience working with insurance technology and have developed a range of products to help brokers and aggregators thrive')"/>



<xsl:variable name="publicationDate">

    <xsl:for-each select="$currentPage/* [@isDoc]">

      <xsl:sort select="@publicationDate" data-type="text" order="descending" />
      <xsl:if test="position() = 1">
        <xsl:value-of select="publicationDate" />
      </xsl:if>

    </xsl:for-each>

    

</xsl:variable>

<xsl:template match="/">

    
    <xsl:value-of select="umbraco.library:ChangeContentType('text/xml')"/>

    <xsl:text disable-output-escaping="yes"><?xml version="1.0" encoding="UTF-8"?></xsl:text>
    <xsl:processing-instruction name="xml-stylesheet">type="text/css" href="/css/rss.css"</xsl:processing-instruction>

    <rss version="2.0"
    xmlns:content="http://purl.org/rss/1.0/modules/content/"
    xmlns:wfw="http://wellformedweb.org/CommentAPI/"
    xmlns:dc="http://purl.org/dc/elements/1.1/"
    >

      <channel>
        <image>
        
        </image>
        <Title>
          <xsl:value-of select="$RSSTitle"/>
        </Title>
        <link>
          <xsl:value-of select="$SiteURL"/>
        </link>
        <pubDate>
          <xsl:value-of select="$publicationDate"/>
        </pubDate>
        <generator>umbraco</generator>
        <description>
          <xsl:value-of select="$RSSDescription"/>
        </description>
        <language>en</language>

        <xsl:apply-templates select="$currentPage/news/* [@isDoc and string(umbracoNaviHide) != '1']">
          <xsl:sort select="@publicationDate" order="descending" />


        </xsl:apply-templates>
      </channel>
    </rss>

</xsl:template>

<xsl:template match="* [@isDoc]">
    <xsl:if test="position() <= $RSSNoItems">
    <xsl:variable name="Visible" select="newsVisible" />
    <xsl:if test="$Visible = '1'" >
      <item>
        <Title>
          <xsl:value-of select="newsHeadline"/>
        </Title>
        <link>
          <xsl:value-of select="$SiteURL"/>
          <xsl:value-of select="umbraco.library:NiceUrl(@id)"/>
        </link>
        <pubDate>
          <xsl:value-of select="publicationDate"/>
        </pubDate>
        
        <content:encoded>
          <xsl:value-of select="newsSummary" disable-output-escaping="yes"/>
        </content:encoded>
      </item>
    </xsl:if>
    </xsl:if>
</xsl:template>

</xsl:stylesheet>

Copy Link

is working on a reply...

Flag this post as spam?

RSS Style with CSS