I'm using a child theme that uses Cherry Framework.
I would like a custom page template that is completely blank.
If I make a file called "blank-template.php" and put it /wp-content/themes/my-child-theme/ with the following code.
<?php
/**
Template Name: Blank Template
*/
?>
<html>
<head>
</head>
<body>
test
</body>
</html>
If I then make a new page in Wordpress, and select this template and load the page, I expect to see a blank page however I see a page that has my theme header and footer with the words "test" in middle, as per my file.
Am I missing a step to make a fully custom template that ignores my themes header and footer?
get_header(); and get_footer(); are missing.
<?php
/**
Template Name: Blank Template
*/
?>
<html>
<head>
<?php get_header();?>
</head>
<body>
test
</body>
<?php get_footer(); ?>
</html>
For more details : http://www.templatemonster.com/help/wordpress-how-to-create-a-child-theme-based-on-cherry-framework.html
Related
I am trying to add custom CSS to a theme template that renders an interactive to do list (I am also using some Javascript to make it work). The file name is "dashboard.php," and within it I have tried linking a custom CSS file, but I can't seem to override styles.css (what I believe to be Wordpress' default).
This is the code I am using within dashboard.php:
<?php
/*
* Template Name: Dashboard
* Template Post Type: page
*/
get_header();
?>
<header>
<link rel="stylesheet" type="text/css" href="/to-do-styles.css">
</header>
<div id="myDIV" class="header">
<h2>My To Do List</h2>
<input type="text" id="myInput" placeholder="Title...">
<span onclick="newElement()" class="addBtn">Add</span>
</div>
<ul id="myUL">
<li>Hit the gym</li>
<li class="checked">Pay bills</li>
<li>Meet George</li>
<li>Buy eggs</li>
<li>Read a book</li>
<li>Organize office</li>
</ul>
<?php
get_footer ();
?>
If I include <link rel="stylesheet" type="text/css" href="/to-do-styles.css"> in the HTML header, shouldn't that override the default styles.css?
Side note, when I copy the content from to-do-styles.css and place it into the template file (dashboard.php), it works fine; however, to keep the template file concise, I would like to have a separate file.
In short, must I override the default style.css file, or is there a way to link it to the template?
The following is my code within my functions.php, within my theme folder.
add_action('wp_enqueue_scripts', 'to_do_list_style');
function to_do_list_style() {
wp_enqueue_style('/to-do-styles.css', get_stylesheet_uri());
}
please use <head> instead of <header> to include scripts.
I am having trouble with my Wordpress template page. When calling get_header() in the template page, the content of the head is appearing inside the body tag and causing trouble. I couldn't find a solution for this.
This is what I mean :
page inspect element
page template :
<?php
/*
* Template Name: sub services
*/
get_header();
?>
<h1>sub page</h1>
<?php
get_footer();
?>
header.php :
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo('charset'); ?>">
<?php wp_title();?>
<link rel="icon" type="image/png" href="/favicon.png">
<link href="https://fonts.googleapis.com/css2?family=Lemonada:wght#600&display=swap" rel="stylesheet">
<script src="https://kit.fontawesome.com/90928eb6b7.js" crossorigin="anonymous"></script>
<?php wp_head(); ?>
</head>
<body id="theme-body" <?php body_class(); ?>>
<header>
<h1>Main Header</h1>
</header>
and I have added a page in wordpress admin and linked it to the template.
wordpress add page
Everything works fine except that the content of the head is in the body tag. when calling get_header(). In the template.php I have checked my error log and its fine. I dont know what is causing this problem or what I'm doing something wrong.
Your header.php file contains the full body (including the closing </body>) and even the closing </html> tag. Your page template then appends to that some more HTML and a footer - that's invalid HTML and can't really be intended, is it?
Browser will probably try to fix those errors by adding missing or omitting superfluous tags, but in this case none of that will come up with the intended result - it will rather lead to a result like the one you are seeing.
The header.php file can contain the opening <body> tag, but not the closing </body>. But it should contain the Wordpress loop, and inside that the_content() to load the actual page content, and also the other WP functions to fetch heading, featured image etc.
After that, you usually fetch the footer using get_footer();, which might contain the closing </body> tag, if that's not in the page template.
So, the biggest problem in your code are the closing </body> and </html> tags and the resulting invalid HTML.
I am currently building up a static website with PHP.
What I want to have is the following:
There is one main.php file that includes all the common parts of the page (header, footer, navigation and so on) and a couple of pages like index.php, team.php, contact.php and so on.
I do want to be able to edit the main.php in that way, that is effects all the pages in my project. I do however want to be able to output some specific content for each single page by writing code directly in the specific file (not main.php but e.g. index.php). So I want to assign each page of the project to use main.php as the core template.
My main.php file which looks so far like this is here:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>PHP Static Site Genarator</title>
</head>
<body>
<div id="navigation">
<?php echo navigation()?>
</div>
<div id="pageWrap">
<header>
Header
</header>
<main id="content">
<?php echo $templateContent; ?>
</main>
<footer>
Footer
</footer>
</div>
</body>
</html>
and a couple of pages like index.php, contact.php and so on.
All of them look like this:
<?php include_once $_SERVER['DOCUMENT_ROOT'].'/essentials/settings.php'; ?>
<h1>
This is the h1 for the index page
</h1>
<?php require($_SERVER['DOCUMENT_ROOT'].'/essentials/exit.php'); ?>
I deliver some settings in my settings.php file and in my exit.php file I have the following code:
<?php
$templateContent = ob_get_contents();
ob_end_clean();
echo $templateContent;
?>
I need to somehow bind all the pages to be the part of main.php at the point where I output the $templateContent variable at
What is the right way for me to achieve this?
I personally would consider using a micro PHP framework like lumen, slim, fat-free-framework for making even the smallest PHP web application.
That said, below is the solution of the approach you took to solve the problem. I will keep the file structure and file naming similar to yours, even though there is a place for improvement here.
Lets consider the following application structure:
essentials/main.php
essentials/navigation.php
essentials/exit.php
essentials/settings.php
index.php
about.php
contact.php
As you can see, I have moved all common files into the essentials folder and left all pages in the root folder
essentials/settings.php
<?php
// start output buffering
ob_start();
essentials/navigation.php
<ul>
<li>index</li>
<li>contact</li>
<li>about us</li>
</ul>
main.php
<?php $templateContent = ob_get_clean(); ?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>PHP Static Site Generator</title>
</head>
<body>
<div id="navigation">
<?php include("navigation.php"); ?>
</div>
<div id="pageWrap">
<header>
Header
</header>
<main id="content">
<?= $templateContent; ?>
</main>
<footer>
Footer
</footer>
</div>
</body>
</html>
<?php require_once("exit.php"); ?>
essentials/exit.php
<?php
ob_end_flush();
The actual pages structure index.php, about.php and contact.php look similar:
index.php
<?php require_once("./essentials/settings.php"); ?>
<h1>
This is the h1 for the index page
</h1>
<?php require_once("./essentials/main.php"); ?>
I hope this helps to move your idea forward, but highly encourage you to investigate time and learn a modern approach for PHP application development. Laravel is a great stating point.
Maybe you want something like this?
Structure
index.php
about.php
core\function.php
core\setting.php
templates\header.php
templates\footer.php
templates\menu.php
core\function.php - all function in here
core\setting.php - all setting in here
templates* - html page
index.php
<?php
include_once("core\setting.php");
include_once("core\function.php");
/*
* code php for this file in here
*/
$message = 'index data';
include_once("core\header.php");
include_once("core\menu.php");
echo <<<HTML
<div>show content {$message}</div>
HTML;
include_once("core\footer.php");
?>
It looks like you are looking for template engine.
There are many out there like Twig, Blade, Smarty
Or you can write one alone like it is explained in this excellent post by David Adams
The question is fairly simple, yet I've been looking around for an hour and found nothing:
make a page that is exactly the same as the home page, but a specific div has altered content
example index.html:
<html>
<head>
<title>title</title>
<style type="text/css">
/* css goes here */
</style>
</head>
<body>
<div id="stay">I wont change</div>
<div id="change">I will change</div>
</body>
</html>
so I want to be able to code a page so that it inherits the entire html from the index page (WITHOUT COPYING THE CODE), but a specific div (here with the id #change) to have different content. How would I go about doing this?
You don't really "inherit" code snippets, but I understand that you're trying to reuse the page content. From your posted code, it's hard to tell exactly how the change differs from the index. Is it just a content change or does the index page not have that div?
You have a couple of options. If just the content of the div is changing, you could use the same php page and then use jquery to change the content of the div, so something like
index.php
<? php include("page.php"); ?>
other page
<? php include("page.php"); ?>
// javascript to modify div
You could break the page into chunks and just include them as needed, so you could have a top.php and a bottom.php, and the index page could do
<? php include("top.php"); ?>
<? php include("bottom.php"); ?>
And then your similar page could do something like
<? php include("top.php"); ?>
// custom stuff here
<? php include("bottom.php"); ?>
If neither of these solutions work you could always use a templating engine to create a page template, though that may be a little much for your situation.
I see you have tagged this question in php So, I will give you answer inclusive of php implementation.
Create 3 pages. index.php about.php and foo.php
The objective is to show some content in index.php but all content in about.php
Call this page foo.php
<html>
<head></head>
<body>
<p> Show this in index.php </p>
<?php if($_SERVER['PHP_SELF'] === 'about.php'): ?>
<p> Show this in about.php </p>
<?php endif; ?>
</body>
</html>
Now, all you have to do is ... include foo.php in both pages.
Make the page you want and you can go about doing this:
<html>
<head>
<title>title</title>
<style type="text/css">
/* css goes here */
</style>
</head>
<body>
<div id="stay">I wont change</div>
<?php
if(basename($_SERVER['PHP_SELF'] == "other-page.php")){ ?>
<div id="change">I will change</div>
<?php }else{ ?>
<div id="change">Original div</div>
<?php } ?>
</body>
</html>
That takes the file name and based on that you can change content (if is only for one page, otherwise write a function/class based on that).
There are many ways to do this. Here are two, each with their own advantages and disadvantages.
Firstly, if you don't want to modify the page at all, you can add a small PHP code segment which will include a page passed in through the GET variable. For example
<html>
<head>
<title>title</title>
<style type="text/css">
/* css goes here */
</style>
</head>
<body>
<div id="stay">I wont change</div>
<div id="change"><?php require($_GET['page']); ?></div>
</body>
</html>
would mean that using the URL mypage.php?page=home.php would automatically include the contents of a file called home.php into that div.
Another way to do it is to divide up that page into 2 sections, and including both of them in any other page you use. For example, splitting the code into 2 seperate files, such as
top.php:
<html>
<head>
<title>title</title>
<style type="text/css">
/* css goes here */
</style>
</head>
<body>
<div id="stay">I wont change</div>
<div id="change">
bottom.php:
</div>
</body>
</html>
then in your PHP file you can use the following
require("top.php);
MY CONTENT HERE
require("bottom.php);
remember that you will need to use echo to output html code on this method if it is within <?php and ?> tags
hope this helps.
You can't do this will plain HTML.
To do it in php, first create template file like so: (template.php)
<html>
<head>
<title>title</title>
<style type="text/css">
* css goes here */
</style>
</head>
<body>
<div id="stay">I wont change</div>
<div id="change"><?=$main_content?></div>
</body>
</html>
Now, let's say you want to make a "contact me" page.
<?php
// in contact.php
$main_content = "Contact me at my#email.com
include "template.php";
?>
This will write the contents of template.php to the page and echo out the value of $main_content inside div#change
Now, this is generally frowned upon because managing your variables becomes difficult as the size of the template increases. To keep things sane, use a templating engine as all of the other answers are suggesting.
I'm a beginner in cake php. i have needed to convert my HTML template into Cake PHP template. any idea?
It is very easy.
Replace your template main file extension to .ctp
index.html to index.ctp
Look at the layout of you file (html code) and determine what section of that template you want to appear on all pages;
Usually most templates are setup as follows:
<html>
<head>
<title>My Site</title>
// You will include your javascript and css files here
<?php
echo $this->Html->css(array('cake.generic','default'));
echo $this->Html->script(array('myscript','jquery'));
?>
</head>
<body>
<div id="container">
<div id="header"></div>
<div id="body">
<div id="main_content" style="width:600px;float:left">
<?php
//Code for this should be in your home.ctp
// in your pages folder. Usually I cut this content from
// my template and place the whole thing in that file
// everything else happens magically
echo $content_for_layout;
?>
</div>
<div id="side_content" style="width:300px;float:left">
<!-- You can have content here manually or create elements and include them here like the following -->
<?php $this->element("sidebar_content"); ?>
</div>
</div>
<div id="footer">...</div>
</div>
</body>
You should then upload all images to the /img folder in your /app/webroot folder
Change your images path to reference /img folder.
You must do the same with all your CSS and JS files. Place them in their corresponding folders in the /app/webroot location.
Good luck!
Save your template in to APP/views/layouts/template.ctp.
Make sure it has at least two variables:
<title><?php echo $title_for_layout; ?></title>
and
<body>
<?php echo $content_for_layout; ?>
</body>
Fire up your view, or controller and add
$this->layout = 'template'; // view/method
or $layout = 'template'; // controller;
Look at the Cake default.ctp for ideas.