WordPress.org

1. slaviksoul
   Member
   Posted 9 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 9 months ago #
   

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

3. slaviksoul
   Member
   Posted 9 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 9 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 9 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 9 months ago #
   

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

7. slaviksoul
   Member
   Posted 9 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 9 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 9 months ago #
   

   Modifications to theme files will erase upon theme update.

10. slaviksoul
    Member
    Posted 9 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 9 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 9 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 9 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.