Inserting a logo into Hatch theme
-
I’m using the Hatch theme and have the option to upload a logo for the landing page using the ‘customize theme’ option in ‘appearance’. The logo seems to automatically re-size itself and is coming out really small. Is there any way of adjusting the size of the logo image so that the text that is incorporated into it can be read ? I’ve tried re-sizing the logo itself but no matter what I do its still appearing way too small. In addition, if I insert an image into the header, is there any way of re-positioning it so that it lines up with other items on the page ?
The blog I need help with is: (visible only to logged in users)
-
Does this help?
Custom Header
Hatch supports a flexible-height custom header image, which can be configured under Appearance -> Header.
https://en.support.wordpress.com/themes/custom-header-image/The header image displays only on the home page, and its size depends on the presence of a welcome message in the theme options. If a welcome message is active, it will take up 66% of the content column, otherwise it will take up the full width of the content column.http://theme.wordpress.com/themes/hatch/
-
thank you for the information about the custom header, my issue is not about its size but about whether or not it can be moved or re-positioned within the space provided for the header. My main concern however is with the logo which is different to the custom header, is the logo resizeable ?
-
I’ll tag this thread for a Themes Staff follow-up. Please subscribe to the thread so you are notified when they respond and please be patient while waiting.
-
-
I uploaded a 500 x 500 px image as a logo on my test site using the Hatch theme so I could try to see how big I could get the logo to appear. I found that the logo is constrainged to a width of 35% that is set on the HTML element that contains the logo, and that translated to about 115px wide on my test blog. There are not any built in options to make the logo larger than that on large screens, but a theme customization like that is something you could adjust yourself using custom CSS if you wanted to purchase the Custom Design upgrade.
In your case, I see that you have uploaded a yellow heart shaped image that is 60 x 60 pixels. If you have a larger version of that file, then you could upload it to the Appearance > Customize > Theme Options > Logo area and it would appear a little bit bigger.
If you wanted to go larger than 115px wide, then it would be good to first upload the larger logo file to your media library and reply back here and mention how large you were looking to make the logo and also include a link to the file.
-
Hi – thanks for getting back to me – actually the heart logo is just a temporary thing I put up there until my issue is resolved. The logo that I would ideally like to use has text in it and at the max px width the text can’t be read. I am fairly new to all this so please forgive me if I’m not completely understanding you – but your suggestion of uploading a larger logo file to my library and then replying back here – does this mean that it could be enlarged so that the text element of it can be legible ? it would definitely need to be wider than 115px. I will reinstate the original logo that I would ideally like to use so that you can see what I mean.
-
does this mean that it could be enlarged so that the text element of it can be legible ?
I think so. If you don’t want to try uploading the larger image to the logo area again, could you provide a link to the image in a reply here so I can take a look?
-
have just uploaded the logo to the blog again so you should be able to see what I mean – many thanks
-
Thanks for uploading it, it’s much easier to see the problem that way.
In my test earlier, the image was square. I think the 1:1 aspect ratio must have made a difference because my image appeared larger than yours looks.
The logo is working as it was designed in the theme. It’s possible to modify how a theme works, however, it does require that you purchase the paid upgrade called Custom Design:
https://store.wordpress.com/premium-upgrades/custom-design/If that sounds like something that interests you, you can also try it out any time before purchasing by going to Appearance > Customize > Custom Design and clicking the “Try Now” button. Then go to CSS and add this to the CSS editor:
#masthead .logo { width: 100%; } -
ok, thank you – the only thing is my plan is to upgrade to the business version that allows for e-commerce but not until my new business is up and running. I understand that the business version includes custom design, so may not be worth upgrading right now – will give it some thought. Many thanks for all your help.
-
- The topic ‘Inserting a logo into Hatch theme’ is closed to new replies.