Return to previous page

Problems with colors and height of the menu

This topic has 12 replies, 3 voices, and was last updated 7 years, 3 months ago ago by Rose Tyler

designerobot

Participant

May 15, 2017 at 15:51

These are the errors that I’m not able to fix:

1.
In the main menu (desktop version), the background of the language selector is white, but should be black. And the text color of the two not selected choices should be white instead of black.

2.
In the compact menu (mobile version) the text color of the two not selected languages should be white but now it is black (therefore not visible until you don’t rollover these languages).

Moreover:

3.
I inserted in .navbar these instructions (padding-top: 0px; padding-bottom: 0px;) to have the menu less high as possible.
This works in the main menu (desktop version) but not in the compact menu (mobile version), that now has a different height.
What I need to insert to add the same effect to the mobile menu?

4.
In the mobile menu, can I move the languages above the navigation (now is below)?
Can I write these languages links all on the same line?

5.
I don’t want to show the footer demo block present in the Theme Option panel. I would like to use my footer that I did with widgtes (the name is Footer 1).
Well, but at this point how I can do black the background of footer? The website should be black from the starting of the footer to the end of the page.

Please add all things in the child theme, so I don’t lose them at the next upgrade of the theme.

Please, contact administrator
for this information.

#163127 Copied

11 Answers
Rose Tyler

Support staff

May 16, 2017 at 08:49
Hello,

1. Try to use this custom css code in style.css of your child theme:
```
.header .wpml-ls-statics-shortcode_actions, .header .wpml-ls-statics-shortcode_actions a {
    background: black;
}
.header .wpml-ls-statics-shortcode_actions{
    border-color:black;
}
.header .wpml-ls-statics-shortcode_actions a {
    color: white;
}
.header .wpml-ls-statics-shortcode_actions .wpml-ls-current-language>a{
    color:red;
    background-color: black;
}
```
2.
```
.mobile-nav #lang_sel_list a {
    color: white !important;
}
```
3. Could you please provide screenshot for better understanding what you want to be achieved?
4. It requests additional customization.
To display in line:
```
.mobile-nav .wpml-ls-legacy-list-horizontal .wpml-ls-item {
    width: auto;
}
```
5. You can change footer background color in Theme Options http://prntscr.com/f8cod7

Regards,
Rose Tyler.
#163204 Copied
designerobot

Participant

May 16, 2017 at 12:17

Hi, thanks for your replies.

1. ok

2. ok
3. Here is the screenshot. I want to set the distance from border to image logo both in desktop version and mobile version. Now it is only in the desktop version and not in mobile.

4. ok the inline, but you have note replies to the other question: in the mobile version, how I can move the language block that now is below the main menu to the top part?

5. You have not understood my question… if I use this option I need to active one the footer of the Theme Panel. If I do this, below the footer the background is not colored. The website should be black from the starting of the footer to the end of the page. Now it is from them starting of the footer to the end of the footer.

Moreover:

6.
In the desktop version the language block is not perfectly aligned to the right border, like the main menu. What I need to write to correct this?

7.
In the desktop version there is line between the language menu and the main menu, can I set the color and the thickness of this line?

8.
In the mobile version, when I click on the hamburger menu the right part of website shift to right and become darker with a shade of black.
Can I set the color and the level of transparency of this color?

Please, contact administrator
for this information.

#163240 Copied
Rose Tyler

Support staff

May 17, 2017 at 09:56
Hello,

1-2. You’re welcome!
3. Use this code in Custom css for mobile:
```
.navbar {
    padding: 0;
}
```
4. Sorry, but it requires to change not only the code that is written in style.css file, that’s why it’s a paid customization.
5.
```
.st-pusher {
    background-color: black !important;
}
```
6.
```
.header .wpml-ls-statics-shortcode_actions {
    padding-right: 0;
}
```
7.
```
.header-type-11 .navbar-collapse {
    border-top: 2px solid red;
}
```
8. Yes, you can use custom code, for example:
```
.st-pusher::after {
    background: rgba(244, 82, 77, 0.35);
}
```
Regards,
Rose Tyler.
#163292 Copied
designerobot

Participant

May 17, 2017 at 12:05

Thanks a lot!

How much to solve the point 4.?

Could you give me what file to touch so in case I do some experiment?

The point 6. doesn’t work because it seems that a white space is present after the last word. I cols remove it? What file I need to touch?

#163314 Copied
Rose Tyler

Support staff

May 17, 2017 at 12:19
Hello,

4. I’m sorry but additional customization is not included in our support. If you have any questions about additional customization you can contact WP-Kraken team.
6. Please change code to:
```
.header #lang_sel_list a:last-child, .header .wpml-ls-statics-shortcode_actions {
    padding-right: 0;
}
```
Regards,
Rose Tyler.
#163315 Copied
designerobot

Participant

August 9, 2017 at 01:45

Thanks to have replied to all questions.

Only about the point 4. (namely “in the mobile version, how I can move the language block that now is below the main menu to the top part?”), I know that you have already replied that additional customization is not included and I have to contact WP-Kraken team.
But, if possible, could you only tell me what is the file where to I need to do this change? Maybe it could be needful only to cut and paste a piece of the already present code and simply shift it in above position of the page. If it so simple I could do this alone.

Please, contact administrator
for this information.

#169650 Copied

Laranz

Participant

August 10, 2017 at 09:13

Hi,

It is in header.php you can move this line

<?php if(!function_exists('dynamic_sidebar') || !dynamic_sidebar('mobile-sidebar')): ?>

above the

<?php et_get_mobile_menu(); ?>

Do the changes in the Child theme.

Let us know,

Thanks,
laranz.,

#169767 Copied

designerobot

Participant

August 10, 2017 at 12:09

Hi Laranz, thanks for your help.

I did it exactly as you described it. In this way, the menu is shifted above (as I wanted) but the main menù below disappears. Why does this happen?

In pvt the link if you want to check.

Please, contact administrator
for this information.

#169792 Copied
Laranz

Participant

August 11, 2017 at 14:17
Hi,

Sorry, I fixed that now in the header.php of your child theme.. I forget to tell you about the endif.. now it will be like,
```
<?php if(!function_exists('dynamic_sidebar') || !dynamic_sidebar('mobile-sidebar')): ?>
<?php endif; ?>
```
and it will work now. 🙂

Let us know if you have any other questions,

Thanks,
laranz.,
#169896 Copied
designerobot

Participant

August 11, 2017 at 14:55

Hi Laranz,

Thank you very much, you’ve been really kind!!!

Now it’s perfect!

#169901 Copied

Rose Tyler

Support staff

August 14, 2017 at 08:38

You’re welcome!

Regards

#169959 Copied
Viewing 12 results - 1 through 12 (of 12 total)

The issue related to '‘Problems with colors and height of the menu’' has been successfully resolved, and the topic is now closed for further responses

Problems with colors and height of the menu

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection