Joomla Templates Club 406,261 posts

[khoand Friend khoandJoin date: February 2011Posts: 4500Downloads:0Uploads:179 Thanks: 169 Thanked: 1166 times in 1060 posts]

#170078

If you want to show facebook module like
You replace this code from /templates/ja_teline_iv/css/template.css


#ja-topmega li.nav-blog a.nav-blog,
#ja-topmega li.nav-interview a.nav-interview,
#ja-topmega li.nav-social a.nav-social,
#ja-topmega li.nav-feeds a.nav-feeds {
padding: 4px 0 3px;
margin: 3px 5px;
text-indent: -1000em;
width: 28px;
}

#ja-topmega li.nav-blog,
#ja-topmega li.nav-interview,
#ja-topmega li.nav-social,
#ja-topmega li.nav-feeds { float: right; border: none; }

#ja-topmega li.nav-social .childcontent-inner { background: #fff; }


with

#ja-topmega li.nav-blog a.nav-blog,
#ja-topmega li.nav-interview a.nav-interview,
#ja-topmega li.nav-social a.nav-social,
#ja-topmega li.nav-feeds a.nav-feeds,
#ja-topmega li.nav-facebook a.nav-facebook {
padding: 4px 0 3px;
margin: 3px 5px;
text-indent: -1000em;
width: 28px;
}

#ja-topmega li.nav-blog,
#ja-topmega li.nav-interview,
#ja-topmega li.nav-social,
#ja-topmega li.nav-feeds,
#ja-topmega li.nav-facebook { float: right; border: none; }

#ja-topmega li.nav-social .childcontent-inner,
#ja-topmega li.nav-facebook .childcontent-inner { background: #fff; }


Add this code into template.css

/* Facebook Button */
#ja-topmega li.nav-facebook a.nav-facebook {
background: url(../images/icons/facebook_32.png) no-repeat center #138bb3 !important;
}


You create a JA facebook social – Like Box module which position is mega.
You create menu item which type is External URL, Link is #, Submenu Width is 328, Submenu Content is Modules, Select Modules is JA facebook social – Like Box

---

Attachments:

1. 

2 users say Thank You to khoand for this useful post

1. luisvillamarin
2. dieudonne

[hamlethub Friend hamlethubJoin date: February 2011Posts: 128Downloads:0Uploads:1 Thanks: 15 Thanked: 3 times in 1 posts]

#424020

I am having an issue with this, it just shows up as a block of color – no icon.

1) why would you put the code in two different template.css files? I put all the changes in the “local” template.css file, such as:
/**to put a mail icon in the mega menu **/
#ja-topmega li.nav-mail a.nav-mail {
padding: 4px 0 3px;
margin: 3px 5px;
text-indent: -1000em;
width: 28px;
}
#ja-topmega li.nav-mail {
float: right; border: none;
}
#ja-topmega li.nav-mail a.nav-mail {
background: url(../images/emailButton-style2.png) no-repeat center #f68916 !important;
}

#ja-topmega li:hover a.nav-email,
#ja-topmega li.over a.nav-email,
#ja-topmega li.active a.nav-email {
background: url(../images/emailButton-style2.png) no-repeat center #F68916 !important;
}

#ja-topmega li.nav-email .childcontent-inner { background: #fff; padding-top: 0;}

Is this wrong?

2) I realize the icons are transparent, how do I change this to use an icon that is not transparent.

Thanks!!

[khoand Friend khoandJoin date: February 2011Posts: 4500Downloads:0Uploads:179 Thanks: 169 Thanked: 1166 times in 1060 posts]

#424076

why would you put the code in two different template.css files? I put all the changes in the “local” template.css file. Is this wrong?

You’re right. You can do it. What path of “local” template.css is?

I realize the icons are transparent, how do I change this to use an icon that is not transparent.

Do you give me a link to your website? I will check it.

[hamlethub Friend hamlethubJoin date: February 2011Posts: 128Downloads:0Uploads:1 Thanks: 15 Thanked: 3 times in 1 posts]

#424078

I figured it out – it was the path – I did not change the image path when I copied the code to the local directory

1 user says Thank You to hamlethub for this useful post

1. khoand

[proterra Friend proterraJoin date: July 2010Posts: 149Downloads:2Uploads:17 Thanks: 5 Thanked: 2 times in 1 posts]

#434287

How i get the icon in the menu? and how I get the position on right

[APOSTOLOS FOUKIS Friend APOSTOLOS FOUKISJoin date: December 2008Posts: 170Downloads:137Uploads:36 Thanks: 54 Thanked: 1 times in 1 posts]

#467395

Hi,
How i get the facebook icon (I’ve only twitter image)

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#467595

Hi basdim,

if your template is teline_iv, the facebook icon file is located at templatesja_teline_ivimagesiconsfacebook_32.png please check.

[Author]

Posts