Return to previous page

Menu text & colour change - by kikalomy

This topic has 15 replies, 2 voices, and was last updated 10 years, 6 months ago ago by Eva Kemp

kikalomy

Participant

May 13, 2014 at 15:03

hi i asked before but still no joy, i need to change the colour of the footer title from white to dark grey as the footer is white so its not visible, i changed all options in the theme options typography but none change of the footer headers, how can i do this, can you please tell me what code i need to make this happen in the css custom file

where do i change the add to cart colour, i would like the colours at present to be reversed, e.g. green then grey. same goes for the main menu colour, where do i change the colour of the product “new banner? what custom css do i use?

also i would like to change my menu item called sale, i would like to change this 1 item to red, if you could advise me on how to achieve this that would be super helpful

thanks so much

#3518 Copied

14 Answers

kikalomy

Participant

May 13, 2014 at 15:58

just so you know i also tried to use the css in the menu appearance editor but it would not override the current settings??

#3522 Copied

Eva Kemp

Support staff

May 13, 2014 at 16:00

Hello,

1. To change footer title add the following code in custom.css file:
.footer_title {color: color_name;}
Don’t forget to enable the file in Theme Options > Custom CSS > On.

2. To change the color for “Add to cart” button use this code in custom.css:
product-grid .button {background: green;} and to change the hover color:
.product-grid .button:hover {background: grey;}

3. Please provide us with the link to the product “new banner” you want to change color for.

4. You can change color only for one menu item. Go to Appearance > Menus, open the menu tab of “Sale” and below “CSS Classes (optional)” write your css class (for example: my_class):

You can enable CSS classes at the top of admin panel, just click “Screen Options”:

Then you should edit custom.css file, add the code:
.my_class a {color: red !important;}

Regards,
Eva Kemp.

#3523 Copied

kikalomy

Participant

May 13, 2014 at 18:49

hi eva thank u so much for the reply, i have done exactly as advised but still no joy, could u please take a look and see where im going wrong.

It would be awesome if in a future update these editing capabilities where in the theme options ;]

very grateful ;]

Please, contact administrator
for this information.

#3549 Copied

Eva Kemp

Support staff

May 13, 2014 at 20:35

Hello,

As I see you haven’t renamed default.custom.css to custom.css, which is located in the theme directory. What file have you made the changes in?
Please rename default.custom.css file or provide us with FTP login details.

Regards,
Eva Kemp.

#3558 Copied

kikalomy

Participant

May 13, 2014 at 22:06

hey eva, thanks so much yeeah the menu changed to red after your advice ;] but the footer didnt work?? would you be able to look and see why?

also how do i change the borders around the form field as they are barley visible? is it css? and can i change the magnify on the product page, if so where? your advice would be such a great help

your speedy help has been greatly appreciated from above matters, thanks so much, i hope this is my last issues and i can leave u alone lol

Please, contact administrator
for this information.

#3566 Copied

Eva Kemp

Support staff

May 14, 2014 at 12:58

Hello,

You had wrong code of color for footer title {color: color_#49494c;} and it should be {color: #49494c;}.

Please check borders of the fields for checkout form. Is it what you requested?

Please clarify what you want to do on the product page.

Regards,
Eva Kemp.

#3590 Copied

kikalomy

Participant

May 14, 2014 at 17:06

hi thanks so much,

i would like to make the form in the footer and contact page darker so they are visible.

also on the product page i would like the zoom to go closer on the hover over so more detail can be shown on the garment.

thanks eva

#3632 Copied
Eva Kemp

Support staff

May 14, 2014 at 18:54
You’re welcome.

Do you want to set background color for footer? If so you need the following code in custom.css: .footer_container {background: none repeat scroll 0% 0% black !important;} and replace “black” with the color name of your choice.

For contact page use this code in custom.css:
```
.contact_input {border: 1px solid black !important;}
.contact_textarea {border: 1px solid black !important;}
label {color: black;}
```
and again replace “black” with the color name of your choice.

According to the zoom question try to upload larger image.

Regards,
Eva Kemp.
#3649 Copied
kikalomy

Participant

May 14, 2014 at 21:01

hi eva, so sorry i don’t think i explained myself correct,

i would like the border for the form field to be medium grey on the footer as at present you can’t see the input fields where you type your name, email etc, i want to keep the background white but because the form input border is very light grey its not visible where to put your cursor to input the form details .

also i need to change the footer links from dark grey as they are a bit dark against the black, i would like to change to lighter grey.

on the product page i have large images but the zoom does not go very close i would like to adjust the zoom so when you hover over the image it shows a closer magnification of the material of the garment, this way i can set the zoom to go in closer, as at present it just goes slightly closer so not much difference from original image

i hope i explained better for you, thanks for your help

oh i just tried your code for contact page works great thanks so much

#3661 Copied

Eva Kemp

Support staff

May 15, 2014 at 14:33

Hello,

Do you mean you want to change border for newsletters form in footer? If so, please check now if it’s set correctly. Also check how the footer links are displayed now.

Have you tried uploading high resolution image? Please try it as such problem is caused by small image size.

Regards,
Eva Kemp.

#3737 Copied

kikalomy

Participant

May 15, 2014 at 22:32

hey eva, everything is awesome, thanks sooo much for all your help i gave you top score in theme forest ;]

in regards to the custom css, where can i find out the codes to change as im sure you won’t want me hassling you all the time lol

1 last thing, is it possible to add a pipe character in the menu to create a divide between menu items e.g. faq | delivery & returns | size guide|, is this done in the custom css?

thank you again for being so patient, helpful and amazing ;]

#3779 Copied

Eva Kemp

Support staff

May 16, 2014 at 09:38

Hello,

Thank you very much for kind words.
You can find the code that needs to be changed using “Inspect element” in Chrome or Firefox browser, just make right click on the element you want to edit and select “Inspect element” from the list.

Do you mean you want to add a separator to the main navigation menu? I’ve added the code in custom.css, so you can check the menu now.
Also you can refer to this article: http://www.jackreichert.com/2011/07/31/how-to-add-a-divider-between-menu-items-in-css-using-only-one-selector/

Regards,
Eva Kemp.

#3805 Copied

kikalomy

Participant

May 16, 2014 at 11:01

thank you so much eva once again for all your help you have been truly amazing, best theme help ive ever had. Thankyou and have a great weekend ;]

#3814 Copied

Eva Kemp

Support staff

May 16, 2014 at 11:35

You’re always welcome and thank you very much!

Have a good weekend too!
Regards,
Eva Kemp.

#3819 Copied
Viewing 15 results - 1 through 15 (of 15 total)