BETA version 0.4.5 "Defiant"
Report bugs to beta@denyconformity.com

DenyConformity.com

How to Make a Website: Part 6

Series: How to Make a Website

A website isn’t really worth much without any content on it (unless you’re like a Pinterest and you have millions of people all over to make your content for you). Right now, our little website may look kind of neat, but it’s pretty much blank. Today we’re going to do something about that. We’ll create some new pages, make some blog posts, and upload some images.

Part 5 C: Paging Dr. Wordpress

On the Internet, content is displayed on things called “web pages.” Currently our little website has one page - we’ll call it the Front Page. You haven’t created this page, it’s just the default page that Wordpress creates for you. It features a blog (which currently has no posts), but you can make it so your Front Page shows whatever you want.

It’s time to get some content up in there. This is where you need to refer back to your little game plan, so you are clear about how many pages you need to create. For my website, I want to create five pages (Home, Bio, CV, Work, and Blog). I want the front page to be “Home,” and I don’t want the blog to show up there. Chances are you’ll have a similar concept for your site (you might have more or less pages, but I definitely recommend that you include at least an “about” or “contact” page or whatever.

You can create pages in the Pages section of the Dashboard. I know, it’s pretty hard to wrap your brain around that idea, but you’ll just have to manage. Note that I already have one page (and you probably do, too): the Sample Page which I threw mercilessly in the trash.
Hit “Add New” to add a page. The page Title will show up as a link in your site’s top navigation (or however the theme you chose lists your pages). You can use Wordpress’s’ really handy text editor panel to create the actual content for the page. You can use the “Visual” tab to format your text just like you would in any text editing program and Wordpress will generate some HTML for you, or you can switch to the “HTML” tab to insert HTML code yourself. You can also format it in the Visual tab and switch to the HTML tab to see what the HTML looks like, which can be interesting.
So I filled out the info for my “Home” page. You can modify the Permalink to this page if you want, but keeping it yourwebsite/index.php/pagetitle/ is probably the best way to go. If you want a page to be the Front page (as I do for “Home”), you will be able to make it so in a bit, so just hold your horses. You can preview the page or save it for later, but you can just go ahead and hit “Publish” to make it a real page.
Now if you check out your site, you’ll see a new page in your site menu (for my theme, as for most themes, the site menu is right under the header logo). Yes, I want to change the colors of those links from Green to some sort of Red, but let’s not worry about that now. Note that it treats your page like a blog post, so readers can post comments on them by default. I don’t want that, so I’ll have to turn it off, but we’ll get to that later. Oh, and don’t worry about that “edit” button (if there is one for you - it depends on your theme). That’s just there because we’re logged in as the Admin. Most users won’t see that.
I can just say “Add New” again to add the next page. Once you have pages, you can make new pages as “Sub Pages” by selecting a Parent. You can use this to make a page like “Contact Us” as a sub-menu item from “About Us” if you want, for example. Themes handle the sub items differently, but most will have a little drop down menu that shows up when you hover over a menu item. You might have noticed that when you were browsing themes - this is how you set that up. Also take note of the order option, because this determines the order your links will show up on the menu. The first page should be “0” and then they go up from there.
You can select “Set featured image” near the bottom of the right side of the Page Editor to add an image to the page. I’m going to upload a picture of Alyson for her Bio page. You could just copy an image directly to your /wp-content/uploads folder, but it’s better to use Wordpress to do it, as it will format it properly and include it in a special “Media Library” that you can use anywhere on your site.
You can change the title for the image, where it links to when you click on it, and how it’s aligned on the page. Once you insert the image, you can click on it and click the “Edit Image” button to tweak it further. It can be a little tricky to get the alignment to work right, but Hopefully you’ll work it out. You might notice that you can’t select a different “Size” option when you upload a new image to a post. This is because we haven’t enabled image editing support in PHP. We’ll get into that later, but for now you’ll just have to resize the images yourself (you can do that in Paint) or use the “Edit Image” button after you’ve inserted the image to resize it in HTML.
I created pages for all of the pages I need to create, and got them all ordered properly. Make sure that when you create a Blog page (which I think you should even if you want it to be the Front Page) just leave the actual content of the page blank.
Now you’ll have a nice looking menu on your site, with all the pages you need. The problem now, though, is that the Front Page is none of these options, which is not only confusing to people visiting the site, but it’s not what I need the site to do. Let’s set this up now, shall we?
Head to the Reading page (under “Settings” in the Dashboard) to control your Front Page. The default is to show your latest posts, which means that it will show your blog. I don’t like this because I believe that every page on the site needs to be clearly represented in the main navigation of the site. What happens if somebody goes to “About” or whatever and then wants to get back to your blog?
Here are the settings I used. I want the front page to be “Home” and the posts page to be “Blog.” That will make much more sense to a visitor.
Now when you go to “localhost:81” you’ll go right to whatever page you selected as your front page, and when you go to “Blog” you’ll see “Nothing Found” because you have no blog entries. Notice that the Front Page (Home) doesn't have a permalink, anymore, because it's just “localhost:81.” We had better do something about that “no blog entries” thing, though.
Part 5 D: Rad Blogojevich
Manage your posts in the Posts section of the Dashboard. Wordpress organizes posts into categories, which you can use if you want, or just leave everything “Uncategorized.” You can also manage the tags you assign to each post.
This is pretty familiar. Writing and editing posts works exactly like pages, so you should be able to handle yourself here if you managed to work with the pages well enough. You can also manage what category and tags are associated with this post on this page.
Part 5 D A: Yet Another PHP Setting

So Wordpress has the ability to rezise images when you upload them. This is a cool feature, because you can upload a huge picture and it will resize it to an appropriate size. You don’t want to make users download huge images, because it will just be slow and obnoxious for no reason. The problem is that this function relies on an extension to PHP that we didn’t activate when we first set up PHP. Do you really need this? Not really, because you’ll have it when you deploy your site to any web server (almost definitely). Any images you want to upload in the meantime you can just resize manually, with Paint or whatever. However, if you really want to use it, I’ll show you how. It’s really easy.

You have to dig up your good old “php.ini” file, which is in C:/php, in case you forgot.
Find the line “;extension=php_gd2.dll” which is in the Dynamic Extensions section. Remove the semicolon from the beginning of that line.
You might as well also increase the maximum upload filesize, which is on the line “upload_max_filesize = 2M” (you can search for File Uploads and scroll down a bit from there). Just blast it up to like 100M (the M is for Megabytes) or something silly like that. There’s no reason why your local testing environment should have a limit to uploaded files. You’ll be hard pressed to upload an image file larger than 100 MB, so that will be more than enough. Save and close php.ini.
Now go to your IIS Manager (inetmgr), find your DefaultAppPool, and recycle it. That will refresh your PHP beeps and boops.
If you still have that phpinfo() file set up on localhost, you can go there and look for the section called “gd.” If the “gd” section is there, you know your system is set up to handle simple image editing.
Part 5 D B: Where Were We?
Okay, so back to the Post section of our Dashboard. I just threw together a simple first post. I’ll now attach a picture to it!
Just hit the “Add Picture” button just above the post area to, well, add a picture. You can add more than one at once.
Next you can fill out the info about the picture. Give the picture a title and a caption if you want. By default the image will link to itsself, so when a user clicks on the picture they’ll just get the picture again. I think this is kind of silly, so unless I want it to link to something, I just click “none” for Link URL. If you did that PHP thing just now, you’ll be able to specify what size to resize the image to. Notice that the original (Full) size is 1341 x 1614, which is really big for a web picture, so I’ll resize to the default Medium size image (those sizes are adjustable in the Dashboard Settings). You can make it the featured image if you want - some Wordpress themes can use the featured images as thumbnails for the post - or just insert it into the post.
You can hit “Add New Category” under Categories to assign this (or any post) to a new category besides “Uncategorized.” You can also make a category a subcategory to another category by using the dropdown box there. You can also, also assign a post to multiple categories. You can really go nuts with the whole categories thing.
Use the “Tags” section to add (or remove) tags from the post. Once you get a few posts under your belt, you can add tags based on tags you’ve used before, which is kind of the whole point of tags.
Once you publish your post, you’ll be able to see it on your blog page. All themes are a little different about how they display posts, so your experience may vary a little. The theme I’m using here doesn’t show the tags, but you can see the category down there (although when you click on the post title to see the full post with comments you get the tags). Also notice that this post was “by Admin” because I posted it with the Admin account.
Head to the Media Library (“Media” > “Library”) to see all of the images you’ve uploaded to your site, either through pages, blog posts, directly through here, or elsewhere. You can use “Add new” to upload more images if you want (which you can then reference in your styles or something).
When you select “Upload / Insert picture” when you’re working on a blog post, you can switch to the “Media Library” tab of the box that pops up to insert a picture that you’ve already uploaded through the Dashboard.

So now your website is basically a real, live website. It’s fully functional, has plenty of delicious content, and has a unique (ish) theme that you picked out yourself. It’s just that it’s not . . . perfect, is it? There are still some weird things that we don’t really want here or there, and there’s no setting for them in the Dashboard. What do we do? Looks like we’re going to have to get a bit more serious with Wordpress’s’ beeps and boops. It’s time to teach this website who’s the boss of it, and that boss’s’ name is YOU.

We’re (hopefully) only two posts away from being done with this guide, and then normal operation will resume on DenyConformity.com.

Please wait...
advertise here!
Top
click for gallery
order a print
close
<
>
order a print