Themeisle Docs

Appearance

hestia

Make your site feel premium – unlock more controls, more style, and a smoother building experience with priority support.

See Pro Plans →

How to Increase Theme Logo Size ​

This document will help you change the logo size for:

NOTE: Unless you are using a child theme, all the CSS code snippets from this guide need to be added to Appearance -> Customize -> Additional CSS.

NOTE: If you plan on doing a lot of changes on the theme, then we encourage you to create a child theme and add the following snippets inside the style.css file of your child theme.

These docs should help you create a child theme:

How to increase the logo size for Zelle ​

Add the following code to Appearance -> Customize -> Additional CSS or inside your style.css file of your child theme:

.navbar-brand {
    height: 130px;
}
.navbar-brand > a > img{
    max-height: 120px;
}

The first part will increase the height of the parent element to make room for the l****ogo to grow. The second part is increasing the size of the actual l****ogo.

You can increase or decrease the height and max-height values according to your preferences.

How to increase the logo size for Hestia ​

Add the following code to Appearance > Customize > Additional CSS or inside your style.css file of your child theme:

.navbar .navbar-header .navbar-brand img {
    max-height: unset;
    width: auto;
    height: auto;
}
.navbar .title-logo-wrapper {
    max-width: 350px;
}

This snippet will take care of increasing the logo size in Hestia. The final size can be adjusted by changing the 350px value.