Velo: Automatically Make All Repeaters Clickable Without Hardcoding IDs?

Ask the community
, , ,
1

Hi everyone,

Right now I’m using Velo code to make multiple repeaters clickable so that the entire container inside each repeater item links to a dynamic product page.

Here’s the approach I’m using:

import wixLocation from 'wix-location';

$w.onReady(function () {

    function makeRepeaterClickable(repeaterId, containerId) {
        $w(repeaterId).onItemReady(($item, itemData, index) => {

            const productUrl = `/product-page/${itemData.slug}`;

            $item(containerId).onClick(() => {
                wixLocation.to(productUrl);
            });

        });
    }

    // Apply to multiple repeaters
    makeRepeaterClickable("#repeater2", "#productContainer");
    makeRepeaterClickable("#repeater3", "#clickArea");

});

This works fine, but I’m wondering:

:backhand_index_pointing_right: Is there a true drag-and-drop solution for this?

Ideally, I’d love a way to:

  • Make the entire repeater item clickable

  • Link directly to the dynamic page

  • Avoid writing custom code for each repeater

  • Avoid manually mapping repeater IDs

Is there a built-in dataset connection method, hidden setting, or best practice pattern I’m missing?

Would appreciate any insight from anyone who’s solved this more elegantly.

Thanks!