Return to previous page

Need help with few minor changes - by luckyboy

This topic has 18 replies, 4 voices, and was last updated 7 years, 7 months ago ago by Olga Barlow

luckyboy

Participant

April 15, 2017 at 03:48

Hi,

Can you please do the following minor changes:

1. Add Black Line Under Header (Only for Mobile)

Example Site:
http://prnt.sc/ewn7ew

My Site:
http://prnt.sc/ewn7mf

2. I want to reduce the size / padding of Menu bar and want it like its in example site (net-a-porter). Also, Can you please add Search Bar in the Menu like it is in Example Site. I have installed Ajax Search Lite plugin on my site and its shortcode is [wpdreams_ajaxsearchlite]

My site:
http://prnt.sc/ewn8ro

Example Site:
http://prnt.sc/ewn96e

3. Please add REGISTER link in the header just next to SIGNIN like it is in the example site.Please also change the text font color to Black for NewsLetter | SignIn | Register.

My Site:
http://prnt.sc/ewnbpv

Example Site:
http://prnt.sc/ewnc16

Only these changes are needed and my site will be complete. Kindly, please do these as soon as you can and i will be really thankful to you guys.

Please, contact administrator
for this information.

#160214 Copied Theme version: 3.11.1 WooCommerce version: 3.0.3

17 Answers

Naja Jamal

Member

April 15, 2017 at 06:01

1)
Put following code in,

8theme options –>> styling –>> custom CSS –>> Custom CSS for tablet (768px – 991px)
and in,
8theme options –>> styling –>> custom CSS –>> Custom CSS for mobile landscape (481px – 767px)
and in,
Custom CSS for mobile (0 – 420px)

.header.main-header { border-bottom: 5px solid; }

Change the 5px to the amount you want

2)
Put following code in,

8theme options –>> styling –>> custom CSS –>> global custom css

.header.main-header .container .container-wrapper { padding: 0px !important; }

Can you please add Search Bar in the Menu like it is in Example Site.
– this is not possible

3)
Please add REGISTER link in the header just next to SIGNIN like it is in the example site
– Not possible

Please also change the text font color to Black for NewsLetter | SignIn | Register.
– Put following code in,
– 8theme options –>> styling –>> custom CSS –>> global custom css

