Magazine theme and mobile version

Hi,

I got some issues in the mobile version of the theme.

First, search bar and email button doesn't display.

Then, at the right of the logo, the inset bar is there. Not in your example site ...

And finally, my logo hide the title in a post page. You can see in the attachment.

Can you help me ?

Thanks

POST.jpg

HOME.jpg

Hi,

Hi I checked this on original theme and it's ok, could you provide an URL to your website (here or via PM), then i'll be able to help you..

Hi,

The URL of the website is www.focused.fr
If you need admin details, please let me know.

Also, I would like to know how to change the color of the menu (in yellow)

Bastien

Which version of iOS are you using? I checked on v. 6.0 and search bar and email button are visible on your website.

Problems with the logo can be fixed using the following code. (Paste this into css/override.css file, first enable this option in Dashboard -> Template Options -> Advanced Tab)

Code: Select all

#gk-head a.imageLogo img {
height: 110px;
}

Color of the menu can be changed by switching theme color (Template Options -> Basic), if you want to change ONLY the color of this menu, you have to replace Magazine/images/style1/tablet_menu.png file.(check tablet_menu.png from other directories style2,style3 etc..)

Hi,

I'm using IOS 6.1.3 with an iPhone 4S.
Maybe you're using an iPhone 5 ?

I tried your override and on this device it doesn't change anything. I tried with height 80, width 91 and it was ok (ugly but ok). The problem is that it affects also the normal version ...

The inset bar is still there ...

Tommorow I'll check it on this version.

Use mentioned code, but instead of override.css, use mobile.css file (css rules only for mobile version).
Could you give ma a screenshot with this inset bar marked? because i'm not sure..

Hi,

The mobile.css did the trick, thanks !

Please find below two screenshots : one with my website, one with yours. You can see the inset bar I was talking about.
You can also see that I don't see search bar or mail icon ...

focused.jpg

gavick.jpg

Ok,

paste this code to override.css file:

Code: Select all

#gk-head a.imageLogo {
    height: auto;
}

so on http://www.gavick.com/magazine searchbar and mail are visible, could you please check also this URL? http://demo.gavick.com/wordpress/magazine/

The code with the bar made everything work !
The icon now appears correctly.

Is it possible to have facebook and twitter icon appears ont he mobile version ?

Facebook and twitter icon should appear on the mobile version too. Did you set any widget rules in your GK Social widget?

Hi,

Please find below my social widget :

social.jpg

No rules are made for prevent social to display on mobile.

But as you can see this is the same in GK Magazine ...

Finally I found a solution. Social icons have additional media queries in css/template.css file.

Code: Select all

@media (max-height: 480px) {
   #gk-social-icons {
      display: none;
   }
}

You can change max-height value or remove it, but this rule hides social icons on devices with smaller screen size (height exactly), because there's no enough space for all icons in toolbar.

Hi,

Works perfectly, thanks for the tip !
Bastien