Solved

Fix php code so that doctype is on the first line of code

Posted on 2014-02-14
17
467 Views
Last Modified: 2014-02-14
I added a menu to my wordpress template that would appear at the top of my web pages, but it seems to have forced my "Doctype" to appear after the menu, which has caused a rendering problem in some browsers, particularly IE.

Here is my php code, I am not by any means proficient in php. I know enough to copy and paste for the most part.  Any help is greatly appreciated the following is the code in my header.php:

<?php
/**
 * The Header for Customizr.
 *
 * Displays all of the <head> section and everything up till <div id="main-wrapper">
 *
 * @package Customizr
 * @since Customizr 1.0
 */
?>
<!DOCTYPE html>
<!--[if IE 7]>
<html class="ie ie7" <?php language_attributes(); ?>>
<![endif]-->
<!--[if IE 8]>
<html class="ie ie8" <?php language_attributes(); ?>>
<![endif]-->
<!--[if !(IE 7) | !(IE 8)  ]><!-->
<html <?php language_attributes(); ?>>                          
<!--<![endif]-->
<?php tc__f('rec' , __FILE__ , __FUNCTION__ ); ?>

      <?php do_action( '__before_body' ); ?>

      <body <?php body_class(); ?> itemscope itemtype="http://schema.org/WebPage">
           
            <?php do_action( '__before_header' ); ?>

               <header class="tc-header clearfix row-fluid" role="banner">
                 
                  <?php do_action( '__header' ); ?>

            </header>

            <?php
             //This hook is filtered with the slider
            do_action ( '__after_header' )
            ?>
0
Comment
Question by:deitercat2
  • 9
  • 7
17 Comments
 
LVL 28

Expert Comment

by:sammySeltzer
ID: 39859024
Do you really need a doctype in php?
0
 
LVL 42

Expert Comment

by:Chris Stanyon
ID: 39859082
Do you really need a doctype in php?
The PHP generates the HTML, which does need a DOCTYPE
0
 
LVL 42

Expert Comment

by:Chris Stanyon
ID: 39859088
@deitercat2 - can't really see anything in your code that would cause the problem - can you post a link to your site (won't help with the PHP, but seeing the structure might give some clues)
0
 

Author Comment

by:deitercat2
ID: 39859167
Http://www.wifss.ucdavis.edu

When you view the source, you see the doctype appears after the menu.
0
 
LVL 42

Expert Comment

by:Chris Stanyon
ID: 39859258
Hmmm. Strange - I don't think your header.php file is causing the problem as everything looks OK.

The do_action() is telling wordpress to fire various functions that are 'hooked' in, and one of these hooks is firing a function that's not working properly. Try commenting them out one-by-one:

<?php // do_action( '__before_header' ); ?>

Your site won't work properly, but you will be able to identify which hook is causing the menu to load in the wrong place. Removing one of the hooks will remove the code from the menu - it's probably going to be do_action( '__header' );

I have no idea what the tc__f() function call is!
0
 

Author Comment

by:deitercat2
ID: 39859373
I commented out the code line by line and the structure remained the same with the menu loading first on the page and in the source each time.

It may be helpful to show you my function.php.  This is part of a child function.php:


<?php function my_analytics() {

/*Google Analytics Script (Child Theme Specific)*/

?>



 
            <script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-45173610-1', 'ucdavis.edu');
  ga('send', 'pageview');

</script> 
    <?php
}


/*Custom Menu for Top Navigation (Child Theme Specific) */


register_nav_menu( 'topnav', __( 'Top Nav Menu', 'customizr' ) );

if(! is_admin()){

wp_nav_menu( array( 'theme_location' => 'topnav', 'container_class' => 'topnav-menu' ) );
}



/* Navigation hover fix* (child Theme Specific */



add_filter('tc_menu_display', 'acub_menu_display');
function acub_menu_display($output) {
      echo preg_replace('| class="dropdown-toggle" data-toggle="dropdown" data-target="#"(.+?)<b |', ' class="a-stripped" $1</a><a href="#" class="dropdown-toggle a-caret" data-toggle="dropdown" data-target="#"><b ', $output, -1);
      }
0
 
