How can I display an icon/link as a Table column?

šŸ’¬ App Building
1
  • Goal: Display a small link icon, which, when clicked opens a new tab to an external web site.
  1. I can set the column to Icon style, and choose the /icon to be what I want.
  2. I can set the event handler for click so it opens the link I want but...
  3. When the use hovers over the cell they get the arrow cursor and not the usual "link" pointer

If I set the column to Link type I can't figure out how to make it an icon when displayed. I don't want to display a long URL in the column.

2

Hey @Charlie_Evett

Can you share the screenshots?

3

Screenshot 2025-03-13 at 9.52.24 AM
Screenshot 2025-03-13 at 9.52.24 AM3004Ɨ641 106 KB

See the link icon in the Stripe column. The cursor stays as arrow when I hover and I'd like it to change to the normal link pointing figure cursor. As the URL is long I don't want to display the URL in that field, I just want the little icon to display in the column.

4

You should be able to accomplish this by setting the column format to HTML and adding this HTML to the value:

<a 
    href="https://yourlink.com" 
    target="_blank" 
    style="cursor: pointer; text-decoration: none;" 
    onmouseover="this.style.cursor='pointer'">
  šŸ”—
</a>

Don't forget to replace the "https://yourlink.com" part with your actual link. I think you can also make this dynamic. Let me know if this helps you :slight_smile:

5

Thanks! That works fine. If I have some time I can figure out how to use the icon from the same family I'm using elsewhere.

1 Like