Show a different logo for mobile devices

Question

Im using the snowflat theme.  Is there a way to show a different logo if users are viewing on a cell phone? Thanks.

Answer 1

The procedure is simple. The thing is that the HTML that contains the image link is output by the core (ouch!). This means that you have to override and even rewrite that HTML in the theme. These are the steps:

1. Edit the qa-theme/SnowFlat/qa-theme.php file

2. Add/Merge the following function:

public function initialize() {
    if (qa_opt('logo_show') && qa_is_mobile_probably()) {
        $logourl = 'http://yoursite.com/mobile-image.png';
        $logowidth = 20;
        $logoheight = 20;

        $this->content['logo'] = '<a href="' . qa_path_html('') . '" class="qa-logo-link" title="' . qa_html(qa_opt('site_title')) . '">' .
            '<img src="' . qa_html(is_numeric(strpos($logourl, '://')) ? $logourl : qa_path_to_root() . $logourl) . '"' .
            ($logowidth ? (' width="' . $logowidth . '"') : '') . ($logoheight ? (' height="' . $logoheight . '"') : '') .
            ' border="0" alt="' . qa_html(qa_opt('site_title')) . '"/></a>';
    }
}

3. Edit the $logourl, $logowidth and $logoheight variables according to your needs.

Comments

I ended up getting the logo to fit ok without having to edit the code so i never tried your code. Thank you for providing it though, im sure it will benefit others