LVL 42

Accepted Solution

by:
Chris Stanyon earned 500 total points
ID: 39859444
Right. I haven't played with child themes much, but the one thing that does look odd is this bit:

if(! is_admin()){
   wp_nav_menu( array( 'theme_location' => 'topnav', 'container_class' => 'topnav-menu' ) );
}

Open in new window

Normally, that goes in your HTML where you want to output the menu, not in your functions file, so in your case try moving it into your header.php file:

<body <?php body_class(); ?> itemscope itemtype="http://schema.org/WebPage">
           
   <?php
   if(! is_admin()){
      wp_nav_menu( array( 'theme_location' => 'topnav', 'container_class' => 'topnav-menu' )    );
   }
   ?>

   <?php do_action( '__before_header' ); ?>

Open in new window

0
 

Author Comment

by:deitercat2
ID: 39859801
Well  Ace, that did the trick...sort of.  On my development site the doctype is loading before the menu, however when I copied the code to production nothing changed almost nothing that is.

On development  and production the change  has caused my Social icons which appear on a navbar in the middle and in the footer to disappear.

Here is a link to the development  http://128.120.126.64/

Here is the link to production http://128.120.126.65/
0
6 Surprising Benefits of Threat Intelligence

All sorts of threat intelligence is available on the web. Intelligence you can learn from, and use to anticipate and prepare for future attacks.

 
LVL 42

Expert Comment

by:Chris Stanyon
ID: 39859849
OK. We're getting somewhere :)

On your development server, the code is now below the DOCTYPE, but it's still above the HEAD, so it's still not right.

On the production server, nothing's changed - your code is still showing above DOCTYPE. Make sure you've uploaded the header.php and the functions.php to your shild theme folder.

Post your header.php file again, so we can see where you've put the wp_nav_menu() function call.
0
 

Author Comment

by:deitercat2
ID: 39859873
I placed the wp_nav_menu fuction() call above the  __before body because placing  after the body class() took out the image slider.

<?php
/**
 * The Header for Customizr.
 *
 * Displays all of the <head> section and everything up till <div id="main-wrapper">
 *
 * @package Customizr
 * @since Customizr 1.0
 */
?>
<!DOCTYPE html>
<!--[if IE 7]>
<html class="ie ie7" <?php language_attributes(); ?>>
<![endif]-->
<!--[if IE 8]>
<html class="ie ie8" <?php language_attributes(); ?>>
<![endif]-->
<!--[if !(IE 7) | !(IE 8)  ]><!-->
<html <?php language_attributes(); ?>>                          
<!--<![endif]-->
<?php tc__f('rec' , __FILE__ , __FUNCTION__ ); ?>

 <?php
   if(! is_admin()){
      wp_nav_menu( array( 'theme_location' => 'topnav', 'container_class' => 'topnav-menu' )    );
   }
   ?>

      <?php do_action( '__before_body' ); ?>

      <body <?php body_class(); ?> itemscope itemtype="http://schema.org/WebPage">
           
            <?php do_action( '__before_header' ); ?>

               <header class="tc-header clearfix row-fluid" role="banner">
                 
                  <?php do_action( '__header' ); ?>

            </header>

            <?php
             //This hook is filtered with the slider
            do_action ( '__after_header' )
            ?>
0
 
LVL 42

Expert Comment

by:Chris Stanyon
ID: 39859941
Because the wp_nav_menu() call produces HTML, it has to go after the <body> tag, otherwise your HTML will be messed up. All HTML code has to go between the <body> tags.

Put it where I suggested and upload it and I'll see if I can see why the slider messes up.

Heading out now for a while, but will look at it later.
0
 

Author Comment

by:deitercat2
ID: 39860043
Here is the header.php code as it stands now.  Slider seems not to be affected  by the change.


<?php
/**
 * The Header for Customizr.
 *
 * Displays all of the <head> section and everything up till <div id="main-wrapper">
 *
 * @package Customizr
 * @since Customizr 1.0
 */
