How to Change Weebly Header Height
by divtag - Categories: Tutorials > Weebly Tricks
Did you ever think about changing the header height of your Weebly website? If you are using a standard Weebly template, you will notice that there is a horizontal, rectangular header image on the top area of the template or website. This is where you could insert your own custom image to give your website a customized design.
However, you may want to adjust the height of the header image to customize the overall design and “feel” of your website. Everybody has different preferences, right? Some Weebly users want shorter header images, some prefer a taller images.
The next question is, what if you don’t know how to adjust the codes? Although Weebly is awesome at allowing non-technical users in building websites quickly, they didn’t design their templates to allow users to easily adjust the header heights. You’ll have to go into the codes….
Fear not, in this Weebly tutorial video, we’ll show you exactly where to find the codes, and within the codes, what to adjust in order for you to “play around” with your header image heights.
Keep in mind that every single Weebly template is different, so the codes of your template may look slightly different than the one we used for illustration in our video. Nevertheless, the concept is similar, and if you are willing to give it a good go with a “trial and error” approach, I’m fully confident that you will be able to do it.
Want more free tutorials? Sign up here for more… it’s FREE!
Did you Like the Tutorial?
If so, Like us on Facebook, Google+ and Subscribe to our YouTube Channel below!
About divtag
DivTag Templates is created by Connie and Jeremy Wong. We provide you with designer Weebly themes to rock your Weebly website!Your website will Look Better, Your visitors will Stay Longer. Minutes to Setup, Extensive Support - Ninja Coding Skills NOT Required!
I want the header image to change for each single blog post, different from the header image on the main blog page. Or another option would be to not have a header image inside the single blog posts at all.
Love this site…so much easier and informational than that Weebly forum site. lol.
Hope you can help…thanks in advance. ~Tiff.
Tiff – you can use the “no header” page layout for the blog, then you can drag and drop picture elements into each of your blog post so you can control your image dimensions. Give that a try!
– Jeremy
How to change the width of the header? I had to change the width of the page but the header didn’t adjust to the width… you can see the result on my webpage
regards,
Agnieszka
Hi Agniezka,
Changing the width of the header image area or the content area is a tricky modification, as changing the width of one component of the website will affect other parts (such as the footer, menu bar, etc). So you have to look at the entire modification from a perspective of your entire website and not just one part. This is why modifications can be a bit tricky and extensive, and we don’t have a step by step tutorial on how to achieve that. Another complication is that each template is coded differently (especially if you start to compare our premium templates, Weebly’s free stock templates and other people’s custom built templates).
If you really want to modify the template successfully, I would suggest that you learn and practice more coding – there are a lot of free tutorials available online and if you prefer a more structured learning environment, we have a suggestion here – http://divtagtemplates.com/resource/lynda/
thanks a lot :)