Return to previous page

Help Customizing Header and Logo - by mcshane

This topic has 8 replies, 3 voices, and was last updated 10 years, 4 months ago ago by Jack Richardson

mcshane

Participant

July 15, 2014 at 21:44

Hello.

I need help customizing the header. The site I am working on for my client is under development. Please see login info below.

I need to:
Make the area for the logo bigger (about 560px wide, possibly larger)
Keep the responsiveness, so the logo is reduced to fit the mobile, tablets, etc
Move the search box to the right, under the Cart info/links
Move the tagline text under the logo
Keep logo and tagline aligned left

Would you please let me know where these changes need to go. I am comfortable with CSS, just not php. If you make them for me, would you please let me know where in case I need to revert or edit them?

Thank you!
Maria M.

Please, contact administrator
for this information.

#9907 Copied

7 Answers
Eva Kemp

Support staff

July 16, 2014 at 09:27
Hello,

We recommend you to make all changes in a child theme.
Add the following code into style.css of the child theme:
```
.logo { width: 600px; }
#search {float: right;}
#search #site-description {display: none;}
```
To add tagline text you need edit header.php (copy it from the theme directory to your child theme folder). Add this code <div id="site-description"><?php bloginfo( 'description' ); ?></div> after the line 73 <a href="<?php echo home_url(); ?>"><img src="<?php echo $logoimg ?>" alt="<?php bloginfo( 'description' ); ?>" /></a>

Regards,
Eva Kemp.
#9960 Copied
mcshane

Participant

July 16, 2014 at 18:20

Eva,

Excellent! This worked perfectly.

Thanks so much!
Maria

#10019 Copied

Jack Richardson

Support staff

July 16, 2014 at 18:24

Hello,

You’re welcome!
If you have any questions feel free to contact us.

Regards,
Jack Richardson

#10020 Copied

mcshane

Participant

July 16, 2014 at 18:30

Ok, I spoke too soon 🙁

This solution has ruined the responsiveness of the logo in smaller devices. Can you help me so the large logo only shows in the desktop, and the mobile/tablets reduce the logo as intended being a responsive theme?

Thanks!
Maria M.

#10021 Copied

Jack Richardson

Support staff

July 16, 2014 at 18:49

Hello,

I’ve fixed the issue. Please check your site now!

Regards,
Jack Richadrson

#10024 Copied

mcshane

Participant

July 16, 2014 at 18:56

Yes, it’s fixed, hooray!
Thank you!
Maria

#10025 Copied

Jack Richardson

Support staff

July 16, 2014 at 19:09

Hello,

You’re welcome!

Regards,
Jack Richadrson

#10026 Copied
Tagged: customizing, header, help, logo, template, woocommerce, wordpress
Viewing 8 results - 1 through 8 (of 8 total)