WordPress.org

Ready to get started?Download WordPress

Forums

Change logo text to logo image - Zenon lite theme (7 posts)

  1. fierce
    Member
    Posted 1 year ago #

    I am stuggling to change my logo text to a logo image in the Zenon lite theme. This theme does not have an option to change or add an image in the theme options so I think I need to edit the CSS file?? I have managed to upload the file "logo.png" to the template images folder but not sure where to go from there. I know I need to edit the CSS but have not found any definitive way to do this.

    Any help would be greatly appreciated!!

  2. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    You can either use CSS to put the logo as a background image or you'll need to edit the header.php file. Posting a link to your site would be a good start.

  3. fierce
    Member
    Posted 1 year ago #

    http://fiercepublicity.com/

    I am still very new to wordpress so i didn't realise you could put the logo as a single fixed background image and delete the default text. I just tried that but it is not big enough and still not showing the entire logo...

    Any suggestions and help on what to change for use as a background image or with using CSS would be great! I have also copied the code if this helps. This is with the logo image as the background but it is not big enough or showing the entire logo.

    #header{width:100%; float:left;}
    .logo{ width:100%; float:left; margin-bottom:25px;}
    .logo h1{ text-align:center; margin-bottom:5px;}
    .logo h1 a{ color:#333; text-decoration:none;}
    .desc{text-align:center;}

    .outer-center {float: right;right: 50%;position: relative;}
    .inner-center {float: right;right: -50%;position: relative;}
    .logo img{ margin-top:15px; margin-bottom:15px; border:none;}

    Thanks for the help!!

  4. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Okay, before you do anything else you need to create a child theme -- otherwise you are going to lose all your changes when the theme is updated. After you've done that...and moved any changes you've made already into the child theme, then proceed on this.

    You need to put the logo as a background in the #header CSS -- not as a body background -- which is what you have. Try this in the child theme style.css file:

    #header {
        background-image: url("http://fiercepublicity.com/wp-content/uploads/2012/11/logo1.png");
        background-position: center top;
        background-repeat: no-repeat;
    }

    You will then likely need to do some adjustments to the spacing, etc. in the CSS and hide the text already there.

  5. blackparrot
    Member
    Posted 1 year ago #

    Hi there! I was able to upload my logo to the header thanks to your guidance, but is there any way to reduce the header height? I would like to significantly reduce the amount of white space above and below my logo. I tried cropping the logo but that didn't help. Thanks for your help! http://www.blackparrotproductions.com

  6. Andrew
    Forum Moderator
    Posted 1 year ago #

    @blackparrot That's not the same subject.
    You can create your own thread to discuss that.

    Edit: Good night WPyogi :)

  7. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Morning Andrew :)! Nitey-nite for me...

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.