Protocol LogoNextWP

Next App Functions

Utility functions provided by @nextwp/core that are used in the Next.js app router to generate static routes (SSG), SEO metadata, and a sitemap.xml file.

generateStaticParams

The generateStaticParams function can be used in combination with dynamic route segments to statically generate routes at build time instead of on-demand at request time.

Read more about generateStaticParams in Next.js

Usage

Use with the default post types (pages and posts) by simply re-exporting the function from your page.tsx file.

src/app/[[...paths]]/page.tsx

export { generateStaticParams } from '@nextwp/core'

Or you can customize the function by importing it and passing in more options, like additional post types that you want to generate.

src/app/[[...paths]]/page.tsx

import { generateStaticParams as nextWpStaticParams } from '@nextwp/core'

export async function generateStaticParams(params) {
  return nextWpStaticParams({
    postTypes: ['pages', 'posts', 'movie'],
  })
}

Parameters

  • Name
    postTypes
    Type
    string[] (optional)
    Description

    An array of strings representing the custom post types in your WordPress setup. Each string should match the rest_base of the post type in the WordPress REST API.
    Default value: ["pages", "posts"]
    Example values: ["pages", "posts", "custom-post-type"]

  • Name
    wpUrl
    Type
    string (optional)
    Description

    A string representing the WordPress URL.
    Defaults to the NEXT_PUBLIC_WP_URL environment variable.

generateMetadata

The generateMetadata function can be used in combination with dynamic route segments to generate SEO metadata for the page, such as the page title, description, and og image by fetching YoastSEO data from the WordPress REST API.

This requires the YoastSEO plugin to be installed and activated in WordPress.

Usage

You can generate metadata for all pages and post types by simply re-exporting the function from your dynamic route segment page.tsx file.

src/app/[[...paths]]/page.tsx

export { generateMetadata } from '@nextwp/core'
Read more about generating metadata in Next.js

Parameters

  • Name
    params
    Type
    object
    Description

    The params object containing the dynamic route param paths provided by Next.js
    Example value: { paths: ['path', 'to', 'page'] }

  • Name
    params.paths
    Type
    string[]
    Description

    An array of strings representing path segments.

  • Name
    wpUrl
    Type
    string (optional)
    Description

    A string representing the WordPress URL.
    Defaults to the NEXT_PUBLIC_WP_URL environment variable.

Returns

Promise<Metadata>: The function returns a promise that resolves to a Next.js Metadata object.

Read more about the Metadata API in Next.js

generateSitemap

This function generates a sitemap.xml file, essential for search engine optimization (SEO), by fetching data from the WordPress REST API.

Usage

You can generate a sitemap for the default post types (pages and posts) by simply re-exporting the function from your sitemap.ts file.

src/app/sitemap.ts

export { generateSitemap as default } from '@nextwp/core'

You can also customize the function by importing it and passing in more options, like additional post types that you want to include in the generated sitemap.

src/app/sitemap.ts

import { generateSitemap } from '@nextwp/core'

export default function sitemap() {
  return generateSitemap({
    postTypes: ['pages', 'posts', 'team', 'project'],
  })
}
Read more about sitemap generation in Next.js

Parameters

  • Name
    postTypes
    Type
    string[]
    Description

    An array of strings representing the custom post types in your WordPress setup. Each string should match the rest_base of the post type in the WordPress REST API.
    Default value: ["pages", "posts"]
    Example values: ["pages", "posts", "custom-post-type"]

Returns

Promise<MetadataRoute.Sitemap>
A promise that resolves to an array of sitemap entries. Each entry is an object with the following properties:

  • Name
    url
    Type
    string
    Description

    The full URL to the page or post.

  • Name
    lastModified
    Type
    string
    Description

    The last modification date of the item in GMT, reflecting content updates.

  • Name
    changeFrequency
    Type
    string
    Description

    Indicates how frequently the content at the URL is likely to change. Default is set to "daily".

  • Name
    priority
    Type
    number
    Description

    The priority of this URL relative to other URLs on your site. Default is set to 0.5.

Example Result

[
  {
    "url": "https://example.com",
    "lastModified": "2021-08-04T14:00:00.000Z",
    "changeFrequency": "daily",
    "priority": 0.5
  },
  {
    "url": "https://example.com/page-2",
    "lastModified": "2021-08-04T14:00:00.000Z",
    "changeFrequency": "daily",
    "priority": 0.5
  }
]

This result would generate a sitemap.xml file that looks like this:

Example Sitemap


<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<url>
  <loc>https://example.com</loc>
  <lastmod>2021-08-04T14:00:00.000Z</lastmod>
  <changefreq>daily</changefreq>
  <priority>0.5</priority>
</url>
<url>
  <loc>https://example.com/page-2</loc>
  <lastmod>2021-08-04T14:00:00.000Z</lastmod>
  <changefreq>daily</changefreq>
  <priority>0.5</priority>
</url>
</urlset>

Was this page helpful?