Pages

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Published by Scroll Versions from this space and version 6.8

...

Property (data)DescriptionType
content

Content of the modification as a single string. Newlines and other control characters in the original content are converted into escape sequences in the returned string.

The following examples show the content of a modification as defined in the modification and as returned in the content property:

Code Block
languagexml
themeRDark
titleOriginal modification content
<p>My Frosmo-managed content...</p>
<p>...straight from a modification!</p>


Code Block
languagejs
themeRDark
titleModification content returned in frosmoModificationContext.content
"<p>My Frosmo-managed content...</p>\n<p>...straight from a modification!</p>"


String
params

Template defaults defined for the modification, if any.

The following examples show two template defaults as defined in the modification and as returned in the params property.

Code Block
languagejs
themeRDark
titleTemplate defaults in the modification (JSON object)
{
    "name": "My Product",
    "price": 99.99
}


Code Block
languagejs
themeRDark
titleTemplate defaults in the params property (JavaScript object)
{
    name: "My Product",
    price: 99.99
}

The template defaults are also available as props in all children of the FrosmoPlacement component. In the following example, ProductMessage receives the template defaults name and price as props from FrosmoPlacement.

Code Block
languagejs
themeRDark
<FrosmoPlacement id="frosmo-placement">
    <ProductMessage />
</FrosmoPlacement>

class ProductMessage extends Component {
    render() {
        const content = {__html: this.props.name + " costs only " + this.props.price + " euros!"};
        return (
            <div dangerouslySetInnerHTML={content} />
        );
    }
}

For more information about templates, see Creating and using modification templatesTemplates.

Object
variationNumber of the modification variation whose content was returned.Number
Property (function)DescriptionType
setTrackableElements

Function for setting which HTML elements to start tracking for clicks, displays, and true displays when calling startTracking. Any tracked events get attributed to the modification.

The function takes one parameter:

  • If you want to track a single element, define an HTMLElement representing that element.
  • If you want to track multiple elements, define an array of HTMLElements representing those elements.

For more information, see Tracking basic events for React fragments.

Info

You only need this function when implementing click, display, and true display tracking for a child component that is rendered as a fragment. You do not need this function if you have no fragments or do not want to track their content for clicks, displays, and true displays.


Function
startTracking

Function for starting click, display, and true display tracking for the elements set by setTrackableElements. Once started, the Frosmo Platform automatically tracks clicks, displays, and true displays for the specified elements (until the visitor reloads the page, navigates away from the page, or closes the page). Any tracked events get attributed to the modification.

For more information, see Tracking basic events for React fragments.

Info

You only need this function when implementing click, display, and true display tracking for a child component that is rendered as a fragment. You do not need this function if you have no fragments or do not want to track their content for clicks, displays, and true displays.


Function
setDisplayed

Function for manually triggering a display event for the modification.

Use this function if a child of the FrosmoPlacement component uses a 3rd-party plugin that blocks the normal event tracking of the Frosmo Platform, but you still want to send displays for the child component. The displays get attributed to the modification.

Function
setTrueDisplayed

Function for manually triggering a true display event for the modification.

Use this function if a child of the FrosmoPlacement component uses a 3rd-party plugin that blocks the normal event tracking of the Frosmo Platform, but you still want to send true displays for the child component. The true displays get attributed to the modification.

Function
setClicked

Function for manually triggering a click event for the modification.

Use this function if a child of the FrosmoPlacement component uses a 3rd-party plugin that blocks the normal event tracking of the Frosmo Platform, but you still want to send clicks for the child component. The clicks get attributed to the modification.

Function

...