WordPress.org

1. slaviksoul
   Member
   Posted 10 months ago #
   

   Hi there
   Hope you can help me.
   My website uses Mystique theme and I need to change my header but as the theme doesn't have a panel or options I need to change it in the editor, right?

   But as I never worked in CSS, I'm not sure what to do e.g. what code to add/change to the header.php template. Can you please advise?

   I have an image I want to upload - it's already in my media library - and I suspect it's just a matter of taking its file url and adding it to the code/style sheet, but no idea where exactly and if I need to add more than just the url.

   Hope this makes sense...

   You can see my site http://www.uniquecoaching.co.uk I already have an image as a header there but need to replace it - the original was done by my old designer so I never had to do it, hence the question :-)

   Thank you so much!

2. Andrew Nevins
   Volunteer Moderator
   Posted 10 months ago #
   

   Have you a Child Theme or Custom Style/CSS plugin?

3. slaviksoul
   Member
   Posted 10 months ago #
   

   Hey Andrew
   Thanks for the prompt reply! :-)
   I think Custom Style/CSS plug in but then I wouldn't know being a stranger to CSS. How can I tell?

4. Andrew Nevins
   Volunteer Moderator
   Posted 10 months ago #
   

   In the dashboard, do you have an option called "Custom CSS" or something, perhaps under Appearance?

   You can look in your plugins section for clarification.

5. slaviksoul
   Member
   Posted 10 months ago #
   

   I can't see anything called Custom CSS. I do have "Appearance" though in the left hand navigation of my WP dashboard and when I click on that I can choose from Themes, Widgets, Menus and Editor.

6. Andrew Nevins
   Volunteer Moderator
   Posted 10 months ago #
   

   You could try this plugin
   http://wordpress.org/extend/plugins/custom-css-manager-plugin/

7. slaviksoul
   Member
   Posted 10 months ago #
   

   Thanks, I did upload it but it's confusing me even more :-)
   It seems to only accept code (in settings) and that is exactly what I don't know how to do e.g. how do I tell it to change my header?

8. radhika
   Member
   Posted 10 months ago #
   

   @slaviksoul

   if you want to change the header of your site then you have to edit the header in style.css of your theme. Search '#site-title' in style.css template and add as:

   #site-title{
   	background:transparent url(images/header.png) no-repeat center top;// edit here image path
   	height: 200px;
   }

9. Andrew Nevins
   Volunteer Moderator
   Posted 10 months ago #
   

   Modifications to theme files will erase upon theme update.

10. slaviksoul
    Member
    Posted 10 months ago #
    

    Hi Arti
    Thanks so much. I'm going to try now and will let you know how I got on

11. slaviksoul
    Member
    Posted 10 months ago #
    

    Ok, I've had a look and found the section of the code I need (I think) but am still not sure where exactly - and what - I need to add.

    The url of the image I want to upload (which is in my media library) is this; http://www.uniquecoachingblog.com/wp-content/uploads/2012/06/FB-UC-cover-image.png

    Would you please be able to tell which part of the url and where exactly, in the below CSS code, I need to add it? Thank you SO much for your help

    #site-title .headline{
    font-size: 110%;
    border-left: 1px solid #ccc;
    color: #fff;
    float: left;
    text-transform: uppercase;
    letter-spacing: -1px;
    padding: 10px 0px 10px 20px;
    margin: 20px 0 0 20px;
    }

12. slaviksoul
    Member
    Posted 10 months ago #
    

    Hi anyone :-)

    I've played all day trying to work out how to do this and am still none-the-wiser :-(

    Anyone there who could tell me what to do?

    Thank you a million! :-)

13. radhika
    Member
    Posted 10 months ago #
    

    @slaviksoul
    you can do one thing that you go in wp-admin.
    click on media > add new> select your image> save.
    Edit the upload image of your media library & copy the file url & goes in appearance> editor> style.css & search '#site-title' & paste your image url :
    

    #site-title{
    	background:transparent url(images/header.png) no-repeat center top;// edit url of media library image
    	height: 200px;
    }

Reply

You must log in to post.