Return to previous page

Logo, menu and text colours - by simplypage1

This topic has 8 replies, 3 voices, and was last updated 8 years, 7 months ago ago by Jack Richardson

simplypage1

Participant

September 10, 2015 at 12:46

Hi, love the theme and have used it on a few projects, woks great and the clients love it.

I have a few issues on my current project, not the themes fault, I guess my coding skills.

1) I want to make the homepage logo bigger

2) I want to replace the social icons box in the header with a static image

3) I want to make the menu bar slimmer

4) On a single project page, the text is red on black, I want to make it white on black

5) In the header the cart text cannot be read, I want to make this white

Thanks for your help

Simon

Please, contact administrator
for this information.

#85929 Copied Theme version: 2.3 WooCommerce version: 2.4.6

7 Answers
Robert Hall

Support staff

September 10, 2015 at 13:13
Hello,

Please use this code in Global Custom CSS (Theme Options->Custom CSS).
1)
```
.header-logo img {
    max-width: 380px;
}
```
2)
```
.header-type-7 .header .tbs{
    background: url(http://www.maruyama.co.uk/wp-content/uploads/2015/09/maruyama-black.jpg);
    background-size: 100%;
}
.menu-social-icons,
.header-type-7 .header .tbs span {
display:none;
}
```
You need replace this string for your image link.
url(http://www.maruyama.co.uk/wp-content/uploads/2015/09/maruyama-black.jpg);
3)
```
.header-type-7 .menu-wrapper .menu-main-container > ul > li > a{
    padding: 10px 17px;
}
```
4)
```
.single-product .cart .button {
color:#fff;
}
```
5)
```
.shop-text{
color:#fff;
}
```
Regards,
Robert Hall.
#85932 Copied
simplypage1

Participant

September 10, 2015 at 14:36

Hi Rob

fantstic service, thanks a lot, much appreciated.

Just one final, the search magnifying glass is in orange, what is the css to turn this into white?

Thanks

#85951 Copied
Jack Richardson

Support staff

September 10, 2015 at 15:56
Hello,

Please add this code in Global Custom CSS:
```
.fa-search:before {
   color: white;
}
```
Best regards,
Jack Richardson.
#85976 Copied
simplypage1

Participant

September 11, 2015 at 11:11

Thanks guys, everything works fine.

Just having a problem with p0int 3, I have added the code, which removes the social icons from the header and replaces it ‘partially’ with my image http://www.maruyama.co.uk/wp-content/uploads/2015/09/IRON-5YR-Warranty-white-text-sm31.png

however what I want to do is have this image as a thumbnail in the top left hand corner, I have tried every way I can think to constrain the size, without success.

This is the last bit of help I need.

Thanks again, just recommended you to my 12k followers, great service!

Cheers
Simon

#86173 Copied
Jack Richardson

Support staff

September 11, 2015 at 11:59
Hello,

Thank you for your feedback.

I’ve edited the code to this one:
```
.header-type-7 .header .tbs {
    background: url(http://www.maruyama.co.uk/wp-content/uploads/2015/09/IRON-5YR-Warranty-white-text-sm31.png) no-repeat;
    background-size: contain;
    background-position: center center;
}
```
Please check header now.

Best regards,
Jack Richardson.
#86201 Copied
simplypage1

Participant

September 11, 2015 at 12:48

No problem.

Ok so I have moved the image to the left, so it’s now in the perfect position. The size is obviously constrained by top and bottom padding. Is there anyway of increasing the size of the pic, so that it sits closer to the red menu bar and closer to the top of the header, I’m think about 30% bigger in vertical px as long as this still sits within the header.

Thanks again

Simon

#86224 Copied
Jack Richardson

Support staff

September 11, 2015 at 14:32
Hello,

We can decrease padding of the header to make the image closer to the top and menu. Use this code in Global Custom CSS:
```
.navbar {
   padding: 20px 0 !important;
}
```
Best regards,
Jack Richardson.
#86267 Copied
Viewing 8 results - 1 through 8 (of 8 total)