Align header image left

Ok, I took another look & followed the recommended image size for my logo and the logo in itself is fine. I would like to know how I can get the header text to align right and create a text email address link as line 2

The url I’m working on incidentally is: www.https://tptspersonaltraining.co.uk/

Hi Ray

If you don’t already have a custom.css you should install a plugin like custom CSS plugin then add the following code to it.

.site-title-group {
width: 500px;
float: right;
}

Hey, thanks for that. It worked a treat! One more thing, I need to change the header text, and would like to include an active email hyperlink. Where do I make those changes? Thanks again man

These look like the site title and tagline. Go to

Settings >> General

or

Appearances >> Customize >>

Great help and thanks again. I found the tagline / title thing, but does anyone know how to insert an email link in the header?

Hi Ray

You need to add the text like this

<a href="mailto:tptspersonaltraining.co.uk?Subject=Hello%20again" target="_top">
tptspersonaltraining.co.uk</a>

Then create a child_theme and copy over the header.php

Open child theme header.php and find

bloginfo('description')

and change it to to

echo html_entity_decode(get_bloginfo('description'))

Hope that helps

Hey, thanks again. Still finding WordPress a fairly steep learning curve. Your help is so much appreciated. Thanks again

You’re welcome

Worked a treat. Thank you thank you thank you! I’d have never figured that out alone

don’t forget to mark the topic as resolved

Hi again. I have another issue with this I’m afraid. I fixed the logo position by making it full width (1020px). However, this looks bad on a mobile. How can I make the logo 475px and have it float left, while keeping the header text to the right. Can I set a margin? if so, what do I change?
Again, thanks in advance

By the way, when I put the smaller logo in the header, it automatically centers. I want it to be left aligned if possible

you could just use the full image and use the below code

.site-header .site-branding {
background-size: 100%;
background-position: 0 0;
}

Anyway for the small image try:

.site-header .site-branding {
background-position: 0 0;
}

Hey Sal, thanks again, but the header doesn’t want to play nice I’m afraid. I tried both of your suggestions, at the moment I’m going with the full width image. Looks fine on the pc, but on my mobile, the header text just appears over the logo. If I use the smaller image, the logo simply centers itself on the page:-(