Create a visual feed using Channable

Steps:

  • In Channable:
    • Set up an import
    • Configure project fields
    • Add feed
    • Activate
  • In Tweakwise:
    • Import the visual feed
    • Configure the item-type characteristic
    • Start using the visuals in builder
    • Finalize

In Channable

Follow the next chapters to set up a feed correctly in Channable.

Set up an import

Make sure you have something to connect to. In this example we'll use a CSV import:

id;name;image;url
"visual-free-shipping";"Free shipping Banner";"https://sttweakwisecustomized.blob.core.windows.net/xslt/loic/images/banner-freeshipping.png";"https://demo.tweakwise.com/javascript/8bf83945/1000"
"visual-perfectfit";"Find Your Perfect Fit Banner";"https://sttweakwisecustomized.blob.core.windows.net/xslt/loic/images/banner-findyourperfectfit.png";"https://twndemostarter.tweakwise.com/GuidedSelling?InstanceKey=8bf83945&Code=8bf83945"
"visual-pillow";"Pillow Banner";"https://sttweakwisecustomized.blob.core.windows.net/xslt/loic/images/banner-pillows.png";"https://twndemostarter.tweakwise.com/Recommendations?InstanceKey=8bf83945&RecommendationsType=Featured&FeaturedId=8"

Note: like we expect with other items, the actual images for the visuals should be stored on your platform or CDN.

Configure project fields

Go to Setup > Project fields and make sure these fields are available:

FieldTypeUsed in import
idtextyes
titletextyes
image_linkimageyes
linktextyes
brandtextno
item_typetextno
pricenumberno
stocknumberno

Check items

Once the import is set up, make sure the file is imported correctly:

Add feed

Go to Feeds > Add a new feed. Search for Tweakwise. Select Tweakwise Navigator. Give it a name, select a market and hit Continue.

Configure categorization

For visuals, a category is optional but in the Channable Tweakwise Feed tool it is mandatory. To work around this problem, select Manual Categorizaton and configure any rule and enter "-" in Set to category.

Configure rules

Brand, price & stock are mandatory in the Channable Tweakwise Feed. To work around this, configure rules to set these to some default values.

NameIfThen
Item typeitem_type is emptytake item_type and set to value visual
Brandbrand is emptytake brand and set to value Tweakwise
Priceprice is emptytake priceand set to value 0
Stockstockis emptytake stockand set to value 0

Finalize

Map the mandatory internal fields to the Channel field names and add the item_type, link and image_link fields:

After hitting Save & run, the preview should display a valid Tweakwise Feed, including the items imported earlier:

Note: the feed will not be perfect, but we can work with this.

Activate

In settings, activate the feed and save the feed URL for later.


In Tweakwise

❗️

Important

Some of these steps are Tweakwise only or can be destructive if configured incorrect. Play around on a test instance to get the configuration working before elevating to production.

Import the visual feed

Go to Connectivity > Tasks and add a new task.

Enter Import: visuals with type Import default feed and hit next.

In the setup tab, enter the URL to the channable feed and set the type to Import items only and Item type Visual.

Hit save.

Run the import, the visual items should be available in the item module.

Configure the item-type characteristic

Contact us to configure the item-type characteristic.

After the configuration is successful, the type filter is available in the items module:

Configure image & url attributes

Depending on the item_type, the correct image & url attributes should be configured. Contact us to configure these as characteristic.

Depending on the feed, configure derived attributes for image & url to take the item_type into account.

Start using visuals in Builder

Once the types are available, for every item type a new Builder component is unlocked:

Note: as a side-effect, a product component is also available. This will allow you to pin a specific product in Builder (like pins, but in a less magical way).

Finalize

After a publish, the configured visual should be visible in the demoshop:


In your platform

Support

Magento

  • Magento2Tweakwise v8.1.0 and higher
  • Magento2TweakwiseHyva v4.1.0 and higher

Troubleshooting

If your platform supports items other then products, and it is not showing up in your lister pages, there are a couple of things to check.

Magento

  • Check if your version supports item-types.
  • Merchandising Builder > Enabled: Yes.
    The Merchandising Builder section is only visible when Ajax Filtering is on.
  • Layered navigation > Ajax Filtering: Yes.
    The Merchandising Builder section is only visible when Ajax Filtering is on.
  • Enable alternative caching mechanism (eg Varnish)
    Required for Builder.

Additional options