Screencast: Part 3: Download WordPress for a Custom WordPress Theme

Now we need to go and get WordPress. Normally, you go to the WordPress home page and download it from there. Then you extract the download and place it into your server root folder. We are going to use ST2 to make our lives a bit easier with the Fetch plugin. Now all we have to do is create a folder inside our XAMPP server root (C:\xampp\htdocs) or MAMP server root (/Applications/MAMP/htdocs), drag that folder into ST2 and use Fetch to grab and extract a remote copy of WordPress. It’s so easy it’s almost fun!

We then need to start building our custom theme. So that means we need to create a folder in a special location inside our WordPress folder (wp-content/themes). In that location we create a folder called simple-wordpress.

Inside that folder we will need two core files (that are required by WordPress) which are index.php and style.css. We will also add header.php and footer.php. The code for each of these files can be found below the screencast.

index.php
[prettify]

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium.



[/prettify]

style.css
[prettify]
#wrapper {
margin: 15px auto;
width: 960px;
}
nav ul
{
padding-left: 0;
margin-left: 0;
background-color: #036;
color: White;
float: left;
width: 100%;
font-family: arial, helvetica, sans-serif;
}

nav ul li { display: inline; }

nav ul li a
{
padding: 0.2em 1em;
background-color: #036;
color: White;
text-decoration: none;
float: left;
border-right: 1px solid #fff;
}

nav ul li a:hover
{
background-color: #369;
color: #fff;
}
[/prettify]

header.php
[prettify]




Simple WordPress

header

[/prettify]

footer.php
[prettify]

© 2012




[/prettify]

Download Finished Files

finished-files-wordpress-custom-theme-part-03

Used in Video

Back to Main WordPress Page with list of tutorials on creating a WordPress custom theme from scratch.

Leave a Reply

Your email address will not be published. Required fields are marked *