.header-wrapper.header-two-rows .top-links ul > li > a { color: #000 !important; }

#160217 Copied

luckyboy

Participant

April 15, 2017 at 06:27

Perfect, Thanks a lot Naja.

3. is it possible to replace NewsLetter link with Register?

.header-wrapper.header-two-rows .top-links ul > li > a { color: #000 !important; }

the above code worked fine on desktop but on Mobile and Tablet, the font color is still WHITE.

* Olga helped me and added this code for me:

@media only screen and (max-width: 480px){
.template-container .header-logo img {
max-width: 60px !important;
}
.template-container .header-wrapper.header-two-rows .container-top-wrapper{
padding: 15px 0 15px 0;
}
}

it works perfect on mobile (0 – 420px). can u tell me the adjustments of above code for mobile landscape and tablet?

Thanks once again

#160218 Copied

Naja Jamal

Member

April 15, 2017 at 09:18

3)
is it possible to replace NewsLetter link with Register?
– the thing is that part can not be edited.
– you will be needing some PHP file edits.
– if we can replace the text there we can add another text too
– but that is not possible by default.

the above code worked fine on desktop but on Mobile and Tablet, the font color is still WHITE.
–
put this code too in,
8theme options –>> styling –>> custom CSS –>> global custom css

.mobile-menu-wrapper .links li a { color: #000 !important; }

#160223 Copied

luckyboy

Participant

April 15, 2017 at 23:53

Thanks a lot Naja.

* can you please give me css code to make the footer’s background colour BLACK. its not changing through theme’s options.

http://prnt.sc/ewxez4

It’s #242424 and i want #000000.

* Can you please give me css code to make the logo center for tablet, mobile landscape and mobile.

https://snag.gy/M16gTo.jpg

#160244 Copied Theme version: 3.11.1 WooCommerce version: 3.0.3

Naja Jamal

Member

April 16, 2017 at 04:53

footer’s background colour
– You can change footer background colour in,
– 8theme options –>> Stylinng –>> Footer –>> Footer Background Color : http://prnt.sc/ewzhmu

make the logo center for tablet, mobile

– Put following code in,
– 8theme options –>> styling –>> custom CSS –>> Custom CSS for tablet (768px – 991px)
and in,
– 8theme options –>> styling –>> custom CSS –>> Custom CSS for mobile landscape (481px – 767px)
and in,
– Custom CSS for mobile (0 – 420px)

.et-header-full-width .header-logo { padding-left: 0; text-align: center; width: 100%; }

#160245 Copied

luckyboy

Participant

April 16, 2017 at 06:16

* i did from the settings but its not changing its color, have to change it through css code.

Settings:
https://snag.gy/4dMAVy.jpg

But Color didn’t changed:
https://snag.gy/y7Mgeh.jpg

* The following code is only for Mobile, how can i use that for Mobile Landscape and Tablet as well?

@media only screen and (max-width: 480px){
.template-container .header-logo img {
max-width: 60px !important;
}
.template-container .header-wrapper.header-two-rows .container-top-wrapper{
padding: 15px 0 15px 0;
}
}

#160246 Copied Theme version: 3.11.1 WooCommerce version: 3.0.3

Naja Jamal

Member

April 16, 2017 at 12:26

To change the footer background colour put following code in,

8theme options –>> styling –>> custom CSS –>> global custom CSS

.footer-bottom { background-color: #000; }

The following code is only for Mobile, how can i use that for Mobile Landscape and Tablet as well?

– just put the code in
– 8theme options –>> styling –>> custom CSS –>> Custom CSS for tablet (768px – 991px)
and in,
– 8theme options –>> styling –>> custom CSS –>> Custom CSS for mobile landscape (481px – 767px)
and in,
– Custom CSS for mobile (0 – 420px)
that will take affect in all tablets and mobiles

#160250 Copied

luckyboy

Participant

April 16, 2017 at 13:20

* footer code is not working, i checked it on chrome and its showing “et-footers-wrapper” for that area

* i pasted the 2nd code in mobile landscape and tablet, not working as well.

#160251 Copied Theme version: 3.11.1 WooCommerce version: 3.0.3

Amzy Leel

Participant

April 17, 2017 at 06:06

I’ve updated the footer code and your footer background is now #000
check : http://prntscr.com/exb9u0

#160271 Copied
luckyboy

Participant

April 17, 2017 at 07:29
Thank you Amzy

1. The following code works fine on Mobile, but i tried it for Mobile Landscape and Tablet but it doesn’t work
```
@media only screen and (max-width: 480px){
.template-container .header-logo img {
max-width: 60px !important;
}
.template-container .header-wrapper.header-two-rows .container-top-wrapper{
padding: 15px 0 15px 0;
}
}
```
2. How to remove the gap between Menu and Sub-Menu?

http://prnt.sc/exbqoo
#160276 Copied Theme version: 3.11.1 WooCommerce version: 3.0.3
Amzy Leel

Participant

April 17, 2017 at 10:00
1. I’ll check this and get back to you.

2. put following css in global custom css.
```
.nav-sublist-dropdown {
    top: 9px !important;
}
```
9px matches perfectly to your site.. you can change it to the amount you want
#160282 Copied
luckyboy

Participant

April 17, 2017 at 13:18

1. Thanks for the code Amzy. I know the code is perfect, but i don’t know whats happening, i have added the code but unable to see its effect, i have cleared site’s cache, cleared my browser’s cache, but can’t see the change. i have also accessed the site through VPS but same problem.

2. alright, i am waiting

#160291 Copied

Amzy Leel

Participant

April 18, 2017 at 05:54

1. I’ve fixed it.. please check: http://prnt.sc/expfdb
2. we will update this once we find the issue

#160321 Copied

luckyboy

Participant

April 18, 2017 at 06:12

Thanks Alot Amzy

I have translated my site into Arabic, when i go from English to Arabic version, it changes the header position along with links and icons in it, i don’t want that. i just want the text to be changed from English to Arabic but the links and icons should remain at their position like in English version.

Header in English:
http://prnt.sc/expi8l

Header in Arabic:
http://prnt.sc/expjb8

#160324 Copied

Olga Barlow

Support staff

April 19, 2017 at 14:50

Hello,

We are sorry but it’s not possible by default keep LTR position for the RTL version. If you have CSS skills you may play around with styles and overwrite RTL styles.

Regards

#160559 Copied

luckyboy

Participant

April 19, 2017 at 15:54

i have solved all my issues, only 1 minor issue left, please help me on this:

For Mobile and Tablet, The code which u added for Header Padding works on for Mobile but i want the code for Mobile Landscape and Tablet as well

‘@media only screen and (max-width: 480px){
.template-container .header-logo img {
max-width: 60px !important;
}
.template-container .header-wrapper.header-two-rows .container-top-wrapper{
padding: 15px 0 15px 0;
}
}’

#160576 Copied

Olga Barlow

Support staff

April 20, 2017 at 08:05

Hello,

Then change max-width: 480px; to the max-width: 992px;

Regards

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