?>
<!DOCTYPE html>
<!--[if IE 7]>
<html class="ie ie7" <?php language_attributes(); ?>>
<![endif]-->
<!--[if IE 8]>
<html class="ie ie8" <?php language_attributes(); ?>>
<![endif]-->
<!--[if !(IE 7) | !(IE 8)  ]><!-->
<html <?php language_attributes(); ?>>                          
<!--<![endif]-->
<?php tc__f('rec' , __FILE__ , __FUNCTION__ ); ?>

 <?php
   if(! is_admin()){
      wp_nav_menu( array( 'theme_location' => 'topnav', 'container_class' => 'topnav-menu' )    );
   }
   ?>

      <?php do_action( '__before_body' ); ?>

      <body <?php body_class(); ?> itemscope itemtype="http://schema.org/WebPage">
     
      <?php
   if(! is_admin()){
      wp_nav_menu( array( 'theme_location' => 'topnav', 'container_class' => 'topnav-menu' )    );
   }
   ?>
           
            <?php do_action( '__before_header' ); ?>



               <header class="tc-header clearfix row-fluid" role="banner">
                 
                  <?php do_action( '__header' ); ?>

            </header>

            <?php
             //This hook is filtered with the slider
            do_action ( '__after_header' )
            ?>
0
 

Author Comment

by:deitercat2
ID: 39860284
Ace, my appologies, I discovered in my previous code snippet.  I have the call to the wp_nav_menu function twice, once before the body() class and another after the body() class.

Here is the header.php code as it stands now on both development and production:

<?php
/**
 * The Header for Customizr.
 *
 * Displays all of the <head> section and everything up till <div id="main-wrapper">
 *
 * @package Customizr
 * @since Customizr 1.0
 */
?>
<!DOCTYPE html>
<!--[if IE 7]>
<html class="ie ie7" <?php language_attributes(); ?>>
<![endif]-->
<!--[if IE 8]>
<html class="ie ie8" <?php language_attributes(); ?>>
<![endif]-->
<!--[if !(IE 7) | !(IE 8)  ]><!-->
<html <?php language_attributes(); ?>>                          
<!--<![endif]-->
<?php tc__f('rec' , __FILE__ , __FUNCTION__ ); ?>



      <?php do_action( '__before_body' ); ?>

      <body <?php body_class(); ?> itemscope itemtype="http://schema.org/WebPage">
     
       <?php
               if(! is_admin()){
            wp_nav_menu( array( 'theme_location' => 'topnav', 'container_class' => 'topnav-menu' )    );
               }
              ?>
           
            <?php do_action( '__before_header' ); ?>

               <header class="tc-header clearfix row-fluid" role="banner">
                 
                  <?php do_action( '__header' ); ?>

            </header>

            <?php
             //This hook is filtered with the slider
            do_action ( '__after_header' )
            ?>
0
 

Author Comment

by:deitercat2
ID: 39860317
Ace, it works!  Not sure where I was copying files to on my production server, but doctype is now above the menu.

Social Icons are not showing up in footer an nav menu above main menu.
0
 

Author Comment

by:deitercat2
ID: 39860430
I have discovered that the Social Icons show up when I put the domain name instead of the IP address into the URL.   Thanks again.
0
 

Author Closing Comment

by:deitercat2
ID: 39860442
Ace, I would give you at least a 1000 points if they would let me. I appreciate your support an resolution to something that has been frustrating me for awhile now.  Thanks also for your patience!
0
 
LVL 42

Expert Comment

by:Chris Stanyon
ID: 39860504
Excellent - glad you got it working :)
0

Featured Post

How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

Join & Write a Comment

Do you think that WordPress is just for blogs?  Think again!  WordPress is really a fantastic all around platform that you can use to develop websites on.  Integrated into its basic functionality is the ability to create pages using your choice of a…
In Part I (http://www.experts-exchange.com/Web_Development/Blogs/WordPress/A_8410-Getting-Started-In-WordPress-Part-I.html), I introduced you to the powerful WordPress backend, the WordPress administrative Dashboard.  In Part II, I will introduce yo…
The purpose of this video is to demonstrate how to update a WordPress Site’s version. WordPress releases new versions of its software frequently and it is important to update frequently in order to keep your site secure, and to get new WordPress…
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

758 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

17 Experts available now in Live!

Get 1:1 Help Now