Support » Fixing WordPress » Different header in firefox

  • Hello! Thank you so much for taking the time to read my post. Any help you’re able to offer would be greatly appreciated 🙂
    I need to have a different header appear in firefox than in all other browsers for my site.

    I currently have this code in my header:

    <head>
    	<script src="https://use.fontawesome.com/d450b61818.js"></script>
    	<meta charset="<?php bloginfo( 'charset' ); ?>">
    	<meta name="viewport" content="width=device-width, initial-scale=1">
    	<link rel="profile" href="http://gmpg.org/xfn/11">
    	<?php if ( is_singular() && pings_open( get_queried_object() ) ) : ?>
    	<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>">
    	<?php endif; ?>
    	<?php wp_head(); ?>
    	<?php echo do_shortcode( "[hmenu id=2]" ); ?>
    	<div class="top-bar">
    	<div class="top-countdown">
    	<a href="http://calvarytucson.com/teaching-archives/live/">
    	<button class="top-countdown-button"><div class="top-countdown-button-inner"><span class="firefox-live"><?php echo do_shortcode( '[widget id="smartcountdown-2"]' ); ?></span></div></button>
    	</a>
    	</div>
    	<div class="top-icons">
    	<a href="https://twitter.com/calvarytucson" target="_blank">
    	<button class="top-icons-button"><div class="top-icons-button-inner"><img src="https://calvarytucson.com/wp-content/uploads/2017/07/social-003_twitter-2.png" alt="Twitter"></div></button>
    	</a>
    	</div>
    	<div class="top-icons">
    	<a href="https://www.facebook.com/calvarychapeltucson" target="_blank">
    	<button class="top-icons-button"><div class="top-icons-button-inner"><img src="https://calvarytucson.com/wp-content/uploads/2017/07/social-006_facebook-2.png" alt="Facebook"></div></button>
    	</a>
    	</div>
    	<div class="top-icons">
    	<a href="https://www.instagram.com/calvarytucson/?hl=en" target="_blank">
    	<button class="top-icons-button"><div class="top-icons-button-inner"><img src="https://calvarytucson.com/wp-content/uploads/2017/07/social-038_instagram-2.png" alt="Instagram"></div></button>
    	</a>
    	</div>
    	</div>
    </head>

    and it seems line the code: <?php echo do_shortcode( '[widget id="smartcountdown-2"]' ); ?> found on line 14 is causing the body of our site to be blank in firefox.

    I haven’t been able to find a work around that allows me to insert that shortcode without the php, or in a way that doesn’t break the site in firefox.

    So, I’m settling for having 2 different header files; one that pulls up in firefox, and one that pulls up for every other browser.

    This is the code that I’ve come up with so far, but I am pretty new to the code side of wordpress:

    if(strlen(strstr($agent,"Firefox")) > 0 ){      
        $browser = 'firefox';
    }
    if($browser=='firefox'){
        get_header( 'one' );
    }
    else{
        get_header();
    }

    and I have a file titled “header-one.php” where my header.php file is located with all the same code, but with text instead of the shortcode php.

    Is that correct? and is there a way to add that to my functions.php file to make that work, or do I need to go into all the places where my site calls for the header and replace it with that bit of code?

    Thank you again, very much!
    Chris Furrow

