In a few threads i will be taking people through creating their own advanced news system. I will also include annotations for novice and newbie php coders.
First off we will need a template. i will also teach you how to create a simple layout...
if there are numbers in brackets that means the step number.
Here i will go through whats new and whats updated..
As they get completed i will post hyperlinks to the thread with that part.
The reason why they will be in different threads is because i wont be doing them all at one time.
Part One = Creating the Layout DONE!
Part Two = Coding The Login System DONE!
Part Three = Coding The Add News System
Part Four = Coding The Add User System
Part Five = Coding The Commenting System
Part Six = Coding The News Portal
Part One - Creating your news system layout
[1] Open up Dreamweaver or a similar editor. If you dont have dreamweaver then you can download a free trial version from
www.macromedia.com
[2] Create a new Html File.
[3] Make sure you are on design mode then go to page properties (near the bottom of the screen)
Change:
Left Margin: 50 Pixels
Right Margin: 50 Pixels
Top Margin: 50 Pixels
Bottom Margin: 50 Pixels
[4] Select Insert > Table from the menu at the top of the screen.
Change The Following:
Rows: One
Columns: One
Table Width: 100 Percent
Border Thickness: 0
Cell Padding: 5
Cell Spacing: 0
Then Select
OK
[4] In the menu at the top of the screen select view > code
you will have something like this:
Code:
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td> </td>
</tr>
</table>
change it to
Code:
<div style="border-style: solid; border-width: 1px"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td> </td>
</tr>
</table></div>
That will add a ncie 1 pixel border around your table
[5] From the top menu select view but this time choose design. to go back to the design view.
click inside the table that you just created. at the bottom of the screen you should see a setting that says height make the height setting to 60px. then choose a background colour of #99CCFF.
If you have a logo you can use that or you can enter the name of either the news script or your sites title.
Im going to use YCNews. Then i entered two spaces next to it. NOTE: if it wont let you type the spaces then go back to the code view and enter
Twice.
[6]
Right click on your table and choose table > insert rows or columns. Slect insert 1 row below the selection.
If it isnt already click inside the newly created row. Now at the bottom of the screen change the background colour to a nice #CFECEC or a colour of your choice.
[7]
At the bottom you should see a button saying align center click that then from the menu at the top click insert > form > form
Create a new table inside the form but this time select columns 2 and rows 3
also, make sure the table width is only 25%.
If you want you can add a few lines above and below the table.
Inside the first row enter
enter username in the first columns
and for the second go to insert > form > text field.
You may also choose an appropriate font.
For the second row do exactly the same but change username to password.
Then on the table right at the bottom you should see a radio button saying password. That just makes the password masked.
Highlight the bottom row (including the two cells) then right click select table > merge cells
this will make both of the columns one row. again select the align center button then in the menu at the top go to insert > form > button it should already say submit.
Ill show you what i have so far anyway.
Because of the large image due to my screen resolution i will post a link for you..
http://i4.photobucket.com/albums/y10...daw/screen.png
That Concludes part one anyway. Look forward to the next tutorial.
For now save that file in a directory somewhere i have a work folder.