Added styling for sitemap generator
This commit is contained in:
+27
-13
@@ -1,14 +1,25 @@
|
||||
import type { SitemapEntry } from './buildSitemapEntries.js';
|
||||
type BuildSitemapXmlOptions = {
|
||||
/**
|
||||
* URL of a CSS stylesheet to make the sitemap readable in the browser, e.g.
|
||||
* '/sitemap.css'. Uses `type="text/css"` — the W3C "Associating Style Sheets
|
||||
* with XML" mechanism, which is NOT deprecated (unlike XSLT / type="text/xsl",
|
||||
* which Chrome/WebKit are removing). CSS on XML shows no warning, styles the
|
||||
* raw tags directly (e.g. `url { display: block }` turns the wall of text into
|
||||
* cards), and crawlers ignore the directive entirely.
|
||||
*/
|
||||
cssUrl?: string;
|
||||
};
|
||||
/**
|
||||
* Serializes sitemap entries to a clean, indented XML STRING — valid for crawlers
|
||||
* and readable in the browser as the native XML tree (indented, collapsible,
|
||||
* syntax-highlighted by the browser itself).
|
||||
* and (with `cssUrl`) styled in the browser via plain CSS.
|
||||
*
|
||||
* NO XSLT stylesheet: browsers (Chrome et al.) are REMOVING XSLT support, so a
|
||||
* <?xml-stylesheet?> approach is a dead end — it shows a deprecation warning now
|
||||
* and will break soon. Instead we serve plain XML with the correct Content-Type;
|
||||
* the browser renders its built-in formatted XML view (the "code tree" look) with
|
||||
* no transformation needed.
|
||||
* Two viewing modes:
|
||||
* - No cssUrl → the browser's native formatted XML tree (indented, collapsible).
|
||||
* - With cssUrl → a `<?xml-stylesheet type="text/css">` directive; the project's
|
||||
* CSS styles the XML tags (cards, labels via ::before). NOT XSLT — that's being
|
||||
* removed from browsers and shows a deprecation warning. CSS is safe and
|
||||
* W3C-standard.
|
||||
*
|
||||
* // app/sitemap.xml/route.ts
|
||||
* import { buildSitemapXml } from '@intecion/ipal-kit'
|
||||
@@ -16,16 +27,19 @@ import type { SitemapEntry } from './buildSitemapEntries.js';
|
||||
* export const dynamic = 'force-dynamic'
|
||||
* export async function GET() {
|
||||
* const entries = await sitemap()
|
||||
* const xml = buildSitemapXml(entries)
|
||||
* const xml = buildSitemapXml(entries, { cssUrl: '/sitemap.css' })
|
||||
* return new Response(xml, {
|
||||
* headers: { 'Content-Type': 'application/xml; charset=utf-8' },
|
||||
* })
|
||||
* }
|
||||
*
|
||||
* The indentation makes the raw XML pleasant to read; the browser's default XML
|
||||
* viewer adds the tree/fold UI. Crawlers read the XML as usual.
|
||||
* Put sitemap.css in the project's /public and style the tags (see docs/seo.md
|
||||
* for a starter). Note: <loc> is an XML tag, not <a href> — CSS can't make it a
|
||||
* clickable link (some browsers auto-detect URLs); the win is readability, not
|
||||
* clickability.
|
||||
*
|
||||
* NOTE: if you use this custom route, DON'T also keep app/sitemap.ts — pick one
|
||||
* (this route OR the Next MetadataRoute). Two sitemaps confuse crawlers.
|
||||
* NOTE: if you use this custom route, DON'T also keep app/sitemap.ts — pick one.
|
||||
* Two sitemaps confuse crawlers.
|
||||
*/
|
||||
export declare function buildSitemapXml(entries: SitemapEntry[]): string;
|
||||
export declare function buildSitemapXml(entries: SitemapEntry[], opts?: BuildSitemapXmlOptions): string;
|
||||
export {};
|
||||
|
||||
Reference in New Issue
Block a user