Welcome! To use this support forum, please Login or Join Today!

   

Mobile Header & Retina Issue

{name}
Rank

Total Posts: 15

Joined 2015-07-05

PM

 

I’ve run into an issue with the “enable mobile header” setting.  It enables the smaller image for retina devices, including my (or anyone else’s) MacBook Retina.  Is there a way to enable the header *only* for mobile devices (phones and tablets), and *not* for computers?

Thanks!

{name}
RankRankRankRank

Total Posts: 3667

Joined 2011-04-27

PM

 

Thanks for letting me know.

The function st_mobile_logo() function is overridable by redeclaring it in your child theme. Can you try addding the following to your child theme functions.php and let me know if this does the trick?

function st_mobile_logo() {
 if (of_get_option('use_mobile_logo_image')) {
  $styles  =  '<style type="text/css">';
  $styles .=  '@media only screen and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {';
  $styles .= '#wrap #header #site-title.graphic a {';
  $styles .= 'background-size: 100% auto;';
  $styles .= 'background: url('.of_get_option('mobile_header_logo').') no-repeat center center;';
  $styles .= 'margin: 0px auto;';
  $styles .= 'display:block;';
  $styles .= 'width: 250px;';
  $styles .= 'height: '.of_get_option('mobile_logo_height').'px;';
  $styles .= '}';
  $styles .= '}';
  $styles .=  '</style>';
  echo $styles;
  }
 }
add_action('wp_head', 'st_mobile_logo');
{name}
Rank

Total Posts: 15

Joined 2015-07-05

PM

 

I put the code in the functions.php file at the end and enabled the mobile header option.  It seems to prevent it showing on the MacBook development environment.  I can’t check it on the IOS devices, though.  I’m not set up to serve to the local network.  I’ll have to work that one out.

{name}
RankRankRankRank

Total Posts: 3667

Joined 2011-04-27

PM

 

FYI, If you’re on a mac and have Xcode installed, you can open it and test it in the device simulator

{name}
Rank

Total Posts: 15

Joined 2015-07-05

PM

 

It took me a few days, but I got xcode installed and it’s all working: The MacBook with Retina screen shows the full-size image, and the iOS simulator shows the small image.  Thanks!