Forum Support

Shape 5
April 19, 2021, 03:00:08 PM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News: Shape 5 Forum
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: social media icon problem  (Read 293 times)
gtc6000
Jr. Member
**
Offline Offline

Posts: 45



« on: March 31, 2017, 12:02:20 AM »

I am having trouble adding an Instagram link for reconciliationmin.org.  I have spent many hours trying to use firebug to identify the file location so I could replace the default image but not able to locate it.  The default code I have used for Twitter and Facebook does work for Instagram (see attached).  I have uploaded an alternate, but cannot get it to display.  Please look at the code below.  I have commented out the code that should work and included an screen shot of how it displays (see attached).

Thanks much.

<div class="profile">
<img alt="Margaret Bernhart LMHC" src="http://reconciliationmin.org/wp-content/uploads/meb_blue.png" />
<h4>Margaret Bernhart</h4><h5>LMHC


<h5>Offices in Neptune Beach &#38;

Tallahassee Florida
904-510-2567   &middot;   850-668-3750</h5>



<a class="social_icon ion-social-facebook" target="_blank" href="https://business.facebook.com/MargaretBernhart/"[/url]

<!-- MY ATTEMPTED SOLUTION
<a class="social_icon" target="_blank" href="https://www.instagram.com/margaretbernhart/">[/url]
-->

<!-- USING DEFAULT CODE -->
<a class="social_icon ion-social-instagram" target="_blank" href="https://www.instagram.com/margaretbernhart/">[/url]
<a class="social_icon ion-social-twitter" target="_blank" href="https://twitter.com/margaretRMI">[/url]
</div>
Logged
Tristan Rineer
Global Moderator
*****
Offline Offline

Posts: 3858

Gravatar


« Reply #1 on: March 31, 2017, 02:26:50 PM »

If you use the default option, you can add the following CSS to the bottom of the theme's style.css file in order to get the result you need:

Code:
.social_icon.ion-social-instagram {
background: #fd1d1d;
}

You can, of course, change that background color to whatever you prefer; but that is the official red of Instagram - from the list I found here: https://brandcolors.net/
Logged

Tristan Rineer
------------
Shape 5 Team



- Need a great host for your website? We highly recommend siteground.com!


- Put your trust in the hands of our extremely qualified staff to get your job done right!


- Firebug is the most powerful web development and debugging tool, and it will save you a lot of time, frustration and forum questions:
Install Firebug
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF | SMF © 2013, Simple Machines
Joomla Bridge by JoomlaHacks.com
Valid XHTML 1.0! Valid CSS!
Looking for the largest variety in template designs? Look no more. Never buy 1 theme again. Signups start at just $89 for access to all of our themes.
Send Us An Email
Please send us your questions and we will email you back as soon as we can. Product support questions should be posted in our support forums under the Help menu. Our staff will assist you from there.