Make image a link

I have the text that appears below the ProductShot as a link, but how do I make the image a link in this template?
 
    <ItemTemplate>
        <li class="brand"  data-sf-provider='<%# Eval("Provider.Name")%>' data-sf-id='<%# Eval("Id")%>' data-sf-type="Telerik.Sitefinity.DynamicModules.Model.DynamicContent">
            <sf:ImageAssetsField runat="server" DataFieldName="ProductShot" IsThumbnail="True" />
            <h6 class="brand">
                <sf:DetailsViewHyperLink ID="DetailsViewHyperLink" TextDataField="BrandName" runat="server" data-sf-field="BrandName" data-sf-ftype="ShortText" />
            </h6>
   <sitefinity:TextField runat="server" DisplayMode="Read" Value='<%# Eval("MiniDescription")%>' />
          <sf:CommentsCountControl runat="server" ID="commentsCounterControl" CssClass="sfCommentsCounter" ThreadType='<%# Container.DataItem.GetType().FullName%>' ThreadKey='<%# ControlUtilities.GetLocalizedKey(Eval("Id")) %>' DisplayMode="ShortText" />
        </li>

  </ItemTemplate>

Have you tried this?

  <sf:DetailsViewHyperLink ID="DetailsViewHyperLink" TextDataField="BrandName" runat="server" data-sf-field="BrandName" data-sf-ftype="ShortText">
          <sf:ImageAssetsField runat="server" DataFieldName="ProductShot" IsThumbnail="True" />
</sf:DetailsViewHyperLink>

Yes, that gives this parse error:

Parser Error Message: The ID 'DetailsViewHyperLink' is already used by another control.

Well you didn't cut and paste that in right....because in .net IDs have to be unique...I was saying modify the existing one, or if you want both to be seperate links



<sf:DetailsViewHyperLink ID="DetailsViewHyperLink2" TextDataField="BrandName" runat="server" data-sf-field="BrandName" data-sf-ftype="ShortText">
          <sf:ImageAssetsField runat="server" DataFieldName="ProductShot" IsThumbnail="True" />
</sf:DetailsViewHyperLink>

I replaced it like you intended this time and the Product Shot disappears...

Reverted back and tried it with your second post and it did the same thing...

I don't much use the "sf:" fields, so I could be wrong here but an asp:HyperLink, if you specify "Text" property, all the nested controls will fail to render.

On the above DetailsViewHyperLink2 please try removing "TextDataField" property, such that the link will get no .Text, then see if the image renders inside the link.

I replaced with this and it rendered the same way; no image, and a hyperlink:
<sf:DetailsViewHyperLink ID="DetailsViewHyperLink2" runat="server" data-sf-field="BrandName" data-sf-ftype="ShortText">
          <sf:ImageAssetsField runat="server" DataFieldName="ProductShot" IsThumbnail="True" />
</sf:DetailsViewHyperLink>

This is a really simple task in standard HTML development. I can't believe it's this difficult.

Ok, here's what worked:
 <sf:DetailsViewHyperLink ID="DetailsViewHyperLink" runat="server" data-sf-field="BrandName">
          <sf:ImageAssetsField runat="server" DataFieldName="ProductShot" IsThumbnail="True" />
 </sf:DetailsViewHyperLink>         
            <h6 class="brand">
                <sf:DetailsViewHyperLink ID="DetailsViewHyperLink2" TextDataField="BrandName" runat="server" data-sf-field="BrandName" data-sf-ftype="ShortText" />
            </h6>
   <sitefinity:TextField runat="server" DisplayMode="Read" Value='<%# Eval("MiniDescription")%>' />

In addition to Stephen2's suggestion of removing the "TextDataField", I also removed "data-sf-ftype="ShortText" from Steve's original suggestion.

Thanks for your help Steve and Stephen!

That was harder than it should have been, I agree... I don't like those SF fields much because I don't understand them.  I will usually use standard <asp> fields, with various Eval functionality instead.

@Stephen
  Well in this case you can't use a hyperlink because the Sfdetailsview control resolves whatever page you set as the 'single' view.  So the only way for you to use hyperlink is if you always know the page and forgo letting the user pick the single page.

Actually that sfdetailsview inherits from the asphyperlink anyway so you get all those properties as well.

Steve

You'll probably laugh, but I genuinely have done this in the past:
<asp:HyperLink runat="server" NavigateUrl='<%# ((HyperLink)Container.FindControl("DetailsViewHyperLink")).NavigateUrl %>'>
  <asp:Image xxxxx />
</asp:HyperLink>

I had to disable its own link and wrap internal div  into my link 

<sf:DetailsViewHyperLink runat="server" Enabled="false">
                <a href="/news-and-events/all-news/news-details?id=<%# Eval("Id")%>">