Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Support styling RSS stylesheets by adding a index.xsl file #4800

Open
dragonstyle opened this issue Mar 13, 2023 Discussed in #4787 · 0 comments
Open

Support styling RSS stylesheets by adding a index.xsl file #4800

dragonstyle opened this issue Mar 13, 2023 Discussed in #4787 · 0 comments
Labels
enhancement New feature or request listings
Milestone
v1.6

Comments

@dragonstyle
Copy link
Collaborator

Discussed in #4787

Originally posted by kdheepak March 12, 2023
By adding a index.xsl with appropriate styling, you can make the RSS feed the same style as the webpage. You'll need to add the following to the index.xml file.

<?xml-stylesheet type="text/xsl" media="screen" href="/index.xsl"?>

Here's an example of a index.xsl file:

<?xml version="1.0" encoding="UTF-8" ?>
<xsl:stylesheet
  xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
  xmlns:atom="http://www.w3.org/2005/Atom"
  xmlns:dc="http://purl.org/dc/elements/1.1/"
  version="1.0"
>
    <xsl:output method="xml" />
    <xsl:template match="/">
        <html xmlns="http://www.w3.org/1999/xhtml" lang="en">
            <head>
                <meta charset="UTF-8" />
                <meta name="viewport" content="width=device-width" />
                <title><xsl:value-of select="rss/channel/title" /> (RSS)</title>
                <link rel="stylesheet" href="/_quarto/style.css" />
                <link href="/site_libs/quarto-html/tippy.css" rel="stylesheet"/>
                <link href="/site_libs/quarto-html/quarto-syntax-highlighting.css" rel="stylesheet" id="quarto-text-highlighting-styles"/>
                <script src="/site_libs/bootstrap/bootstrap.min.js"></script>
                <link href="/site_libs/bootstrap/bootstrap-icons.css" rel="stylesheet"/>
                <link href="/site_libs/bootstrap/bootstrap.min.css" rel="stylesheet" id="quarto-bootstrap" data-mode="light"/>
                <link rel="icon" href="/favicon.svg" />
            </head>
            <body>
                <article>
                    <header>
                    <h1>
                        <abbr title="Really Simple Syndication">RSS</abbr> feed for
                        <a>
                            <xsl:attribute name="href">
                                <xsl:value-of select="rss/channel/link" />
                            </xsl:attribute>
                            <xsl:value-of select="rss/channel/title" />
                        </a>
                    </h1>
                    </header>
                    <section>
                        <p>You may use the <acronym
                title="Uniform Resource Locater"
              >URL</acronym> of this document or copy the address below and paste it for any RSS purposes.
                        <br />
                        <label for="address">RSS address: </label>
                        <input style="width:300px">
                            <xsl:attribute name="id">address</xsl:attribute>
                            <xsl:attribute name="spellcheck">false</xsl:attribute>
                            <xsl:attribute name="value">
                                <xsl:value-of select="rss/channel/atom:link[@rel='self']/@href" />
                            </xsl:attribute>
                        </input>
                        </p>
                        <p>New to feeds? You can find out more about the RSS file format at <a
                href="http://en.wikipedia.org/wiki/RSS_(file_format)"
              >Wikipedia's RSS entry</a> or by clicking <a
                target="_blank"
                href="https://duckduckgo.com/?q=how+to+get+started+with+rss+feeds"
              >here</a> to search on the web to learn more.</p>
                        <h3>Recent blogs:</h3>
                        <xsl:for-each select="rss/channel/item">
                            <p>
                                <a>
                                    <xsl:attribute name="href"><xsl:value-of
                      select="link"
                    /></xsl:attribute><xsl:value-of select="title" />
                                </a>
                            </p>
                        </xsl:for-each>
                    </section>
                </article>
            </body>
        </html>
    </xsl:template>
</xsl:stylesheet>

I haven't fixed the styling for my page yet, but this is what the index.xml page would look like with some styling:

image

It'd be ideal if this was autogenerated.
@dragonstyle dragonstyle self-assigned this Mar 13, 2023
@dragonstyle dragonstyle added this to the v1.4 milestone Mar 13, 2023
@dragonstyle dragonstyle added the enhancement New feature or request label Mar 20, 2023
@dragonstyle dragonstyle modified the milestones: v1.4, v1.5 Nov 30, 2023
@cwickham cwickham mentioned this issue Dec 12, 2023
Closed
45 tasks
@cwickham cwickham mentioned this issue Jan 17, 2024
Closed
4 tasks
@dragonstyle dragonstyle modified the milestones: v1.5, v1.6 Feb 7, 2024
@cwickham cwickham mentioned this issue Feb 8, 2024
Merged
4 tasks
@dragonstyle dragonstyle removed their assignment Feb 19, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
enhancement New feature or request listings
Projects
None yet
Milestone
v1.6
Development

No branches or pull requests
1 participant
@dragonstyle