How do I make a "Blank"-page template…?

  • Uffe

    (@uffe-kirkegaard)


    14 years ago

    I’m trying to make a new page-template that is “blank”…

    By “blank” I mean a page that has No header, No Sidebar, No footer but STILL looking like all the other pages on my website (background and shadow-effect on the edges).

    The whole idea with this template is, to be able to make- and edit the content of the page in the wordpress editor and then have it showing on the page.

    Anyone know how to do that? I’m really getting grey hair from this…

    My site is: https://uffekirkegaard.dk

Viewing 9 replies - 1 through 9 (of 9 total)
  • Jarret

    (@jarretc)

    To do this you’re going to have to have FTP access to your server that the site is hosted on (or someway to upload files).

    Open up an editor program on your computer (Notepad) will work and copy/paste the following into the file.

    <?php
/**
	Template Name: Page with background only

*/
?>
<html>
<head>
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
<style type="text/css">
body { background-color: #cccccc; background-image: url('https://uffekirkegaard.dk/wp-content/uploads/2010/10/bg.jpg'); background-repeat: repeat-y; background-position: top center; background-attachment: scroll; }
#page-content { width: 800px; margin: 20px auto; }
</style>
<title><?php wp_title( '|', true, 'right' ); bloginfo('url'); ?></title>
<?php wp_head(); ?>
</head>

<body>
<?php while (have_posts()) : the_post(); ?>
<div id="page-content">
	<?php the_content(); endwhile; ?>
</div>
</body>
</html>

    Then, save this file on your computer with something like the name of background-only.php. Then log into your server and upload this file into the folder of the current theme you are using.

    Which for you would be /wp-content/themes/Uffes Child/

    Once you have done that, log into your WordPress installation and create a new page. On the right hand side under the Publish button make sure you select the ‘Page with background only’ option from the dropdown list.

    You could do a lot more with this but this is a pretty basic stripped down version.

    Thread Starter Uffe

    (@uffe-kirkegaard)

    First of all…

    Thank you JarretC for your quick and very detailed response ??

    I have already made a page to see it in action. I have just one more question.. It seems that the styling for some reason don’t apply to this page in the same way it does on all the other pages on my website..

    You can see it here: https://uffekirkegaard.dk/blank

    The text is a lot smaller, and on the Tab in the browser, it shows my url after the page-name instead of the blog title as on all the other pages..

    Do you have any idea why, and maybe where I can style this specific page..??

    Thanks so much for your help, I’m very greatful.

    Jarret

    (@jarretc)

    Ah sorry about that, try this for a fix. Copy/paste and replace the old code with the stuff below.

    <?php
/**
	Template Name: Page with background only

*/
?>
<html>
<head>
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
<style type="text/css">
body { background-color: #cccccc; background-image: url('https://uffekirkegaard.dk/wp-content/uploads/2010/10/bg.jpg'); background-repeat: repeat-y; background-position: top center; background-attachment: scroll; }
#page-content { width: 640px; margin: 20px auto; }
#page-content p { font-size: 1em; font-family: Georgia; line-height: 1.5em; text-align: justify; }
</style>
<title><?php wp_title( '|', true, 'right' ); bloginfo('name'); ?></title>
<?php wp_head(); ?>
</head>

<body>
<?php while (have_posts()) : the_post(); ?>
<div id="page-content">
	<?php the_content(); endwhile; ?>
</div>
</body>
</html>
    Thread Starter Uffe

    (@uffe-kirkegaard)

    Thanks very much for helping me out here JarretC…

    The title on the Tab is now showing correctly – Perfect!

    But the text styling doesn’t seem to work for some strange reason. Do you know if it’s possible to somehow style it via the stylesheet??

    Btw. the new code is applied to see here: https://uffekirkegaard.dk/blank

    (the only thing I changed from your code is the width)…

    Jarret

    (@jarretc)

    You need to add

    #page-content p { font-size: 1em; font-family: Georgia; line-height: 1.5em; text-align: justify; }

    in between the <style> and </style> tags like I showed in my last example. That should get the text almost matching to the way it looks on the site.

    Thread Starter Uffe

    (@uffe-kirkegaard)

    Thanks again JarretC…

    I’ve tried to use your code, and it fixed most of my problems :o)

    The styling though, it still caused me some troubles. You can see it here:

    https://uffekirkegaard.dk/blank-1

    But I tried to tweak it so it now looks like this:

    https://uffekirkegaard.dk/blank-2

    I used this code: 

    <?php
/**
	Template Name: Uffes fullwidth

*/
?>
<html>
<head>
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
<style type="text/css">
body { background-color: #cccccc; background-image: url('https://uffekirkegaard.dk/wp-content/uploads/2010/10/bg.jpg'); background-repeat: repeat-y; background-position: top center; background-attachment: scroll; }
</style>

<title><?php wp_title( '|', true, 'right' ); bloginfo('name'); ?></title>
<?php wp_head(); ?>
</head>

<body>
<?php while (have_posts()) : the_post(); ?>
<div id="container" class="uffes-fullwidth">
			<div id="content" role="main">
					<div id="page-content">
					<?php the_content(); endwhile; ?>
					</div>
			</div>
</div>
</body>
</html>

    With this, my task is done… I now have a blank page as I wished :o)

    Thank you very much JarretC, I couldn’t have done it without your help…!!!

    Thanks for taking the time… Appreciate it!

    Uffe

    Alwyn Botha

    (@123milliseconds)

    Please mark thread as resolved so that

    – others with similar problem can see it as resolved and will read this thread for help if they have similar problem

    – people providing help see it as resolved and will not waste time reading this post.

    Thread Starter Uffe

    (@uffe-kirkegaard)

    I guess I was a little to quick…

    A moment ago I tried to check the page in explorer (I usually use google chrome) and to my big surprise none of the two pages is showing correctly in explorer browser…

    Any ideas why..??

    Thanks JarretC (and Uffe for asking the question)
    I’ve been looking for this for a while now. The blank template is the perfect solution for what I’m trying to do. THANK YOU!
    ??

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘How do I make a "Blank"-page template…?’ is closed to new replies.