Return to previous page

Change color of search or header - by spallsport

This topic has 18 replies, 2 voices, and was last updated 6 years, 6 months ago ago by Rose Tyler

spallsport

Participant

May 8, 2018 at 19:29

can it change the background colour of box search and box of top header?
Attach images https://prntscr.com/jfeh5v
https://prntscr.com/jfeh83

#192576 Copied

17 Answers
Rose Tyler

Support staff

May 10, 2018 at 08:10
Hello,
```
.header-type-2 .top-bar, .top-bar .container, .header .search .et-mega-search form input[type="text"] {
    background-color:  white;
}
.top-bar .top-links {
    margin-top: 10px;
}
.side-area-icon {
    top: 18px;
}
```
Regards
#192619 Copied
spallsport

Participant

May 10, 2018 at 09:28

very good thanks!!1
and If I want to put any text in the top bar? Can I mad here or I must do in other location?
Thanks

#192631 Copied

Rose Tyler

Support staff

May 10, 2018 at 10:40

You’re welcome!
To add content in the top bar you need to place it in appropriate widget area (Appearance > Widgets).

Regards

#192649 Copied

spallsport

Participant

May 10, 2018 at 11:15

thanks bu I need to put in the midle of the top bar, widget doesn’t allow, and neither can change the color of text…

#192657 Copied

Rose Tyler

Support staff

May 10, 2018 at 12:34

You can create a static block and edit content of it using Visual Composer (Visual Composer > Role manager and enable composer for the Static Blocks), then add your block in top bar widget area. I will help you to put it on the center of the bar (using custom css code).

Regards

#192663 Copied

spallsport

Participant

May 10, 2018 at 14:29

good thanks I can put, but now my top bar is more wide and I dont change the color text, can you help me?
Thanks

#192680 Copied

Rose Tyler

Support staff

May 10, 2018 at 14:58

Please provide temporary wp-admin access.

Regards

#192683 Copied

spallsport

Participant

May 10, 2018 at 15:12

in private content you have.

Please, contact administrator
for this information.

#192688 Copied

Rose Tyler

Support staff

May 10, 2018 at 15:19

The credentials to wp-admin panel are incorrect. Please check them.

Regards

#192691 Copied

spallsport

Participant

May 10, 2018 at 15:34

try now please.
Now de color of text is black but I cant modify, and the top bar is very wide ;(

Please, contact administrator
for this information.

#192696 Copied
Rose Tyler

Support staff

May 10, 2018 at 16:07
– Please edit content of this text block and change http://prntscr.com/jg62pj to http://prntscr.com/jg62um, because if text starts from new line in page code will be added <br>, like – http://prntscr.com/jg63oh.
– The color you can also change by editing the content – http://prntscr.com/jg644w
– Set here 0px – http://prntscr.com/jg64sw to remove default margin value.
– Add custom class for row http://prntscr.com/jg65ju
and use this custom css code:
```
.top-bar p:empty {
  display:none;
}
.top-bar .widget_icl_lang_sel_widget, .top-bar .vc_row {
    display:  inline-block;
}
.top-bar .vc_row {
    margin-top: 10px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
```
chanage .vc_row in the code to your custom class.
The result should be like on this screenshot – https://prnt.sc/jg69a9

Regards
#192702 Copied
spallsport

Participant

May 10, 2018 at 16:32

Sorry but I dont get the las step, I dont Know my custom class.
my text is under the languages, It isnt in the same level of languages that your picture

#192710 Copied
Rose Tyler

Support staff

May 10, 2018 at 17:03
“Custom class” means text you added in “Extra class name” field https://prnt.sc/jg65ju, like – http://prntscr.com/jg7139
in this case, the custom css should be:
```
.top-bar p:empty {
  display:none;
}
.top-bar .widget_icl_lang_sel_widget, .top-bar .top-content {
    display:  inline-block;
}
.top-bar .top-content {
    margin-top: 10px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
```
Regards
#192712 Copied
spallsport

Participant

May 10, 2018 at 17:18

thanks, wher do I insert the custom css?
best regerads

* sorry I edit, I find the custom css.
Sorry I am rookie, thanks for all!!

#192715 Copied

Rose Tyler

Support staff

May 11, 2018 at 08:28

Hello,

You’re welcome!
Here you can find a few video tutorials – https://www.8theme.com/videos/ I hope they will be useful.
Have a nice day.

Regards

#192742 Copied

spallsport

Participant

May 11, 2018 at 11:06

very good, thanks!!!

#192763 Copied

Rose Tyler

Support staff

May 11, 2018 at 12:05

My pleasure 🙂

Regards

#192768 Copied
Viewing 18 results - 1 through 18 (of 18 total)