Support » Theme: Clean Journal » remove white space

  • Hi, Im totally new at web design and i am using the clean journal theme i want to get rid of the white space between the two menu bars at the top of my website where the search form is. If possible i would like to move my image header in that place. Im not sure how to create a child theme if i need to do this. Please help thanks!

Viewing 9 replies - 1 through 9 (of 9 total)
  • hello,
    In the themes folder directory/style.css, you could find an ID called


    and remove its padding to reduce the white space.
    I recommend to make this tweak with a child theme to save all your custom features. To learn about how to create one check! HERE


    Hi, so i tried that and it did not work. Nothing changed when i removed the padding.

    hello again,

    could you please post a link to your website if possible?
    and please specify that do you want to remove the area with the search completely or want to “squeeze ” the white space?

    I dont have the site active yet though so i am not sure you will be able to see it. I would love to get rid of the white space all together. The theme is clean journal. If possible i wanted to put my header image in the white space but wasnt sure if i could do that. Thanks for your help. Im so new at this.

    Hello again ,

    To edit any theme files, please build child theme first. You shouldn’t edit any theme files directly, as when you update the theme, all your edits will be reverted back to original. So, to me safe always build child theme, you can download the sample child theme from here

    Then you have to remove your site branding and your search form
    for that you can insert the below code in the functions.php of your child theme.

    function unhook_clean_journal_functions() {
      remove_action( 'clean_journal_header', 'clean_journal_site_branding', 60);
       remove_action( 'clean_journal_header', 'clean_journal_header_right', 70);
    add_action( 'init', 'unhook_clean_journal_functions' );

    And after that for the site logo you can insert the below given css code form the custom css option given by the theme. It is located in Dashboard => Appearance => Customize => Theme Options => Custom CSS Options.

    #masthead {
    background: url(‘×120&text=image1’) no-repeat center;

    But If you do not want the logo, do not put the above custom css.
    hope it works,

    Oh my gosh that worked thankyou so much!!! I have one more question now. So i put my site logo in and it is in between the two menu bars like i wanted but the logo is cut off a little bit. How do i make that area the same height as my logo so it fits nicely?

    remove the old custom css and add the below given css

    #masthead {
    background: url('') no-repeat center;
    height : 200px;

    Adjust the height according to your image height and you should be fine
    If you have any queries and want a swift response please visit the themes official forum


    thanks for all your help!

    You are welcome,
    Thank you for the appreciation .


Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘remove white space’ is closed to new replies.