Creating your own blog

[melkior_inactive]

OK, did you ever think about creating your own blog?

I know it sounds complicated but it's not. You need a database, and a couple of PHP files to start.
The idea of this thread is to create a simple blog step by step.
First we'll create a database, a simple backend and a simple CSS style.
Later we'll expand all of this, add new functions, effects, enhace the look of the blog and so on.

This thread will be updated at least once a week with new functions for the blog until we end up with a completely finished blog application.

Once finalized this blog could power your personal blog.

I know there are many free blog solutions available on the net and they all have more features than this blog will ever have (unless I get a very large open source development community ), but creating your own blog would give your site a unique look and feel. And this script, once written can be easily modified to act as a CMS.

OK, this was the intro. First lesson tomorrow.

 

[UK WW ex member]

Hi Very intersting ,posting here to subscribe the thread and be informed the progress.

Wishing you good luck

 

[Bisje]

And I post for exactly the same reason
Looking forward to the first lesson ! Great idea.

 

[Nonactiveuser8999]

melkior that is a great idea maybe we can all contribute to this project

 

[melkior_inactive]

Well, when the blog is finished anyone can expand it as he sees fit.
The base idea of this thread is for it to be a tutorial for now.
But thanks for your offer.

 

[Nonactiveuser8999]

Ok I guess I didn't read very good the first post anyway I'll keep an eye on this thread

 

[melkior_inactive]

Lesson 1 - The Theory

Well seeing that this thread caused interest I better move along.
Well, first of all, let me tell you that this tutorial will be written for those who have an elementary knowledge of PHP, HTML and MySQL although it's not necessary.
I'll try to keep it as simple as possible and you can ask me about the details on any part of this project anyway.

OK, a little bit of theory for a start.
The logic behind the basic functions of a blog is fairly simple:
Each blog consists of 3 parts (2 if you divide them by type). First part is the user interface. In this case it'll be a collection of PHP scripts which will work as a whole to generate the pages for the visitors to view.
Second part of the blog is the administration control panel which allows the admin (in this case you) to add new posts, add links to the blogroll and so on.
And the final, third part is the database. The database contains all the posts, links and everything else in your blog.
These 3 parts interact together and create what we call a blog.
The user interface fetches the data from the database and formats it as a webpage, while the admin control panel inserts the data into the database.

OK, next post -- some real programming.

 

[melkior_inactive]

Lesson 2 - The Database

Before writing any code we need to design the database cause we really need to know what data we'll be using in the script and also what functions we'll need to create.

