Roll-over Social Icons

Pixelade

I would to do that the social icons could have a roll-over effect (The same icon with different color). It's possible?

Thanks!

[Deleted User]

Hi,
I think the easiest way to do it is use one of this filters:

http://net.tutsplus.com/tutorials/html-css-techniques/say-hello-to-css3-filters/

Can you do it by yourself?

Best,
Miłosz

Pixelade

Hi!

This isn't that I want. I want, if it's possible, that the "icon-off.png" it change to a "icon-on.png".

I used this code in the "Coming soon" page (http://www.lovelydays.es)

.social-wrapper a.fb { background: transparent url("../images/facebook-off.png") no-repeat; float: left; margin-left: 400px;}
.social-wrapper a.fb:hover { background: transparent url("../images/facebook-on.png") no-repeat;}
.social-wrapper a.tw { background: transparent url("../images/twitter-off.png") no-repeat; float: right; margin-right: 400px;}
.social-wrapper a.tw:hover { background: transparent url("../images/twitter-on.png") no-repeat;}

Another question... I can change the order for the social icons? Where?

Thanks!

PS: My english is very bad, sorry!

[Deleted User]

Hi,
the easiest way to achieve this is to delete our social icons system and paste in the footer your icons.
Our icons don't have roll-over version.
I can help you with that.

There is no option to change order of icons.

Best,
Miłosz

Pixelade

Hi!

I will try to change the code of the social icons. But I don't know wich part of the code I can delete.

I want to do a inline list and centered with the icons of Facebook, Twitter, Google+ and Pinterest. Can you help me?

Thanks for all!

[Deleted User]

Hi,
In the footer.php file, in line 41 is this code:

         	<div id="social_icons">
             	<?php
            foreach ((array)$apollo13- >get_option('social_options', 'social_services') as $id => $value) {
                if (!empty($value)) {
                    echo ' 	<a target="_blank" href="' . $value . '" title="' . __('Follow us on ', TPL_SLUG) . $apollo13->all_theme_options['social_options']['social_services'][$id] . '"> 	<img src="' . TPL_URI . '/common/images/social_icons/' . $id . '.png" alt="" /></a>';
                }
            }
            ?>
         	</div>

You can delete all content in siocal_icon div.

Best,
Miłosz