How To Develop Your Very Own PHP Game
Tutorial on making a PHP game, from scratch :)

Step 2b: Understanding HTML (part 2)

By justImagine
The post earlier had some basic HTML you'll need, like Bold Text, or Italic Text, or making a link, or making some settings over a text.
But in real game, you'll need a lot more.
Which is why the post is here. I'll write these down before I forgot.






























Tag

Result

<form>

*It's incomplete. It needs sub-tags to add the content.*

<input>

*Incomplete. It needs parameters. Explained below. It's sub-tag for <form>.*

<textarea>Text</textarea>


*It's another sub-tag for <form>.*

Text<br />Text 2

Text
Text 2

Text</p>Text 2

Text

Text 2

<hr>





Tips:
  • The <form> tag ends with </form>. But be sure to have the <input> or <textarea> before the end tag, because when you click the Submit button, all data from the form tag will be sent, based on the method sent.
  • There are 2 data sending methods for <form> which are POST and GET. POST method sends the data through the server, so it's 'invisible'. While the GET method sends the data through URL (URL rewriting). This could be useful in some cases.
  • <input> tag had many kinds. You can add parameters to determine its type. Like, add type="text" to make a one-line text entry (e.g. for Username field in Login form). The type="password" makes a password input field. type="submit" type makes a button that sends all the input data from the <form> tag to the </form> tag end. The type="reset" resets all the data input within the two form tags. While type="image" makes an image that works as the type="submit" button (sends all form fields through one of the methods to be processed). Check Archaeozoic Area, then when you can view the whole Home page, right click anywhere and choose 'View page source...', locate the form or input tags, and see what they made. Then choose Register, and do the same. This will get you even deeper understanding about the tags for the form. THESE TAGS ARE VITAL FOR GAMES.
 

The Basic Step That's Almost Unposted!

By justImagine
Almost forgot to post this one! Before you start making your game, it is very recommended to write down your ideas in a piece of paper, or type them down on MS word. For example, you want the multiplayer battle feature in your game where the player must choose the enemy first. You'll need a name for the feature, because 'Multiplayer Battle' on the menu just sounded pretty dull. So, you might want to name it 'Battlefield', or 'Asteron Arena' (for outer space themed games), or stuffs you can create on your own. Then the facilities headquarter, you may name it 'Kingdom' (like in Dracoterra), or 'Camps' (like in Archaeozoic Area), or 'Headquarters', or 'Ship Stations' (like in Operation H.E.L.D), or such stuff.
Now, while your ideas are popping out like popcorns, write them down quickly! Now that you have the basics you'll need, we can start from the beginning (check Step 1: Preparing the CSS Files to start making the layout for your game).
 

Step 2: Understanding HTML

By justImagine
HTML is the very basic of web programming. Try not to use Dreamweaver, because it'll make you less creative. Try Notepad or the web host's file editor instead.
Here is the list of some tags you'll need to understand:
























Tag

Result

<b>Text</b>

Text

<i>Text</i>

Text

<a href="http://archaeozoic-area.6te.net/">Link Text</a>

Link Text

<font size="3" color="#ff0000">Big Red Text</font>

Big Red Text

<img src="http://archaeozoic-area.6te.net/php_icon.gif" />




Tips:
  • On the link codes, you can add target="_blank" after the href="http://web_address" to make the link opens in new tab or window when clicked. And, in this game tutorial, instead of href="http://complete_web_address" we'll use href="filename_in_the_same_root_folder_(same_site)". It'll make the link shorter, but as functional as it is supposed to be.
  • On the font settings, you can change the size as you wish. You could also set it through the CSS, so you don't have to add <font> tags each time you type some text on the game-making progress. Then, the color can use hexa-based color chart like in the example (#RRBBGG), or it can use texts like color="red". *R: red, B: blue, G: green. Here's the chart: http://www.web-source.net/216_color_chart.htm
 

How to Make Your Game? Step 1: Prepare the CSS Files

By justImagine
It's easy to ask yourself whether you can make your very own game, but could you do it for real?
I'd say, yes.
I'll give you some 'how-to's about making games, based on 3 Languages you'll need a lot:
  • HTML (of course, it's the basic)
  • CSS (you don't want your page to be dry, do you?)
  • PHP (without this thing, your game interacts NOT)
So, first I'd recommend you to find the images you'll need for your game (including background, content background, sidebar background, splash, and stuff. Maybe even your company logo), make some splash text and save it (can either be in MS Word or Notepad, or such program) then check this page: http://www.subcide.com/articles/creating-a-css-layout-from-scratch/

Trust me, although it says it's out of date, it's VERY useful. Make your own CSS for the home page and stuff, and save it in the folder /css and name it style.css. Then make another CSS file, this time, make a layout for your game (with sidebar, link settings, table settings, and stuff that a game interface would have), and save it in the same folder with the name style-game.css, and if you're finished, you already had one step forward.

Tips: It is HIGHLY recommended to use link colors that match the theme of your game, and the background of your game's content holder (<div id="content">_game_contents_</div>). E.g. the game theme is jungle, the color is dark, then you can use #00FF00 green as the link color.