Market - How to Change the Leaf Icon in the Site Header

The  Market theme is one of our first themes to display an icon in the header area. Should you decide to forego using a custom header or uploaded logo, you have the option of using the coded text to display your site title.

By default,  Market displays a custom leaf icon.

I want to use something other than the leaf…

First you’ll need to create an image using your favorite image editing/creator program. We use Photoshop for ours.

You’ll create an image that is 94 x 66 pixels (you can make this image a different size, but this is the standard, default size).

Create your image and save it. Once you do, go to MEDIA > ADD NEW and upload your file.

Once you upload it, you’ll want to grab your media file url.

Once you do, you’ll need to open your CSS/Stylesheet to make the changes to the file URl.

You’ll look for this section of code:

.title-area {
    background: url(images/site-title.png) top center no-repeat;
    background-size: 47px 33px;
    float: left;
    margin: 20px 0;
    padding: 50px 0 30px;
    text-align: center;
    width: 400px;
 }

All you need to replace is images/site-title.png. You’ll remove that and place your new image url in there. Once you do that just click save!

To remove the leaf icon ...

In the section of code above, remove the following two lines:

    background: url(images/site-title.png) top center no-repeat;
    background-size: 47px 33px; 

Scroll down and save the changes.