How can I an external image just below the header text?

  • Author
    Posts
  • #1037387

    skyblueguy
    Member

    I want to add an image between the header text the menu navigation bar.

    Is there any workaround for this by adding a css script under “Appearance > Custom Design > css”?

    Thank you very much for your help!

    The blog I need help with is mygodchristahnsahnghong.com.

    #1037671

    I see you figured this out using the following CSS:

    .site-header hgroup {
    	padding-bottom: 174px;
    	background:url('http://user.chol.com/~h92002/background2.jpg');
    	background-repeat:no-repeat;
    	background-position:left bottom
    }

    Nice work!

    #1037677

    skyblueguy
    Member

    Thank you very much.

    In fact, I would like to delete the “SEARCH” section on the right and to center align the header image (I inserted the image just for testing purpose and currently it is truncated.)
    Is there any workaround for this?

    #1037678

    To hide the search box in the Sight theme header area and make the site title and description area full width, add this to your Appearance → Custom Design → CSS editor:

    .header-nav-search-container {
    	display: none;
    }
    
    .site-header hgroup {
    	width: 100%;
    }

    If you would like the header image to be wider, find this CSS block in your Appearance → Custom Design → CSS editor, and replace the url() value with a wider image:

    .site-header hgroup {
    	padding-bottom: 174px;
    	background:url('http://user.chol.com/~h92002/background2.jpg');
    	background-repeat:no-repeat;
    	background-position:left bottom
    }
    #1037682

    skyblueguy
    Member

    Really thanks for your help.

    Have a nice weekend!

The topic ‘How can I an external image just below the header text?’ is closed to new replies.