getWordPressProps
getWordPressProps is a function that should be returned within Next.js’ getStaticProps or getServerSideProps to properly setup the Faust Template Hierarchy system.
Usage
To properly configure getWordPressProps, create pages/[...wordpressNode].js with the following content:
import { getWordPressProps, WordPressTemplate } from "@faustwp/core";
export default function Page(props) {
return <WordPressTemplate {...props} />;
}
export function getStaticProps(ctx) {
return getWordPressProps({ ctx });
}
export async function getStaticPaths() {
return {
paths: [],
fallback: "blocking",
};
}This above example uses
getStaticProps, but you can also use getServerSideProps as they are both supported.Configuration
Below is the getWordPressProps config object defined as a TypeScript type:
type GetWordPressPropsConfig<Props = Record<string, unknown>> = {
/**
* The Next.js getServerSideProps or getStaticProps context. This is required.
*/
ctx: GetServerSidePropsContext | GetStaticPropsContext;
/**
* Any props you would like returned to the Faust templates
*/
props?: Props;
/**
* The Next.js revalidate value. By default, Faust sets a smart default of 900 seconds (15 minutes)
*/
revalidate?: number | boolean;
/**
* Provide extra parameters for the Page.variables function call.
*/
extra?: Props;
};Passing Extra Arguments
Within the data fetching functions (getNextStaticProps, getServerSideProps, getWordPressProps), you can pass an object containing your desired extra data to the extra property of the options argument:
export function getStaticProps(ctx) {
return getWordPressProps({ ctx, extra: { hello: "world" } });
}Accessing Extra Arguments
Inside your component’s variables() function, you can access the passed extra arguments through the third parameter named extra. This will be an object containing the key-value pairs you provided:
Component.variables = ({ databaseId }, ctx, extra) => {
console.log(extra); // {hello: 'world'}
// Use the data from extra object
...
}