Custom Header Modifications To Executive Pro Theme

—

by

This tutorial includes the work a client hired me for recently.

Here’s what the client wanted:

And here’s how the client wanted the header to look on smaller screens:

The work involved:

Modification of the custom header function
Addition of 2 widgets before the header
Use of search widget and text widget in the before header left widget
Use of the language selector in the right before header widget
Addition of CSS for media queries
Modifications made to default CSS

Register for full access

Comments

3 responses to “Custom Header Modifications To Executive Pro Theme”

Becky Bruso

May 27, 2017

Hi Brad-

How would I simply center it on all screens/devices? I have a natural image size of 768X 160. The Theme shrinks the size down. So I had to enlarge it to ensure that it was croppable to the 768x 160. I have been able to this but not able to center it.

I can provide you with the website link via private email, so that you may see what it look like now.

here is the code i used: (functions.php ) width of 1140 and height of 180 were used to allow the image to be able to not shrunken down from its original size of 768 X 163.

What I added on my own. and doesn’t do anything.

[code]
.header-logo {
padding: 0;
margin: 0 auto !important;
}
[/code]

Please let me know if you have a solution for this.

Thank you.

Becky

Log in to Reply
1. Brad Dalton
  
  May 28, 2017
  
  Link to a live site please so i can inspect the CSS.
  
  Log in to Reply
  1. Becky Bruso
    
    May 29, 2017
    
    Hi Brad- I have sent you the credentials via email. Thank you.
    
    Log in to Reply

Leave a Reply Cancel reply

You must be logged in to post a comment.

Join 5000+ Followers

Get The Latest Free & Premium Tutorials Delivered The Second They’re Published.