Adjusting header size to fit a new size logo

Matthew
asked 11 years ago

Is there anyway I could get a code re-write for the header that incorporates a new size logo of 500X90

1 Answers

DominicStaff
answered 11 years ago

To change the logo size to 500 x 90px, please follow my instruction:

Step 1: Log in to Dashboard > Appearance > Widgets

Delete all the Text widgets of Header in the sidebar. This is because the logo size is too big to have space for other widgets on Header.

See screenshot: http://i.imgur.com/dkhHHv3.png

Step 2: Go to Dashboard > Appearance > Themes> Select Customizer

See screenshot: http://i.imgur.com/hO7gYx9.png

Step 3: Choose General Settings, then paste the following code lines into “DW Focus header script”

see screenshot:http://i.imgur.com/K30Tjz5.png



<style>
.site-header #header {
background: none;
}

#branding {
width: 500px !important;
}

.site-header #branding a {
width: 500px;
height: 90px;
}

</style>

Step 4: Select Title & Tagline, upload a logo image with the size of 450x90px

And you will have a new webpage with the logo as requested.

See screenshot: http://i.imgur.com/yQRmczj.png

Hope this helps!
Regards,
Dominic