SKT Naturo Pro – Slider text not showing in mobile

[Rodrigo]

Hello,

I have just noticed that the slider text from the homepage is not showing on the mobile version of my site, how can I fix this?

Thanks!

[Sonl Sinha]

Hi,

Kindly show us your website link

Regards,
Shri

[Rodrigo]

Hi Shri,

The link is http://www.designeryhub.com/ I just started modifying the demo version.

I also tried to enlarge the logo but if I do, then the menu is not correctly centered vertically, and also if the logo is enlarged it aligns left in the mobile version, instead of centered as it is supposed to be, can you please check that also?

Thanks!

[Sonl Sinha]

Hi Rodrigo,

Kindly go to Appearance>Theme Options>Basic Settings>Custom CSS box:
Paste this css code in custom css box

.header .header-inner .logo {margin-top:5px; margin-bottom:5px; text-align:left;}
.header .header-inner .logo img {height:auto; width:40%;}
.header .header-inner .nav ul li a {padding:50px 15px;}

Regards,
Shri

[Rodrigo]

Hi Shri,

Thanks! That worked for enlarging the logo.
But not that it is enlarged it is not centered in the mobile view, should I add another piece of code?
Also, can you please check why is the slider text not showing in the mobile version?

Regards,
Rodrigo

[Sonl Sinha]

Paste this code in custom css box for responsive :

@media screen and (max-width: 767px) {
.nivo-caption {display: block !important; top:0;}
.slide_info h2 { font-size:13px;}
.slide_info p { font-size:10px;}

}

Regards,
Shri

[Rodrigo]

Thanks Shri!
It is now showing the text in the slider, but we are still missing one thing.
Before changing the size of the logo it was showing centered only in the mobile version, but now it is showing left aligned, how can I center it again? Only in the mobile view.

Thanks

[Sonl Sinha]

@media screen and (max-width: 767px) {
.header .header-inner .logo {text-align:center;}
.header .header-inner .logo img {height:auto; width:60% !important;}
}

Regards,
Shri

[Rodrigo]

I just added that one but I also centered the logo on the desktop version 🙁
It should only be centered on the mobile and left on desktop as the original demo theme.

Thanks!

[Sonl Sinha]

Hi Rodrigo,

Remove all the CSS code in from custom css box and paste this code.

@media screen and (min-width: 480px) and (max-width: 767px) {
.header .header-inner .logo {margin-top:5px; margin-bottom:5px; text-align:left;}
.header .header-inner .logo img {height:auto; width:40%;}
.header .header-inner .nav ul li a {padding:50px 15px;}

.nivo-caption {display: block !important; top:0;}
.slide_info h2 { font-size:13px;}
.slide_info p { font-size:10px;}

}

Regards,
Shri

[Rodrigo]

This code works for placing the logo correctly, but the logo is small again and the text for the slider is gone in the mobile version.

Thanks!

[Sonl Sinha]

Kindly Send us email: [email protected] with your WordPress admin details and URL of the site. we will check the problem and resolve.

Regards,
Shri

[Rodrigo]

Thanks! I’m sending it to you right now

[Sonl Sinha]

This issue was resolved from our end. Kindly check and confirm.

Regards,
Shri

[Rodrigo]

Thanks a lot Shri!
It’s perfect now!

[Author]

Posts