Unable to have social media icons hover after changing SVG data (not file name)

Topic summary

A user encountered an issue where social media icons failed to display hover effects after modifying SVG data (not the file name). The problem was demonstrated through an animated GIF showing the non-functional hover state.

Resolution:

  • The issue was identified in the SVG markup
  • Solution: Add class="icon" attribute inside the SVG tag
  • Syntax: <svg class="icon" ...>

Status: Resolved successfully. The user confirmed the fix worked perfectly.

Summarized with AI on November 1. AI used: claude-sonnet-4-5-20250929.

Here is a proper visual showcasing my issue:

2025-01-3016-35-51-ezgif.com-video-to-gif-converter.gif

Hi @carsonkingston
Just share your site link please then i will provide you code for this.

1 Like

My site is cantinasurplus.com

Found the issue :slightly_smiling_face:
So the svg you have added,there you need to add this class=“icon”,like this


just add this inside svg tag anfter <svg ....here
1 Like

Worked perfectly, thank you so much!

1 Like