Metro Style Hovering Effect Social Media Icon To WordPress Widget

Social media is a one of the best ways to attract more visitors to blogs. Every blogger has Facebook, Twitter, Google plus, YouTube profiles. Adding stylish social media icons are one of the best way to promote your profiles. Also it gives a better look than the ordinary icons. Now we can add metro style with hovering effects to social media icon in the WordPress site.  There are lots of plug-in to add add your profile link to your sidebar.

Brankic social media widget, is a one of the attractive plugin for WordPress. This WordPress social media plugin has mouse hovering effect with large number of icons. At present it has 48 social network icons. In future it will grow. It allows user to customize icons background as well as hovering color effects using HTML color codes. In order to customize icon color user need to edit the plugin.

Brankic social media plugin doesn’t have an email subscribe option. Probably it will come soon. After activated the plugin user can add widget on a theme. There is no separated settings page everything should on add widget page.
Brankic social media icons sample

How to configure.

  • Add widget.
  • Drag and drop Brankic social media widget to anywhere you want.
  • Next customizes color code.
  • Then type your social media network URL.
  • After that select its icon.
  • Likewise add all the social media profiles likes and icon.
  • Save the widget.
  • That’s all.

If your site uses caching and CDN network, clean cache and purge CDN. Apart from that if the site uses a caching plugin such as W3Total or supercache clear these plugin cache.

See also  Speed Disqus Comments Load With Conditional On Click Load



Developer: Brankic1979
Price: Free


How to customize the icon background color.

User can edit its icon color (after hover mouse), by editing the plugin color codes.

  • Easiest way to editing it though the wordperss dashboard. You can also edit it using an FTP client or Cpanel file manager.
  • Go to “Plugins>Edit”.

Edit plugin

  • In “

Select plugin

  • Next click right side “bra_social_media.css” file.

Choose plugin css file

  • Then browse icon that you want. For an instance if twitter, then edit it
    • background-color: #487fd2;


Change html color code

  • Html color code (bold part). You can search color codes on this site in here.
  • Click Save button.
  • That’s all.


Again if you use the caching system to delete all the cache. Apart from that if you use Cloudflare, purge the cache otherwise this CSS tweak not visible. In future when you are updating this plugin it will reset above tweak, at that time user have to repeat above tweak. However if you use a child theme tweak, plugin update will not affect color code.

error: Content is protected !!