Customize Link rendering variant to append query string parameters

Question

I want to customize an SXA link component with a rendering variant that appends query string parameters to the link based on fields on the page item. I'm using a Scriban template something like this:

{{
    text = i_item.Name
    baseLink = i_item.Link
    hasQsParam = (baseLink | string.contains '?')
    href = null
    if(hasQsParam)
        href = baseLink + '&pid=' + i_page.ReferenceNumber
    else
        href = baseLink + '?pid=' + i_page.ReferenceNumber
    end
}}
<a href="{{href}}" alt="{{text}}">{{text}}</a>

When I select my custom variant, both the regular link renders, as well as the Scriban generated HTML for some reason; I was expecting just the Scriban gen'd HTML to render.

I'm thinking about just writing a custom component for this instead; but am what I'm trying to do now feasible? Spent enough time on this that I'm starting to think this is the wrong approach.

Answer 1

Never mind, there was an error in my template code. I used i_item.Link, which renders the HTML for the link; when I should have used the i_item.url property instead. Once I fixed this, template worked as expected.

{{
    text = i_item.Name
    baseLink = i_item.url
    hasQsParam = (baseLink | string.contains '?')
    href = null
    if(hasQsParam)
        href = baseLink + '&pid=' + i_page.Pid
    else
        href = baseLink + '?pid=' + i_page.Pid
    end
}}
<a href="{{href}}" alt="{{text}}">{{text}}</a>