In general, in most of our premium themes when you hover the social icons (in header and footer), the icon color is being changed.

Is some cases, you may want to add appearing effect to tilt the social icons on hover. Here’s how it can be done:

1. Navigate to Admin Panel -> Left Menu -> Appearance -> Editor
2. Open your_theme/style.css
3. If you want to apply the effect for header social icons insert the following code (i.e. in the end of the file):.header-social-widget a:hover {
   -webkit-transform:rotate(-20deg);
   -moz-transform: rotate(-20deg);
   -o-transform: rotate(-20deg);
   -ms-transform: rotate(-20deg);
   transform: rotate(-20deg);
   }
4. If you want to apply the effect for footer social icons insert the following code (i.e. in the end of the file):.footer-social-widget a:hover {
   -webkit-transform:rotate(-20deg);
   -moz-transform: rotate(-20deg);
   -o-transform: rotate(-20deg);
   -ms-transform: rotate(-20deg);
   transform: rotate(-20deg);
   }
5. If you want to apply the effect for social sharing icons after single post, insert the following code (i.e. in the end of the file):.social-sharing-box a:hover {
   -webkit-transform:rotate(-20deg);
   -moz-transform: rotate(-20deg);
   -o-transform: rotate(-20deg);
   -ms-transform: rotate(-20deg);
   transform: rotate(-20deg);
   }
6. Save Changes

Please Note: You can change the above value to any other value, i.e. instead of -20deg you can add -30deg or -40deg.

Best-selling Products:

Newsletter Subscription