Joomla Templates Club 406,261 posts

[angsto Friend angstoJoin date: June 2015Posts: 29Downloads:12Uploads:5 Thanks: 3]

#832042

Hi All,
I have problem with icons on social links module in localhost with quickstart and also on http://ja-fixel.demo.joomlart.com/index.php/en/.
Can someone told me why? See attachment…

---

Attachments:

1. 

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#832726

Hi
could u Provide us the problem u getting in this module . Because the screenshot and demo site have same social icons .

[angsto Friend angstoJoin date: June 2015Posts: 29Downloads:12Uploads:5 Thanks: 3]

#832915

I don’t know, why I see like second attachment.

---

Attachments:

1. 
2. 

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#832920

Hi
In this case i suggest you to make site live and share details here so i can assist you better .

[angsto Friend angstoJoin date: June 2015Posts: 29Downloads:12Uploads:5 Thanks: 3]

#832923

http://www.fk-fashion.com

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#832996

Hi
We used Addthis share buttons , As u know Addthis changes their platoform a lot that result the change in the button design . These are the default buttons at this time .You can choose the button from the Addthis site or use below code in custom.css

.addthis_toolbox.addthis_32x32_style span {
    width: 60px!important;
    height: 55px!important;
}
.addthis_32x32_style .at-icon {
    width: 60px!important;
    height: 55px!important;
}

Change the height to adjust them as per needs .

[angsto Friend angstoJoin date: June 2015Posts: 29Downloads:12Uploads:5 Thanks: 3]

#833797

Can you tel me why this part not work?

.social-link .addthis_toolbox > a > span.at4-icon {
  background-color: transparent !important;
  background-image: url("../images/ico-social.png") !important;
  background-size: inherit !important;
  height: 60px !important;
  line-height: 60px !important;
  width: 60px !important;
}
.social-link .addthis_toolbox > a > span.at4-icon.aticon-facebook {
  background-position: 0 0 !important;
}
.social-link .addthis_toolbox > a > span.at4-icon.aticon-facebook:hover {
  background-position: -60px 0px !important;
}
.social-link .addthis_toolbox > a > span.at4-icon.aticon-twitter {
  background-position: 0 -60px !important;
}
.social-link .addthis_toolbox > a > span.at4-icon.aticon-twitter:hover {
  background-position: -60px -60px !important;
}
.social-link .addthis_toolbox > a > span.at4-icon.aticon-youtube {
  background-position: 0 -180px !important;
}
.social-link .addthis_toolbox > a > span.at4-icon.aticon-youtube:hover {
  background-position: -60px -180px !important;
}
.social-link .addthis_toolbox > a > span.at4-icon.aticon-instagram {
  background-position: 0 -120px !important;
}
.social-link .addthis_toolbox > a > span.at4-icon.aticon-instagram:hover {
  background-position: -60px -120px !important;
}
.light-mainnav .social-link .addthis_toolbox > a > span.at4-icon {
  background-image: url("../images/ico-social-light.png") !important;
}
.light-mainnav .social-link .addthis_toolbox > a > span.at4-icon:hover {
  background-color: #cdcdcd !important;
}

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#833807

Hi
the code may not working as the classes present in the code does not match with the code running on site or the bg image does not exist on your site, due to Addthis changes in their classes .
I spent a lot of time to fix issue . use this code in custom.css

.addthis_toolbox.addthis_32x32_style span {
height: 60px!important;
width: 60px!important;
}

.addthis_32x32_style .at-icon {
padding: 15px;
background-color: transparent !important;
background-image: url("../images/ico-social.png") !important;
background-size: inherit !important;
line-height: 60px !important;
}

Now they will use the bg image and its size again.
Note : Above suggestion is based on demo site > http://prntscr.com/9jr0e3

[angsto Friend angstoJoin date: June 2015Posts: 29Downloads:12Uploads:5 Thanks: 3]

#835473

I just want to have Front-end Appearance like original quickstart. You can see:
https://www.joomlart.com/documentation/joomla-templates/ja-fixel#custom-html
and #7. Social Link…
Why this not work?

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#835549

Hi
I created bu report to development it , It will be fixed in next update of template. Meanwhile u can try the fix provided by me .
You can track it here
Stay Tuned .

[Author]

Posts