Return to previous page

Change Social Icons - by Quallenaquarium

This topic has 30 replies, 7 voices, and was last updated 9 years, 4 months ago ago by Eva Kemp

Quallenaquarium

Participant

August 7, 2015 at 02:14

Hi Guys,

how can i change the icon images and the links of the social icon section [share] ?

I need to add an instgram icon for example. And of course i need my custom links to the facebook page etc. I found no possibility to change that in the theme options.

Thanks for your help

#78927 Copied

29 Answers

Robert Hall

Support staff

August 7, 2015 at 07:31

Hello,

You need edit code in \themes\woopress\framework\shortcodes.php file on line 1729-1796.

Regards,
Robert Hall.

#78934 Copied

Benny

Participant

August 9, 2015 at 19:17

Hi,

thank you for your response.

But i need further informations please. The theme is great and easy to edit, but the social icon section is the only thing which is very hard to customize for me.

I would like to have a Youtube Icon with a custom link. Could you please provide the line of code for that?

Thanks a lot

#79131 Copied
Eva Kemp

Support staff

August 10, 2015 at 08:34
Hello @Benny,

Try to add this code in shortcodes.php file in section ” ! Share This Product”:
```
if($youtube == 1) {
$html .= '
<li>
<a href="http://your_youtube_link" class="'.$tooltip_class.'" title="'.__('YouTube', ET_DOMAIN).'" target="_blank">
<i class="ico-youtube"></i>
<svg width="38" height="38" xmlns="http://www.w3.org/2000/svg" class="circle">
<circle cx="19" cy="19" r="18" fill="rgba(255,255,255,0)" stroke="#000000"></circle>
</svg>
</a>
</li>
';
}
```
Regards,
Eva Kemp.
#79155 Copied
Benny

Participant

August 13, 2015 at 22:04

Hello Eva,

thank you for your help.

The problem seems to be that there is no youtube icon on which i can refer.

The icon appears just as an empty whire circle. How can i put a youtube icon in this line:
<i class=”ico-youtube”></i>

Thanks a lot

#79980 Copied

Jack Richardson

Support staff

August 14, 2015 at 07:57

Hello @Benny,

Please provide us with WP Dashboard and FTP credentials in private content.

Best regards,
Jack Richardson.

#80027 Copied

Benny

Participant

August 14, 2015 at 16:46

Hi Jack,

thanks for your response.

I sent you the login details as private content.

Thank you

Please, contact administrator
for this information.

#80130 Copied

kaha

Participant

August 15, 2015 at 01:32

Hi,
I just tried to update the shortcode.php file as suggested above to add the facebook link i wanted to use. And the whole site went white….
I usually just copy the original code when i do any changes in the editor and past back what was there before if it doesn’t work… not sure why the whole site would go white. don’t get the login page nothing…
Any suggestions?

Thanks,

Please, contact administrator
for this information.

#80206 Copied

Stan Russell

Participant

August 15, 2015 at 08:49

Hello kaha,

please provide us with FTP credentials for your site in private content.

Regards,
Stan Russell.

#80227 Copied
Jack Richardson

Support staff

August 17, 2015 at 12:33
Hello @Benny,

Sorry for a delay.
I’ve added this code in Theme Options > Custom CSS > Global Custom CSS:
```
.menu-social-icons .ico-youtube:before {
  content: "\f167";
  font-family: FontAwesome;
}
.menu-social-icons .ico-youtube {
    display: block;
    width: 28px;
    height: 28px;
}
```
Please check youtube icon now.

Best regards,
Jack Richardson.
#80382 Copied
kaha

Participant

August 17, 2015 at 19:15

Here you go! Thank you for helping! I tried to updated the shortcodes.php by removing the 1 and adding my facebook link and then it went white. hopefully that file is all that needs to be corrected.

Thanks a million!!

Please, contact administrator
for this information.

#80502 Copied

Eva Kemp

Support staff

August 17, 2015 at 19:41

Hello @kaha,

Please give us a link you want to insert for Facebook social media icon.

Regards,
Eva Kemp.

#80509 Copied

kaha

Participant

August 17, 2015 at 19:56

https://www.facebook.com/JaniceSchererArt

#80515 Copied

Eva Kemp

Support staff

August 17, 2015 at 20:16

Hello @kaha,

I’ve edited the file shortcodes.php in line 1963 and replaced the link http://www.facebook.com/sharer.php?u='.$permalink.'&images='.$image.' with the one you provided. Please check social icon now.

Regards,
Eva Kemp.

#80522 Copied

kaha

Participant

