Header logo in daily dish

[ladyboomer]

I had a logo designed for my header with the optimum size of 400x80 pixels
for my theme Daily Dish. Thats the size the theme dictates. Unfortunately when i uploaded it-what a shock I got-its way too
small-its a tiny image that sits in the centre of my header. ( pretty useless really)

When i try to upload a larger logo-i can't use it as I'm forced to crop to
the maximum 400x80 size. Can u please advise me as to what to do?

Either to make my logo the correct size to cover the entire header space
(what size is that?) or even move the little logo to the left in the
header space so i can at least add text to fill in the white space.

I contacted support for Design paltte pro and they cannot help me other
than to say I would need to go in and change code in two files- I do not
have the tech knowledge to do this

http://www.moretimemoretravel

[Brad Dalton]

Is your site live?

400 x 80 should work as thats the settings in the PHP and CSS.

---

Tutorials for StudioPress Themes.

[ladyboomer]

Hi Braddalton

Sorry my site isn't live -its a bit of a mess really.

Maybe I didn't explain my dilemma-the 400x80 does indeed work-the problem is that it loads as a very small image smack in the middle of the header. I do not know why that size was chosen as its rather useless.

It wouldn't even be so bad of it was to the left as it says it should be-then maybe i could add some text to fill up the rest of the space. But its a small image centred in the header-so small one can't even read it very well.

There is no way i can go in and change code etc-way beyond me which is why I purchased Design Palette Pro which has been helpful to a non techie like myself up until now.

Im now thinking my options are-ditch the header image i paid to have designed and just use text in the header or chose another theme. I have access to all the studio press themes and maybe there is one that would be better for my lack of skills. Saying that i can see by other peeps questions that header size and alignment seems to be a bit of an issue with other themes as well.

I'm open to suggestions 🙂

[Brad Dalton]

Why can't you remove the code you have added or restore the code you have modified?

---

Tutorials for StudioPress Themes.

[ladyboomer]

To answer your question
I haven't touched any code, modified anything etc-i wouldn't even know where to go to do anything like that.
I am just a person who bought all the studio press stuff and is now trying to use it-without having ANY coding skills.If I knew all that stuff I would not need to use Design Palette Pro.
Please let me know if I am in the correct forum for these types of questions and if not direct to where someone like myself can get answers that don't require those skills.
I have already contacted both Design Palette support and Studiopress and they directed me to this forum 🙂

[DTHkelly]

I have Daily Dish Pro and the header logo size works.

Based on your description, you should submit a help ticket to CopyBlogger. They can help troubleshoot.

[smalmin]

I am having this exact same problem with the lifestyle pro theme. Uploading my header of exactly the size specified but shows up as a small image in the center of the header area. Were you able to find a solution?

[ladyboomer]

Hi Smalmin
Unfortunately neither Design Palette Pro nor Copyblogger could help me other than to suggest I change code in two filed- something that I cannot do as I wouldn't even know where to begin. I know nothing about coding which is why I was using Design Palette to customise my theme.
What I cannot understand is why on earth would the theme designers make the size constraints for the image for the header so small? I mean what can anyone do with that?? It's utterly useless- so it looks like I have to
1. Find out what size my header space is
2. Pay someone to resize the image for the header
3. Pay someone to change the code so that the correct size image will work.
Or just forget all that and just use txt in the header.
I'm not happy to say the least- let me know if someone reaches out to u with a better solution. I'm ever hopeful

[ladyboomer]

Hi Kellylise

Do you mean you have a logo (header image) that is 400x80 pixels and it covers the entire header area?
That is what I want.!!!

But my 400x80 shows as this small little image right in the centre of the header? It looks like it should be a way bigger image?

I would love to get this right and keep this theme-unfortunately when i contacted Design Palette Pro (which is what i am using) this is what they said.

"Design Palette Pro settings are to style the text Site Title, as the Header upload functionality is handled by the themes code. You will notice when a logo image is upload the option for the text Site Title in Design Palette Pro are disabled.

To change the dimensions of the logo you will need to edit the code in the functions.php file, as well as the style.css file."

I then contacted Copyblooger and this is what they said when I told them what Design Palette said.

"Yes ,the advice you received is correct. To change the header image size, you will need to edit code.

If you are not comfortable with editing code, you may have to hire someone to do it for you."

Far from helpful to be honest.

Let me know what u think-and thanks for responding 🙂

[DTHkelly]

#144396
#2 - There are free websites where you can change image size.
http://www.online-image-editor.com/
https://pixlr.com/
https://www.canva.com/

Based on your comment above, I have a better understanding of what you're looking to do.
#144397 The answer is No. 400?—80 will not cover the entire header. For Daily Dish, I'm using an image that is 1080 px width x 332 px height You can choose any height.

