[k.capelli]

Hey,

I would like to custom edit my theme. I was wondering if you could give me the correct html to help me do this or point me in the right direction.

I basically want my page to look like this..

http://www.flickr.com/photos/92334073@N06/9906226343/

I would like to know the dimensions of the background, how I can change it inc removing the grey header.

If it’s possible to change the menu bar as shown in the photo, not just the colour but the style.

And how I would place the logo in the middle and position the tagline.

Sorry I’m rubbish with HTML.

http://www.thelostlondoner.com

[Sakin]

@k.capelli: Your customize looks advance. So, you might need to consider hiring developer.

The header background is actually small pattern image that is repeat. For your large image, I recommend to use 1600px width image for header.

You can use image for menu as well.

For logo center you need to remove social icon from the header first.

[k.capelli]

It’s not too advanced. The background and logo have been developed for me.

All I need to know is how to put in my new custom made background and if I can and how to change the menu bar to the shape shown.

How do I use an image for the menu. Any HTML code on hand for this?

I’ll remove the social cons from the header but is there a way to centre the icon via the css?

I understand that since I’ve swapped to pro most of the edits are done through the theme editor not the style.css

[Sakin]

@k.capelli: You can add the css like the following CSS in “Appearance => Theme Options => Custom CSS” box to add your custom image in the header background.

#branding {
    background: url("http://www.thelostlondoner.com/wp-content/uploads/2013/09/id1.jpg") repeat scroll 0 0 transparent;
}

For menu, it’s better you just add the background url from “Appearance => Theme Options => Color Options”. But if you really was to add image, then you can add the following CSS in “Appearance => Theme Options => Custom CSS” box, where you can just change the image url.

#access {
    background: url("http://www.thelostlondoner.com/wp-content/uploads/2013/09/id1.jpg") repeat scroll 0 0 transparent;
}

To make the header center, you can add the following CSS in “Appearance => Theme Options => Custom CSS” box.

#branding .logo-wrap, #site-logo, #site-details {
    width: 100%;
}
#site-logo a img, #site-details {
    display: block;
    float: none;
    margin: 0 auto;
    padding: 0;
    text-align: center;
}

This is the level at max I can help in. For more, you need to hire developer to customize it for you.

[k.capelli]

This has been beyond a massive help to me. And pretty much all the info I needed to get it done.

Thank you so much

[Sakin]

@k.capelli: Thanks for your appreciation.

[Author]

Posts