1

[VinceG]

VinceG

#8152

Thank you for a great theme.

Please could someone tell me how I could add our telephone number to the site like this image here?

I have photoshopped the phone number onto a screenshot of my site to show you what I want and how I want it to look.

[VinceG]

VinceG

#40537

Sorry, I made the image too big for it to show what I am looking for. Here’s a smaller image to show the phone number.

[Anonymous]

Anonymous

#40538

You can do this many ways. I will say 2 that come to mind

1.) Create the phone number with whatever special effects/ text in photoshop and save it as a png. or jpeg image. then upload it to your wordpress. – create a custom .div class in your child theme and then put the image inside a text box in your widgets with the div class and drag it under an action hook and place it into your prefered postion using firebug as a refrence …with postion absolute.

2.) Do the same thing as above but instead of using an image you can just do normal text and change the font style and color etc. through your CSS in your child theme by changing the styles in the custom div class that surround your text again use firebug as a refrence.

Hope that helps

[Kenneth John Odle]

Kenneth John Odle

#40539

You can use a Graphene action hook widget area, as well.

[VinceG]

VinceG

#40540

Thanks for your replies guys, but that’s gone right over my head. I understand a bit of CSS and HTML, and a little php but am new to wordpress and it’s workings. Is this what you mean about about creating a custom .div class

Is that like putting the following into my css

.telephone_number

Then call it somewhere in the php file of the header.php?

I also don’t know what you mean by Dragging it under an action hook…

Please could you explain it like I’m a 50 year old fogey… you’d be right.

[Kenneth John Odle]

Kenneth John Odle

#40541

Quote:

Then call it somewhere in the php file of the header.php?

Do not edit theme files. This is bad practice, for a number of reasons.

Here is a tutorial of Graphene action hook widget areas. If you understand widgets, it’s fairly simple, actually:

http://blog.kjodle.net/2011/11/04/graphene-action-hook-widgets-an-easy-way-to-modify-your-blog/

[Anonymous]

Anonymous

#40542

Have you created a child theme ? If not then I would make that a priority to do this before doing anything else with your website

[VinceG]

VinceG

#40543

Thanks Kenneth, that link doesn’t work.

Ian, thanks for your info, I’ll look into making a child theme.

[VinceG]

VinceG

#40544

Thanks again for your replies guys.

I have made a child theme and I am now trying to put the telephone number in the header where I want it.

I have added this to my childs css file

Code:

.vg-telephone {padding:10px;text-align:right;
color:#ffffff;
font-size:24;
font-weight:bold;
}

And I have added the following to the childs header.php

Code:

<div id=”vg-telephone”>
Telephone 0800 000000
</div>

However, I still get the same dark grey text which is small, and it’s in the wrong place. I try moving it everywhere within the header file but to no avail. It seems that it’s not taking any notice of the CSS, see here this screen shot.

[Kenneth John Odle]

Kenneth John Odle

#40545

That’s because you are using .vg-telephone in your CSS. A dot designates a CSS class, but you are referencing an ID in your header.

Use #vg-telephone in your CSS, instead.

The link works. It really is better to use an action hook widget area, because using header.php in you child theme could have issues when you update the theme. If at all possible, you really want to use theme features before you use a child theme.