Jump to content


Photo

Adding Phone and Address under Facebook Icon


This topic has been archived. This means that you cannot reply to this topic.
7 replies to this topic

#1 bikeshopge

bikeshopge

    Advanced Member

  • Members
  • PipPipPip
  • 31 posts

Posted 10 November 2010 - 09:59 PM

i am looking to add a phone icon, phone number and one line below that add the address right above the navigational bar.

#2 arpowers

arpowers

    Founder

  • Administrators
  • 3252 posts

Posted 11 November 2010 - 02:13 AM

what's your question? Are you using the child theme?

#3 bikeshopge

bikeshopge

    Advanced Member

  • Members
  • PipPipPip
  • 31 posts

Posted 11 November 2010 - 02:38 AM

YES Please...

#4 bryan-hadaway

bryan-hadaway

    Advocate

  • Members
  • PipPipPipPipPip
  • 3697 posts

Posted 11 November 2010 - 04:51 AM

Hi Rich, let's get a link and then I can write a solution for your site. Thanks, Bryan

#5 bikeshopge

bikeshopge

    Advanced Member

  • Members
  • PipPipPip
  • 31 posts

Posted 11 November 2010 - 01:26 PM

http://thebikeshopge.com/thbsge/ Thanks

#6 nett-ed

nett-ed

    Advanced Member

  • Members
  • PipPipPip
  • 53 posts

Posted 11 November 2010 - 07:25 PM

Placing the following code at the bottom of your current themes functions.php file can help you get started:
 
		add_action('pagelines_after_branding_wrap', 'custom_telephone_icon');
	
		function custom_telephone_icon() {
			?>
			<div id="contact-telephone"><p>(123) 456-7890[b][BR][/b]Your address goes here too</p></div>
	<?php }

Note above the [BR] should actually be the html break line tag "< b r / >" without any of the spaces or quotes but the forum doesn't allow that tag so I had to improvise


Change the phone number and address placeholders to your actual information and that should get you closer to what you need.

Now we just need that telephone icon.... I'd suggest uploading the file to the images folder on your theme and just use the custom css section of the PlatformPro Settings area to add the icon to the new telphone-contact div we just created.

The following could be a starting point for the custom css but it would depend on the size of your icon to get it aligned just right:
 
	#contact-telephone {
	background:url("../images/your-icon-file-name.png") no-repeat scroll 0 12px transparent;
	}


#7 bikeshopge

bikeshopge

    Advanced Member

  • Members
  • PipPipPip
  • 31 posts

Posted 12 November 2010 - 02:30 PM

Okay - everything is working but not able to get the icon to show up at all. Hopefully it is no a typo... /* ============================================== Adding to The BikeShpGlenEllyn Header - Phone Icon. ============================================== */ #contact-telephone { background:url("../thbsge/wp-content/uploads/2010/11/phoneicon.png") no-repeat scroll 0 12px transparent; } Here is my page - http://thebikeshopge.com/thbsge/ Please let me know what I might have done wrong. Thanks

#8 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts

Posted 12 November 2010 - 07:11 PM

You are fine, just the image path isn't correct. It should be "../../../../thbsge/wp-content/uploads/2010/11/phoneicon.png"