---
updatedAt: 2026-01-22T11:08:12.000Z
---
# Implement Context Using Code
Grab the code from the General Settings screen and paste the relevant code on each page inside the `` tag.
**Note:** Make sure to define the context in every page's `` tag (both for SPA and non-SPA sites) before the script.
```javascript Homepage example
/**
* @param {string} type
*/
```
```javascript Product page example
/**
* @param {string} type
* @param {string[]} data
*/
```
Here are some code examples.
### Using hooks in SPAs
```javascript Homepage example
/**
* @param {string} type
* @param {string[]} data
*/
export function setDYContext(type, data) {
window.DY = window.DY || {};
DY.recommendationContext = { type: type, data: data };
}
export default function HomePage() {
// ...
useEffect(() => setDYContext('HOMEPAGE'));
return (
// ...
)
}
```
```javascript Product page example
/**
* @param {string} type
* @param {string[]} data
*/
export function setDYContext(type, data) {
window.DY = window.DY || {};
DY.recommendationContext = { type: type, data: data };
}
export default function ProductPage(props) {
// ...
useEffect(() => setDYContext('PRODUCT', [ props.sku ]), [ props.sku ]);
return (
// ...
)
}
```
### Using lifecycle methods in SPAs
```javascript Homepage example
/**
* @param {string} type
* @param {string[]} data
*/
export function setDYContext(type, data) {
window.DY = window.DY || {};
DY.recommendationContext = { type: type, data: data };
}
export default class HomePage extends React.Component{
// ...
componentDidMount() {
setDYContext('HOMEPAGE');
}
render() {
return(
// ...
)
}
}
```
```javascript Product page example
/**
* @param {string} type
* @param {string[]} data
*/
export function setDYContext(type, data) {
window.DY = window.DY || {};
DY.recommendationContext = { type: type, data: data };
}
export default class ProductPage extends React.Component{
constructor(props) {
super(props);
this.state = { sku: props.sku }
}
// ...
componentDidMount() {
setDYContext('PRODUCT', [ this.props.sku ]);
}
componentDidUpdate(prevProps) {
if (prevProps.sku !== this.props.sku) {
setDYContext('PRODUCT', [ this.props.sku ]);
}
}
render() {
return(
// ...
)
}
}
```
### Example: Product page context (e-commerce and financial institutions)
```javascript
```
### Example: Post page (media)
```javascript
```