Viewing 6 replies - 1 through 6 (of 6 total)
  • The real question is “Why do you need a different header in Firefox?” Browser-specific hacks are in general not a good thing, so if we had a better idea of your real goal, we may be able to suggest something which is easier to accomplish.

    My counter-question is: Why not use a countdown plugin that won’t break things?
    There are several to choose from.

    Thread Starter Calvary Tucson

    (@cfurrow)

    Hi Kjodle! Thank you for replying to my question.

    The reason I’m trying to display a different header in firefox is that a certain piece of the code in my header is causing the body of my website to be blank, but only in firefox.

    Here’s all the code in the header of my site:

    <?php
    /**
     * The Header for our theme
     *
     * Displays all of the <head> section and everything up till <div id="main">
     *
     * @since Yaga 1.0
     */
    ?>
    <!DOCTYPE html>
    <html <?php language_attributes(); ?> class="<?php echo esc_attr( apply_filters( 'yaga_html_classes', 'no-js mobile-menu-closed' ) ); ?>">
    
    <?php
    ?>
    <head>
    	<script src="https://use.fontawesome.com/d450b61818.js"></script>
    	<meta charset="<?php bloginfo( 'charset' ); ?>">
    	<meta name="viewport" content="width=device-width, initial-scale=1">
    	<link rel="profile" href="http://gmpg.org/xfn/11">
    	<?php if ( is_singular() && pings_open( get_queried_object() ) ) : ?>
    	<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>">
    	<?php endif; ?>
    	<?php wp_head(); ?>
    	<?php echo do_shortcode( "[hmenu id=2]" ); ?>
    	<div class="top-bar">
    	<div class="top-countdown">
    	<a href="http://calvarytucson.com/teaching-archives/live/">
    	<button class="top-countdown-button"><div class="top-countdown-button-inner"><span class="firefox-live"><?php echo do_shortcode( '[widget id="smartcountdown-2"]' ); ?></span></div></button>
    	</a>
    	</div>
    	<div class="top-icons">
    	<a href="https://twitter.com/calvarytucson" target="_blank">
    	<button class="top-icons-button"><div class="top-icons-button-inner"><img src="https://calvarytucson.com/wp-content/uploads/2017/07/social-003_twitter-2.png" alt="Twitter"></div></button>
    	</a>
    	</div>
    	<div class="top-icons">
    	<a href="https://www.facebook.com/calvarychapeltucson" target="_blank">
    	<button class="top-icons-button"><div class="top-icons-button-inner"><img src="https://calvarytucson.com/wp-content/uploads/2017/07/social-006_facebook-2.png" alt="Facebook"></div></button>
    	</a>
    	</div>
    	<div class="top-icons">
    	<a href="https://www.instagram.com/calvarytucson/?hl=en" target="_blank">
    	<button class="top-icons-button"><div class="top-icons-button-inner"><img src="https://calvarytucson.com/wp-content/uploads/2017/07/social-038_instagram-2.png" alt="Instagram"></div></button>
    	</a>
    	</div>
    	</div>
    </head>
    
    <body id="body" <?php body_class(); ?>>
    
    <?php
    	
    	do_action( 'yaga_preloader' );
    	do_action( 'yaga_display_site_header' );
    
    ?>
    
    	<div id="page" class="hfeed site">
    	<!-- Start the main container -->
    		<main id="main" class="site-main cf">

    and it’s line 28 in that code that’s causing the problem; specifically this segment:
    <?php echo do_shortcode( '[widget id="smartcountdown-2"]' ); ?>

    If I take that out, the body of my site will appear again in firefox, and when I put it back in, it disappears.

    I haven’t been able to find a way get that shortcode to display without that php code in the header.

    Do you know what I might be able to do? Thank you again!

    Thread Starter Calvary Tucson

    (@cfurrow)

    Tor-Bjorn Fjellner, thank you for replying!

    I actually didn’t think it would be the plugin itself causing the problem until you asked that (it didn’t cause any other problems on our site until this), but I just tested the same cose using another shortcode and it works fine on firefox.

    It does seem to be the plugin that’s causing the problem.

    However, I haven’t been able to find another countdown plugin that allows me countdown to 3 different events every week, and then have a “count-up” feature while the events are running (this one links to a google calendar with events scheduled every week). With other countdown plugins I looked at all you could do was set a date and time to countdown to and let it go, you couldn’t schedule it to countdown to several things every week.

    Do you know of any other plugins that can do that? Thank you again for your help.

    No. I don’t know. But I’d suggest that you contact the author of that plugin about this problem. If the plugin is still being maintained, then “working on Mozilla Firefox” would probably be important for him/her.

    If it’s a free plugin here at WordPress.org, then you should find a link to the plugin-specific support forum on the plugin’s page.

    Thread Starter Calvary Tucson

    (@cfurrow)

    So, after implementing another countdown, it looks like it is actually not the plugin itself causing the issue. It still shows up blank on firefox :/

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Different header in firefox’ is closed to new replies.