Simple sales page you can use with any WP theme - free. Celebrating 400 posts :)

by Kezz
2 replies
Okay, so I'm a bit of a dummy and accidentally posted again whilst I was making this little page, so it's really my 401st post. But, anyway!

Because four hundred ends in two zeros, I felt compelled to share something really useful. I'm probably most useful with Wordpress stuff, so I've knocked out a quick sales page template you can add to any theme you're using.

I've kept everything inside this one page, so it's really easy to edit and change the colors. It's very simple, but if you want a minimalist sales page this will do the trick for you.

I attached the file to this post in a zip. To use it, just extract the php file inside and put it into the folder of the theme you are using. This will add "Simple Sales Page" as an option to your dropdown list of page templates. Any page you apply this to will look completely different to the rest of your Wordpress site.

Here's the raw code, if you don't feel like downloading, and so I can explain a bit:

PHP Code:
<?php
/*
Template Name: Simple Sales Page
*/
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<title><?php the_title(); ?></title>
<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" />
<style type="text/css">
<!--
html, body {
background:#6d81a4;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
margin:0;
padding:0;
}

.page {
border:2px solid #03245d;
width:750px;
background:#FFF;
margin:20px auto;
}

.content {
padding:30px;
min-height:300px;
}
-->
</style>
</head>
<body>
<div class="page">
    <div class="content">
    <?php if (have_posts()) : while (have_posts()) : the_post(); ?><?php the_content(); ?><?php endwhile; endif; ?>
    </div>
</div>
</body>
</html>
Okay, so I've picked out a nice grey/blue for the background, and a darker blue for the border around the "page" area that holds the content.

Up in the head there is all the css code that controls this page.

To change the background color, change the hex code next to "background" under "html, body" - the first one there that currently has "#6d81a4"

If you want a different font, you can change "font-family" in that same area too.

To change the border color around your copy, change the hex code at "border:2px solid #03245d;", under the "page" area.

Here's some color charts with hex codes to choose from: Color Charts - Webmonkey

Everything else can be changed up pretty easily too, but that should be enough to get started.

Also, "Exclude Pages" is a really handy plugin that lets you hide pages from your navbar. This is really useful if you want to setup a sales page or landing page with a template like this, but don't want it showing up on your menu. You can get it here: WordPress › Exclude Pages WordPress Plugins

I hope that helps get some new sales pages up and running for people, and you enjoy my little pressie!
#400 #celebrating #free #page #posts #sales #simple #theme
  • Profile picture of the author I.M.Retired
    Thanks Kezz - you do some great work with Wordpress. I really appreciate this offer!
    {{ DiscussionBoard.errors[1143136].message }}
  • Profile picture of the author Kezz
    Hey Val, thanks to you too, and you're welcome!
    {{ DiscussionBoard.errors[1143187].message }}

Trending Topics