Joomla Templates Club 406,261 posts

[neilpovey Friend neilpoveyJoin date: March 2008Posts: 21Downloads:0Uploads:1 Thanks: 6 Thanked: 1 times in 1 posts]

#183466

How do you remove or change the order of the Social icons that are in position 5? I only need Facebook and Twitter, not Google plus and Flickr.

When I remove these two it keeps Twitter underneath Facebook rather than next to each other.

Appreciate some help, thanks.

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#477725

You can try with my suggestion
<blockquote>Admin ->Module->Social (custom module)</blockquote>
from


<div class="social-wrap"><a class="btn-icon btn-small icon-facebook" href="#" title="Facebook">Facebook</a> <a class="btn-icon btn-small icon-google-plus" href="#" title="Google plus">Google plus</a> <a class="btn-icon btn-small icon-twitter" href="#" title="Twitter">Twitter</a> <a class="btn-icon btn-small icon-flicker" href="#" title="Flicker">Flicker</a></div>

change to

<div class="social-wrap"><a class="btn-icon btn-small icon-facebook" href="#" title="Facebook">Facebook</a> <a class="btn-icon btn-small icon-twitter" href="#" title="Twitter">Twitter</a></div>

Change on css file
<blockquote> templates/ja_mero/css/template.css</blockquote>

.icon-twitter {
background-image: url('../images/ico/twitter.png');
margin: 0 10px 0 0;
}
change to

.icon-twitter {
background-image: url('../images/ico/twitter.png');
margin: 0px;
}

1 user says Thank You to Ninja Lead for this useful post

1. dieudonne

[dieudonne Friend dieudonneJoin date: January 2011Posts: 947Downloads:61Uploads:266 Thanks: 452 Thanked: 107 times in 3 posts]

#486673

Excellent.

Thank you very much for this great tip.
It is working very well. Very usefull !

[dieudonne Friend dieudonneJoin date: January 2011Posts: 947Downloads:61Uploads:266 Thanks: 452 Thanked: 107 times in 3 posts]

#486708

But there is a problem.
There is now only 2 social icons, but the space module is still the same. See screenshot fot more understanding.

What can we do to fix this ?

Thank in advance.

---

Attachments:

1. 

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#486780

You can fix it with my suggestions

Go to Admin -> Module Manager -> Find Social and position-5

from


<div class="social-wrap"><a class="btn-icon btn-small icon-facebook" href="#" title="Facebook">Facebook</a> <a class="btn-icon btn-small icon-google-plus" href="#" title="Google plus">Google plus</a> <a class="btn-icon btn-small icon-twitter" href="#" title="Twitter">Twitter</a> <a class="btn-icon btn-small icon-flicker" href="#" title="Flicker">Flicker</a></div>

change to


<div class="social-wrap"><a class="btn-icon btn-small icon-facebook" href="#" title="Facebook">Facebook</a> <a class="btn-icon btn-small icon-twitter" href="#" title="Twitter">Twitter</a></div>


Open templates/ja_mero/css/custom.css file

add new script below


.icon-twitter {
background-image: url(../images/ico/twitter.png);
margin: 0 0 10px 0;
}
.icon-twitter:hover,
.icon-twitter:focus,
.icon-twitter:active {
background-color: #02b3eb
background-position: left bottom;
}


Let me know the result

[Author]

Posts