useContzaFields()

React hook for using Contza fields "programatically".

Returned values

text	Returns text with minimalistic html formattings (equal to <ContzaText />)
image	Returns image information (equal to <ContzaImage />)
rawText	Returns raw string, nothing more (equal to <ContzaRawText />)
boolean	Returns a boolean

Examples

Here are a few examples how to use useContzaFields() hook.

Text

import { useContzaFields } from "@contza/react";
 
const SEO = () => {
  const { rawText } = useContzaFields();
 
  return (
    <head>
      <title>{rawText`Title`}</title>
    </head>
  );
};
 
export default SEO;

Image

import { useContzaFields } from "@contza/react";
 
const SEO = () => {
  const { image } = useContzaFields();
 
  return (
    <head>
      <meta property="og:image" content={image("Image").src} />
    </head>
  );
};
 
export default SEO;

Raw text

import { useContzaFields } from "@contza/react";
 
const SEO = () => {
  const { rawText } = useContzaFields();
 
  return (
    <head>
      <title>{rawText("Title")}</title>
    </head>
  );
};
 
export default SEO;

Boolean

import { useContzaFields, ContzaText } from "@contza/react";
 
const SEO = () => {
  const { boolean } = useContzaFields();
 
  const isVisible = boolean("Is visible");
 
  return (
    <div>
      {isVisible ? (
        <ContzaText>Visible</ContzaText>
      ) : (
        <ContzaText>Not visible</ContzaText>
      )}
    </div>
  );
};
 
export default SEO;

Raw text Contza Provider