Page Header Size

Home Forums Flash Free Page Header Size

This topic contains 8 replies, has 3 voices, and was last updated by  saudensabina 4 months ago.

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #1405092

    peskinphotography
    Participant

    Hello,

    I am more familiar with the Zakra Theme, but building a website with the free Flash theme currently. I cannot seem to find how to adjust the size of the Page Header. In Zakra, it allows you to choose the padding or size of the page header, as well as scroll vs. fixed.

    I would like to make the page header bigger so the image can be seen (with around 100px padding on the top/bottom of the page name (I.e. About). If possible, I would also like to make the page header fixed.

    Is there a setting for this I am missing or CSS I can add?

    URL page example: https://yogamadeira.pt/about/

    #1405131

    saudensabina
    Moderator

    Hi peskinphotography,

    The feature to make page header bigger for your site is available in the pro version of the theme.

    For the page header fixed, it requires a lot of code customization and can’t be covered from this forum. Hope you can understand.

    Thank You.

    #1405136

    peskinphotography
    Participant

    Ok, I can understand about the page header fixed, but there is ZERO way to change the page header size in the free version?? This feature should not even be there if that is the case, it looks horrible. The size of the image on the page header is about 5cm, and it is basically the same size as the text in height and looks like something is wrong. Is there any way I can adjust this size within the free verson?

    #1405204

    peskinphotography
    Participant

    Is there any code or way i can remove the page header? If I can’t actually make it look half decent, I would rather it not be there at all. Can you let me know if that is possible?

    #1405296

    saudensabina
    Moderator

    Hi @peskinphotography,

    Go to your Dashboard > Appearance > Customize > Additional CSS.

    To change Page header size you can add this to Additional CSS:

    #flash-breadcrumbs {  
      padding-top: 60px;
      padding-bottom: 60px;
    }

    Note: Padding size may be increased or decreased as your desire.

    To remove the page header you can add this to Additional CSS:

    #flash-breadcrumbs {
    display: none;
    }

    Do let us know if you have any further query regarding our theme.

    Thank You.

    #1405318

    peskinphotography
    Participant

    Thank you. This now looks much better as it is bigger and makes sense to add a picture. With that said, when you add a picture, it automatically just shows the very top of the picture. Is there code so the page header shows the center-center or the image?

    Thanks,

    #1405328

    saudensabina
    Moderator

    Hi @peskinphotography,

    Glad to know that it worked. About showing the center of the image on the background of the page header, the easiest way you can do is to crop the proper size of the image that you want to display and upload it.

    Thank You.

    #1405662

    ankitapatel07
    Participant

    Hello,

    What is the code to reduce the size of the font? It is very large and looks very odd as the menu font is small and the header isn’t.

    #1405725

    saudensabina
    Moderator

    Hi @ankitapatel07,

    To reduce the the font-size. Please add the below code to Additional CSS:

    .breadcrumb-trail.breadcrumbs .trail-title {
    font-size: 18px;
    }

    Note: Font-size may be reduced as your wish.

    Thank You.

Viewing 9 posts - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.