I have a custom WP page and want to be able to target different page id classes. When I add body_class() to the header <body> section it outputs all classes to the page!
I also have a gtag Google Analytics script tag at the start of the header but I don't think that should affect it.
<!DOCTYPE html>
<html>
<head>
<meta name="google-site-verification" content="Ey9SSwK6cHm5KMRuCUinWcWx1URGF8FZ8FV5HnG2B4A" />
<?php wp_head(); ?>
<title>The Carnivore Diet - The Ultimate Diet for Weight loss, Digestion and Inflammation!</title>
</head>
<body>
<?php body_class(); ?>>
The answer was I had to have body_class() in the body tag:
<body <?php body_class(); ?>>
Related
I have a barebone header.php file that looks like this so far
<!doctype html>
<html>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<header class="testB">
<p>header section</p>
</header>
The header loads into the index.php file perfectly fine, however it doesn't render my <header> tag with the text. I just checked out a couple videos and tutorials to see if there's something else I need to do and they all seem to dive right into customizing everything and have it render. The only thing present is the title of my website which wordpress injects on its own. Any clue as to why this won't just work like it seems to in the tutorials?
Here's my index.php and footer.php just so you guys can see the overall setup.
index.php
<?php get_header(); ?>
<p class="test">body</p>
<?php get_footer(); ?>
footer.php
<footer>
<p>footer</p>
<?php wp_footer(); ?>
</footer>
</body>
</html>
Now that I posted this is just hit me that WP strips the <p>footer</p> out of the footer.php as well while injecting it's "powered by wordpress" snippet. I haven't enabled any WP theme support in the functions.php file yet as I haven't seen anyone doing anything like that before diving right into customizing their html.
UPDATE
I added the wp_body_open() function as suggested below by #amerinediary and my code still isn't rendering in the browser.
You're missing the wp_body_open() function.
Fire the wp_body_open action.
Which is getting triggered after the opening body tag, via the do_action( 'wp_body_open' ) hook.
Source # https://developer.wordpress.org/reference/functions/wp_body_open/
Following are default blank template part boiler plate
//header.php
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' );?>">
<?php wp_header(); ?>
</head>
<body <?php body_class(); ?>>
<?php wp_body_open(); ?>
//index.php
<?php get_header(); ?>
<?php get_footer(); ?>
//footer.php
<?php wp_footer(); ?>
</body>
</html>
Additionally <?php wp_footer(); ?> shouldn't be included inside a container as Wordpress is using it to render <script>'s tags.
I have a website that I am building and I am planning to use php inlude for the header and footer.
Lets say the header is <html>.....</html
Footer is <html>......</html>
What happens with the beginning and ending of html tags on the same page?
Is there gonna be a problem?
Can there be two open and end tags on the same page?
header
footer
If you are going to use "include", "require" or "require_once" on your page... the included file should contain ONLY valid markup. Think of your include files as what you would normally write between the <body> and </body> tags.
EXAMPLE:
index.php
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>
<body>
<?php require'includes/header.php' ?>
my body content goes here
<?php require'includes/footer.php' ?>
</body>
</html>
header.php
<div id="header">
<div><img src="/where/my/image/is/filename.jpg" alt="my header image" title="my image title" /></div>
<div id="menu">this is where I will put my menu</div>
</div>
footer.php
<div id="footer">this is where I will put my footer content</div>
Notice that in the header.php and footer.php files the following lines have been removed...
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>
<body>
</body>
</html>
Multiple <head>, <html>, <body> tags are generally ignored by modern "smart" browsers. They will just "rewrite your code for you" based on what the browser "thinks" you meant to write. BUT will it be correct!?
Do not rely on browsers to "fix" your mistakes. Write good, clean, valid code.
Your include header should start with
<!DOCTYPE html>
<html>
<head>
some meta tags, css and js
</head>
And you footer should end with
</html>
Here's an example of a small html page structure
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
Example Explanation:
The `DOCTYPE` declaration defines the document type to be HTML
The text between `<html>` and `</html>` describes an HTML document
The text between `<head>` and `</head>` provides information about the document
The text between `<title>` and `</title>` provides a title for the document
The text between `<body>` and `</body>` describes the visible page content
The text between `<h1>` and `</h1>` describes a heading
The text between `<p>` and `</p>` describes a paragraph
UPDATE
My questions is about having multiple opening and ending
tags on a page because of php include
An HTML document can only have ONE html tag. If you just put several HTML together, it will be an invalid document, and the browsers may have problems displaying it.
My crazy web teacher requires a doctype.php file to be in each of my webpages to avoid repetition, like this:
<?php include 'doctype.php'; ?>
However, I also need a different title for each page.
<head>
<title>Activities at Pacific Trails Resort</title>
</head>
This doesn't pass in http://validator.w3.org/. How do I include the doctype and the title?
In your doctype.php page add the following:
<!DOCTYPE html>
(The trailing empty line is intentional, you will need to ensure it exists in the doctype.php file.)
In each of the other pages, they should look something like:
<?php include 'doctype.php'; ?>
<html>
<head>
<title>Activities at Pacific Trails Resort</title>
</head>
<body>
<!-- content -->
</body>
</html>
Then when you visit each page, the output will be something like:
<!DOCTYPE html>
<html>
<head>
<title>Activities at Pacific Trails Resort</title>
</head>
<body>
<!-- content -->
</body>
</html>
you could always make yourself a little function for the start of your page and pass the title as a variable. You would put the function in your config.php and then all you have to do is require "config.php" and start your page with startPage("your title").
function startPage($title)
{
echo<<<END
<!doctype html>
<html>
<head>
<title>$title</title>
<link rel='stylesheet' href='css/admin.css' type='text/css'>
</head>
END;
}
ETA: I've gotten 2 down-votes for this but no explanation why. It might be breaking php's style guidelines because I'm echoing html? Not sure?
I have been developing a page on my webserver (using nano on the actual server) and I have been experimenting with the INCLUDE statement as an attempt to hide database details from the end user. However, my html is being placed within BODY tags according to Firefox's Inspector.
Here is the result in firefox and below that is the code for my page.
<?php
include "/database.php";
?>
<DOCTYPE! html>
<html>
<head>
<title><?php echo $minfo['name']; ?></title>
<meta charset="utf-8">
</head>
<body>
<h1>Welcome to my page</h1>
</body>
</html>
If its needed I can also include the "DATABASE.PHP" script.
Try this:
<?php
include "/database.php";
?>
<!DOCTYPE html>
<head>
<title><?php echo $minfo['name']; ?></title>
<meta charset="utf-8">
</head>
<body>
<h1>Welcome to my page</h1>
</body>
</html>
Assumes that $minfo['name'] is defined in your database.php.
I have a php file that doesn't (for now) use any php code, that holds code for the header and main menu that will be used across all pages. The CSS file has no effect, even though I've created a style class for h1. The text "TEST" shows up, but the style is not applied. How do I properly include the CSS file?
mainMenu.php
<!--This code is included within the <head> of each page, and the stylesheet for the header and main menu are included here-->
<link href="styles/headerMenu.css" ref="stylesheet" type="text/css">
<!--Header and menu code-->
<div>
<h1>TEST</h1>
</div>
index.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>untitled</title>
<?php include ('./includes/mainMenu.php') ?>
</head>
<body>
</body>
</html>
The CSS file is not found. Double check the link and correct it:
<link href="menu.css" rel="stylesheet" type="text/css">
^- REL not REF
Also to prevent additional problems, remove the start and end tags of <head> and <body> from the code. The way you output the HTML elements, you would create wrong HTML if you keep those tags. Remove them and your page will be valid HTML again.
index.php:
<!DOCTYPE html>
<html>
<meta charset="utf-8" />
<title>untitled</title>
<?php include ('menu.php') ?>
</html>
Valid HTML has the benefit that you can run it through a validator to spot errors early.
I think it may be because you have got your menu appearing inside your <head> tag.
The CSS needs to go inbetween the <head> and </head> but the rest needs to be inside the <body> tag
<link href="styles/headerMenu.css" rel="stylesheet" type="text/css">
This must be at <HEAD></HEAD>
<div>
<h1>TEST</h1>
</div>
This must be at <BODY></BODY>
You have to separate this file into 2 files and include them in Head and in Body..
Don't include your HTML code in HEAD part. Only include CSS and JavaScript files in HEAD section. and you need to prefix the css or images path in some php file.
E.g.
create new php file with name "conn_path.php"
<?php
define('SITE_PATH',$_SERVER['DOCUMENT_ROOT'].'siteName/');
define('SITE_HTTP_PATH','http://localhost/'siteName/');
define('CSS_PATH','http://localhost/siteName/styles/');
define('IMAGE_PATH','http://localhost/siteName/images/');
?>
And then you path will be like below:-
mainMenu.php
<?php include "conn_path.php" ?>
<link href="<?php echo CSS_PATH ;?>headerMenu.css" rel="stylesheet" type="text/css">
It will help you in whole project…
Create a template file, with your essential (and re-used) html. Also with <html>, <head> and <body> tags and anything you must have in all pages – As your stylesheets and menu.
Then add a content section with a single variable.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>untitled</title>
<link href="styles/headerMenu.css" rel="stylesheet" type="text/css">
</head>
<body>
<!--Header and menu code-->
<div>
<h1>TEST</h1>
</div>
<?php echo $page_content; ?>
</body>
</html>
This way, any page content shoud be assigned to $page_content instead of echoed.