If you want your header image to cover the entire area, you can add an 1080 x ? image with code (php) in a function for custom header. I also had to change CSS to eliminate Daily Dish Header Padding.

This is not the tutorial I used, but it may work:
http://blackhillswebworks.com/2013/05/10/how-to-replace-the-studiopress-background-header-image-with-a-real-image-logo/

This free plugin is not the answer, but if you used the Text (instead of 480 width logo), you could put your custom image under navigation

Genesis Custom Headers

[selindalovett]

I am having the same problem. According to the setup instructions for Daily Dish Pro if you use a custom header image, then the image is supposed to display in the upper left corner of the site. http://my.studiopress.com/setup/daily-dish-pro-theme/genesis-theme-settings/custom-header-image/ However, mine doesn't do that. It's in the center and way too small. I created a larger image and changed the css to accommodate it but when I select the larger image as the header image, it forces me to crop it to their recommended size.

Kellylise, how did you get around the forced cropping when you selected your larger image to be your customer header image?

[DTHkelly]

I used this tutorial:

How to add a responsive wide header in Genesis

I also had to change CSS to eliminate Daily Dish Header Padding.

[ladyboomer]

Umm -tried to look at the tutorial and unfortunately its member only access

So Im no further ahead with this.

It appears to be a big pain in the ass for non tech peeps as the tiny image in the centre of the header is utterly useless ( appears Im not the only one getting that result) and to change it would require more expertise ( change css) than i have-even after purchasing design palette.
Im not impressed to say the least.

BTW-does anyone know the max dimensions of the header space in daily dish -or any suggestions as to a theme with an "easier to manage for a non tech" header?

Cheers
Eileen

[Brad Dalton]

I tested this and it works perfectly.

Not sure what your problem is but based on a logo which is 400px width by 80px height it centres perfectly in the header as you can see in this tutorial i wrote for members of WP Sites ( no free access ).

I spent a couple of hours working on this and also detailed how to change the code for custom image sizes including a full width header image.

---

Tutorials for StudioPress Themes.

[ladyboomer]

Hi

Sorry if I did not make myself clear- cos the theme says the logo needs to be 400x80- that's what I had designed. And like you say- it centres in the header ( although it says it should display in the upper left hand corner?)
What I didn't expect was that it was so tiny- so it's this tiny little logo stuck in the middle of the header. Doesn't look great- but as a previous poster also discovered- no point in trying to add a larger header image cos the theme forces you to crop it to the max 400x80 size

[Brad Dalton]

I tested a full width header and it works perfectly without any cropping.

The size i tested is 1200px X 200px.

---

Tutorials for StudioPress Themes.

[selindalovett]

@ladyboomer I finally got mine to work with a larger image. I did have to modify the code for it to work, but it was easy. I think you can do it too. Just to be on the safe side, copy and paste, and save your code to Notepad before making any changes. You'll need to do this for both the php file as well as the css file because you'll be making changes to both files.

Go into php theme functions. You can find it under Appearance. Then click on Editor. On the right hand side of your screen where it says Templates, click on Theme Functions (functions.php). Look for this code (type Control F to pull up a search bar and search for .site-title):

//* Add support for custom header
add_theme_support( 'custom-header', array(
	'header-selector' => '.site-title a',
	'header-text'     => false,
	'height'          => 80,
	'width'           => 400,
) );

Change the height and width values to match your custom image/logo size. Scroll down and click on the Update button to save your changes.

To modify your CSS, click on the Stylesheet (style.css), again on the right hand side of your screen under Templates. Look for this code (Again using Control F, type .site-title into the search bar. You will have to keep searching until you reach this code):

.header-image .site-title > a {
	background-position: center !important;
	background-size: contain !important;
	display: block;
	height: 80px;
	margin: 0 auto;
	max-width: 400px;
}

And change the height and width values to match the size of your image/logo. Scroll down and click on Update File to save your changes.

You will need to upload the larger image and then make it your header image just as you did before, but this time it will not force you to crop it to the smaller size. The cropping dimensions will match the dimensions that you specified in the .php file.

Please note that if you use the smaller logo that you had designed, it may look pixelated on your site because the smaller image was resized.

This worked for me. I hope it helps. Let me know if you have any questions.

[ladyboomer]

Hi Selindalovett

Finally got around to giving your instructions a try.

Absolutely fantastic-works like a charm. Your instructions were SO clear-idiotproof ha ha.

I will have to redo the logo cos as you pointed out-cos its small, blowing it up pixilates it. But thats not a huge problem-the fact that i can change the size of the header like that is gold.

Thank you soooo much for your help. I really appreciate it.

Cheers

[ladyboomer]

Check out the thread-i got a solution which could probably help you.
Cheers

[selindalovett]

You're welcome. I'm glad it helped. 🙂

[Author]

Posts