Ahmed Kamara
asked 11 years ago

I want to use a logo size 450 px x 70 px. Please kindly assist. Thanks

3 Answers
Jackie Lord
answered 11 years ago

Hi Ahmed,

Please find my answers below:

In order to change the logo size to 450x70px, 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 type="text/css">
.site-header #header {
background: none;
}
#branding {
width: 450px !important;
}
.site-header #branding a {
width: 450px;
height: 70px;
}
</style>

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

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

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

Hope this helps!
Regards,
Jackie

Ahmed Kamara
answered 11 years ago

Jackie thanks for this, but i was hoping that after making these changes i will be able to put a Google ad on the right of the Logo. But it didn’t work. How can i make this possible? I wanted to put a 480×60 Google ad there. Thanks

Jackie Lord
answered 11 years ago

Hi Ahmed Kamara,
To Put back a Google Ad to the right of the Logo, please do follow instruction below:
Step 1: Log in to Dashboard > Appearance > Widgets
Step 2: Drag a Text widget to Header sidebar, then add Google Adsense code to the content of this Widget. See example: http://i.imgur.com/WJQeTvs.png
Step 3: Go to Dashboard > Appearance > Themes, Click to Customize. Then change the codes in “DW Focus header script” with:

<style type="text/css">
.site-header #header {
background: none;
}
#branding {
width: 450px !important;
}
.site-header #branding a {
width: 450px;
height: 70px;
}
#sidebar-header {
width: 480px;
float: right;
}
#sidebar-header .widget {
width: 480px;
}
</style>

Hope this helps!
Regards,
Jackie

Powered by DW Question & Answer Pro