The following script can be used to update the colours that are seen when either when a visitor hovers over an asset or clicks through to an asset. This allows for further customization within Target tracks to match your company branding. 

To see more examples of code snippets, read Frequently Used External Code Snippets to Personalize Your PathFactory Experiences.

See This Script In Action

Where to place the script?

This script can be added through your External Code library and you can find a step by step guide on how to do so in our article Using External Code. The location can be set to ‘Head Tag’ and be applied to any PathFactory track with our Flow Promoter enabled. 

Underlined codes you will need to replace with your ‘Active item’ color code.

Bolded codes you will need to replace with your ‘Hover item’ color code.

Code Snippet

<style>

div[id^=”flow-item”] span, div#flow-active-item span {

    opacity: 1;

}

div#flow-active-item {

    background-color: #54ace2; /*<–replace with preferred primary color*/

}

div[id^=”flow-item”]:hover {

    background-color: #ff994c; /*<–replace with preferred secondary color*/

}

</style>