Function useNostoOther

useNostoOther(props?: NostoOtherProps): void

You can personalise your miscellaneous pages by using the useNostoOther hook.

Parameters

Optionalprops: NostoOtherProps

Returns void

Example: Basic usage for contact page

import { useNostoOther } from '@nosto/nosto-react'

function ContactPage() {
  useNostoOther({
    placements: ['contactpage-nosto-1', 'contactpage-popular-products']
  })

  return (
    <div>
      <h1>Contact Us</h1>
      <form>
        {/\* Contact form fields */}
      </form>
      <div id="contactpage-popular-products" />
      <div id="contactpage-nosto-1" />
    </div>
  )
}

Example: About page with recommendations

import { useNostoOther } from '@nosto/nosto-react'

function AboutPage() {
  useNostoOther({
    placements: ['aboutpage-featured', 'aboutpage-bestsellers']
  })

  return (
    <div>
      <h1>About Our Company</h1>
      <p>Learn more about our story...</p>
      <div id="aboutpage-featured" />
      <div id="aboutpage-bestsellers" />
    </div>
  )
}

Example: Default placements for any other page

import { useNostoOther } from '@nosto/nosto-react'

function GenericPage() {
  useNostoOther() // Uses all available placements

  return (
    <div>
      <h1>Generic Page</h1>
      <p>This could be any page type not covered by other hooks.</p>
    </div>
  )
}