August 17, 2015 at 22:37

Eva, you don’t know how thankful I am that you were able to fix the shortcode.php, i figured it wouldn’t be too tricky but still, a white page was slightly scary 😉
Facebook link is perfect. If I want to add more links, do I need to ask you to do it?

Thanks a million!!

#80540 Copied

Eva Kemp

Support staff

August 18, 2015 at 08:17

Hello @kaha,

You’re welcome.
You can ask us to change links or you can do this yourself.
For example to change link for Twitter you need edit the code <a href="https://twitter.com/share?url='.$permalink.'&text='.$post_title.'" class="'.$tooltip_class.'" title="'.__('Twitter', ETHEME_DOMAIN).'" target="_blank"> and replace https://twitter.com/share?url='.$permalink.'&text='.$post_title.' with a link to your Twitter account.

Regards,
Eva Kemp.

#80593 Copied

kaha

Participant

August 18, 2015 at 15:05

Ok great, I’ll probably just ask you then so I don’t mess it up again 🙂
Thanks!!

#80744 Copied

Eva Kemp

Support staff

August 18, 2015 at 15:08

Hello,

You’re welcome.

Regards,
Eva Kemp.

#80747 Copied

Benny

Participant

August 18, 2015 at 16:34

Hello Jack,

thank you very much for your help. The Youtube Icon is working now. Thats great 🙂

I have one more problem unsolved, even if its not related to this topic:

In Theme options > Typography I changed every color to black, so the main font, body font, menu font and page headings are in black (#222222)

The problem now is, that on a mobile device, the menu has a black background and the font is also black, so you cant see the menu on a mobile device. When i change the main font to white now, you can see the menu on a mobile, but you cant see the text in the shops “add to cart” button.

How can i solve this? I think the best way would be to change the mobile menu background to white, but i have no idea how.

Please help, thanks

#80782 Copied
Eva Kemp

Support staff

August 18, 2015 at 16:48
Hello @Benny,

To change background color for mobile menu use this code in custom css:
```
.st-menu, .mobile-nav-heading.close-mobile-nav {
  background-color: white !important;
}
```
Regards,
Eva Kemp.
#80791 Copied
Benny

Participant

August 18, 2015 at 16:54

Thanks a lot Eva,

this is a really great support. It worked 🙂

#80795 Copied

Eva Kemp

Support staff

August 18, 2015 at 17:10

Hello @Benny,

You’re always welcome.

Regards,
Eva Kemp.

#80803 Copied

Benny

Participant

August 21, 2015 at 16:04

Hello Eva,

unfortunately i thought too soon that all problems are solved now.

The mobile menu is fine now through your code, but now i´ve got the problem that the buttons on the single product view are black in black now as you can see here for example (http://quallenaquarium.net/shop/osmoseanlage-aquatic-nature/)

The problem is that every change in colors that i do causes other problems, so this maybe is caused because of the line of code you gave me.

How can i change the button background color to white without changing anything else?

Thanks in advance

#81618 Copied
Eva Kemp

Support staff

August 21, 2015 at 16:29
Hello @Benny,

Please add this code in custom.css:
```
.product-information .cart button[type="submit"] {
   color: white;
}
```
Regards,
Eva Kemp.
#81624 Copied
Benny

Participant

August 21, 2015 at 16:36

Great, problem solved.

Thank you!

#81628 Copied

Jack Richardson

Support staff

August 21, 2015 at 16:58

Hello @Benny,

You’re welcome.

Best regards,
Jack Richardson.

#81635 Copied

Benny

Participant

August 25, 2015 at 12:31

Hello Guys,

unfortunately i discovered some additional problems.

Also the “Continue Shopping” Button (Button after you put a product to cart, named “Weiter einkaufen” )and the Continue Button on the cart page (http://quallenaquarium.net/warenkorb/) are black in black as well.

Your post before fixed a similar problem. Please provide the code for the two buttons i need to change.

Thank you

#82158 Copied
Eva Kemp

Support staff

August 25, 2015 at 12:37
Hello @Benny,

Please use this css code:
```
.emodal .emodal-text .btn, .cart-collaterals .checkout-button {
    color: white !important;
}
```
Regards,
Eva Kemp.
#82161 Copied
Benny

Participant

August 25, 2015 at 12:49

Unbelievable how fast and great your support works.

Thanks a million times

#82167 Copied

Eva Kemp

Support staff

August 25, 2015 at 13:08

Hello @Benny,

You’re welcome.

Regards,
Eva Kemp.

#82176 Copied
Viewing 30 results - 1 through 30 (of 30 total)