We'll start with a simple database - it will use only one table. We don't need too much at first anyway.
We'll need a date on the posts, their titles, the text in the post and we'll add an ID for the posts (we'll need that later).
So here's the SQL code for creating the table. You can run this query in phpmyadmin after creating the database or import it or whatever suits you.

CREATE TABLE `blog` (
`id` INT( 128 ) NOT NULL AUTO_INCREMENT PRIMARY KEY ,
`date` TIMESTAMP NOT NULL ,
`title` VARCHAR( 100 ) NOT NULL ,
`text` TEXT NOT NULL
);

So now we have a table named blog ready for our inputs.
We'll be expanding this database in future tutorials.

 

[melkior_inactive]

Lesson 3 - First PHP code

Now that we have a database ready we need something to input the data and something to display the data from the database.

First, what we'll do is create a config.php file. It will include settings for the database connection and some other configuration info.
Here's the code:

<?php

$dbuser = 'username'; //database username
$dbname = 'blog'; // database name
$dbpass = 'password'; //database password
$dbhost = 'localhost'; //database host -- usually 'localhost' but best to check with your host

$sitename = 'My Blog'; //name of your site

mysql_connect($dbhost, $dbuser, $dbpass);
mysql_select_db($dbname);

?>

We'll include this file in our other files in the next step.

 

[melkior_inactive]

Well, we have the config file.
We need something that will display our blog.
We need to create an index.php file.
This is the source code:

<?php

include ("config.php");

?>

<HTML>
    <HEAD>
        <TITLE><?php echo $sitename; ?></TITLE>
    </HEAD>
    <BODY>
        <H1><?php echo $sitename; ?></H1>
        <?php
        $sql ="SELECT * FROM blog ORDER BY id DESC LIMIT 10";
        $result=mysql_query($sql);
        while ($record = mysql_fetch_object($result)) {
        echo "<dt><b>$record->title</b></dt>";
        echo "<em>$record->date</em>";
        echo "<dd>$record->text</dd>";
        echo "<p></p>";
        }
        ?>
    </BODY>
</HTML>

<?php

mysql_close();

?>

We start by including the data from the config file which also manages connecting to the database for us.
After that we switch to HTML to format a normal web page but we include dynamic content.
We use the PHP echo statement to write out the name of the site in the header and also in the first line after the opening BODY tag. The name is taken from the $sitename variable in the config.php file.
We again switch to PHP in the body section to select all the data from the database, we use a while loop to continue fetching data until we reach the end of the database. We order it by the id stored in the database and it's descending (to show the latest posts first). We're also limiting the selection to 10 entries.
The retrieved data is stored in the $record and we can access the parts we need by writing $record->name_of_what_we_need
So we write out the data, first the title, than the date and finally the post itself. We format it with a little bit of HTML and that's it.
Later today I'll post the source code of the script we'll use to insert data, and set up a live example.

 

[melkior_inactive]

OK, time to create a script that will add our posts to the database.
For now, we'll call it administration.php
And this is the source:

<?php

include ("config.php");
if ($HTTP_POST_VARS['add']) {
  $title=$HTTP_POST_VARS['title'];
  $text=$HTTP_POST_VARS['text'];
  $sql ="INSERT INTO blog (title, text) VALUES ('$title', '$text')";
  $result=mysql_query($sql);
  if ($result) echo "<b>New post added!</b>";
  else echo "<b>Could not post!</b>";
  }
?>

<HTML>
    <HEAD>
        <TITLE><?php echo $sitename; ?> Admin CP</TITLE>
    </HEAD>
    <BODY>
        <H1>Add a new post</H1>
        <form method="POST" action="administration.php">
        <b>Title:</b><br>
        <input type="text" name="title"><br>
        <b>Entry:</b><br>
        <textarea cols="60" rows="6" name="text"></textarea><br>
        <input type="submit" name="add" value="Add">
        </form>
    </BODY>
</HTML>

<?php

mysql_close();

?>

Again, this is a very simple piece of code. It features a submit form and a small script to add posts.
In the first part we include the config.php file again. And then we tell the script that if the form has been submitted it should get the title and the text that was submitted and we insert it into the database.
If it's OK we output a success message and if something went wrong we print out an error message.
The rest is simple HTML (with a dynamic title according to the config.php file) and a form that submits the title and the text of the post.
At the end we close the connection to the database.
That's it! Note that your "Admin CP" isn't protected at all at this stage so anyone who knows the URL to it can add data. But we aren't concerned about this at this stage. We'll mess with security later.

 

[melkior_inactive]

Well, now that the phase 1 of designing our own blog is finished here's the live demo:

This is the blog itself:
http://forums.ukwebmasterworld.com/blog-tutorial/01/index.php

And this is the Admin CP (it has been disabled to prevent spam but you can at least see what it looks like):
http://forums.ukwebmasterworld.com/blog-tutorial/01/administration.php

I know it's nothing fancy but why kill ourselves designing something that isn't finished?

Next lesson will include some CSS (so your retinas don't burn from looking at this site) and we'll be adding some new functions. Expect it in a couple of days (maybe even tomorrow).

Oh, almost forgot. Here's the link so you can download the source code we've created so far:
Download!

 

[Bisje]

Hi Melkior,

Don't want to put pressure on you, far from that, but I was wondering if you intend to continue this tutorial.

I found it simple and clear (just what I need ) until now and I surely hope you will continue with it.

Thanks for the job so far :armada34:

 

[melkior_inactive]

I'm glad you like it Eric!

Yes, I'll continue with this tutorial, tomorrow. I had some issues that detained me in continuing this tutorial.

Now that I'm free again I will continue and speed up the pace a little bit.

Thanks for your patience!

 

[Bisje]

Great, I'm looking forward reading you

 

[lala56]

Melkior,

Cannot wait for you next post. Thank you for your valuable contributions. If we would not have nice chaps like you we really would be lost in the dark;-)

lala

 

[melkior_inactive]

Well, as you know we're working on a competition called POSTFest and it's tomorrow so just a little more patience and after the POSTFest is finished and the winner is announced I'll continue this tutorial.

 

[lala56]

Can you tell me your secret how you manage to do all this? It is amazing how much you contribute to the UKWebmasterWorld and and and. Wish I would have the same skills... Well done!!!!!!

lala