InsaneJournal

Tweak says, "Have fun storming the castle!"

⁝ (drunkenough) wrote in rp_tutorials,
@ 2011-05-22 16:20:00

Entry tags:

coding: other, layouts: fansites

Discussion Forum Code
I don't know if anyone will ever have a use for this or not, but I was going through some of my codes and thought I might as well post this. It's made to look like a discussion board---like you'd see on proboards, fansites, etc. In our band!psl, my friend and I used it as part of a faux website for the record company. If you wanted to be creative, I think it would be pretty easy to customize this so that it works as a game info navigation or an activity check.

... I don't know. But here it is if anyone ever has a use for it! Larger preview, instructions, and code are behind the cut.

⇧ BOARD INDEX HOME ARCHIVE SEARCH F.A.Q. LOGIN REGISTER
TITLE GOES HERE		TOPICS	POSTS	LAST UPDATED
	Topic Write a sentence about [...] here.	#	#	by drunkenough on April 17, 2011
	Topic Write a sentence about [...] here.	#	#	by drunkenough on Feb. 28, 2011
	Topic Write a sentence about [...] here.	#	#	by drunkenough on April 17, 2011
	Topic Write a sentence about [...] here.	#	#	by drunkenough on Feb. 28, 2011
	Topic Write a sentence about [...] here.	#	#	by drunkenough on April 17, 2011
	Topic Write a sentence about [...] here.	#	#	by drunkenough on Feb. 28, 2011
	Topic Write a sentence about [...] here.	#	#	by drunkenough on April 17, 2011
	Topic Write a sentence about [...] here.	#	#	by drunkenough on Feb. 28, 2011
	Topic Write a sentence about [...] here.	#	#	by drunkenough on April 17, 2011
	Topic Write a sentence about [...] here.	#	#	by drunkenough on Feb. 28, 2011
	Topic Write a sentence about [...] here.	#	#	by drunkenough on April 17, 2011
	Topic Write a sentence about [...] here.	#	#	by drunkenough on Feb. 28, 2011
	Topic Write a sentence about [...] here.	#	#	by drunkenough on April 17, 2011
	Topic Write a sentence about [...] here.	#	#	by drunkenough on Feb. 28, 2011
RETURN TO TOP ©

Rules & Directions

Save all images and upload them to your own server.
Modify away, and let me know if you have any questions or issues about the code! I'll be happy to help out if I need to. :)
The "topic" names are all links. The buttons across the top ("home," "search," etc.) are also links and include an option to add hover text.
!!! Most importantly: You MUST disable auto-formatting or the code will not display properly.

The Code:
<a name="top"> </a><table align="center" width="675" bgcolor="" style="margin-bottom: 0px;" cellpadding="7" cellspacing="2"><tr bgcolor="#B7B7B7"><td valign="top" colspan="7"><a name="" style="text-decoration: none">⇧ BOARD INDEX</a> <div style="border: 1px solid white;"></div> <img src="http://i310.photobucket.com/albums/kk420/bscgirl10/Tiny%20Icons/house.png"><a href="" style="text-decoration: none;" title="">HOME</a> <img src="http://i310.photobucket.com/albums/kk420/bscgirl10/Tiny%20Icons/calendar.png"><a href="" style="text-decoration: none;" title="">ARCHIVE</a> <img src="http://i310.photobucket.com/albums/kk420/bscgirl10/Tiny%20Icons/find-1.png"><a href="" style="text-decoration: none;" title="">SEARCH</a> <img src="http://i310.photobucket.com/albums/kk420/bscgirl10/Tiny%20Icons/help.png"><a href="" style="text-decoration: none;" title="">F.A.Q.</a> <img src="http://i310.photobucket.com/albums/kk420/bscgirl10/Tiny%20Icons/lock.png"><a href="" style="text-decoration: none;" title="">LOGIN</a> <img src="http://i310.photobucket.com/albums/kk420/bscgirl10/Tiny%20Icons/group.png"><a href="" style="text-decoration: none;" title="">REGISTER</a></td></tr> <tr bgcolor="#898989"><td valign="top" colspan="4" width="265">TITLE GOES HERE</td> <td width="" colspan="1"><center>TOPICS</center></td> <td width="" colspan="1"><center>POSTS</center></td> <td width="175" colspan="1"><center>LAST UPDATED</center></td></tr> <tr bgcolor="#d7d7d7"><td valign="justify" colspan="1" width="15"><img src="http://i310.photobucket.com/albums/kk420/bscgirl10/Tiny%20Icons/application_double.png"></td> <td valign="top" colspan="3" width="250"><a href="" style="text-decoration: none;">Topic</a> Write a sentence about [...] here.</td> <td align="center">#</td> <td align="center">#</td> <td>by drunkenough on April 17, 2011</td> </tr> <tr bgcolor="#ececec"><td valign="justify" colspan="1" width="15"><img src="http://i310.photobucket.com/albums/kk420/bscgirl10/Tiny%20Icons/application_double.png"></td> <td valign="top" colspan="3" width="250"><a href="" style="text-decoration: none;">Topic</a> Write a sentence about [...] here.</td> <td align="center">#</td> <td align="center">#</td> <td>by drunkenough on Feb. 28, 2011</td> </tr> <tr bgcolor="#d7d7d7"><td valign="justify" colspan="1" width="15"><img src="http://i310.photobucket.com/albums/kk420/bscgirl10/Tiny%20Icons/application_double.png"></td> <td valign="top" colspan="3" width="250"><a href="" style="text-decoration: none;">Topic</a> Write a sentence about [...] here.</td> <td align="center">#</td> <td align="center">#</td> <td>by drunkenough on April 17, 2011</td> </tr> <tr bgcolor="#ececec"><td valign="justify" colspan="1" width="15"><img src="http://i310.photobucket.com/albums/kk420/bscgirl10/Tiny%20Icons/application_double.png"></td> <td valign="top" colspan="3" width="250"><a href="" style="text-decoration: none;">Topic</a> Write a sentence about [...] here.</td> <td align="center">#</td> <td align="center">#</td> <td>by drunkenough on Feb. 28, 2011</td> </tr> <tr bgcolor="#d7d7d7"><td valign="justify" colspan="1" width="15"><img src="http://i310.photobucket.com/albums/kk420/bscgirl10/Tiny%20Icons/application_double.png"></td> <td valign="top" colspan="3" width="250"><a href="" style="text-decoration: none;">Topic</a> Write a sentence about [...] here.</td> <td align="center">#</td> <td align="center">#</td> <td>by drunkenough on April 17, 2011</td> </tr> <tr bgcolor="#ececec"><td valign="justify" colspan="1" width="15"><img src="http://i310.photobucket.com/albums/kk420/bscgirl10/Tiny%20Icons/application_double.png"></td> <td valign="top" colspan="3" width="250"><a href="" style="text-decoration: none;">Topic</a> Write a sentence about [...] here.</td> <td align="center">#</td> <td align="center">#</td> <td>by drunkenough on Feb. 28, 2011</td> </tr> <tr bgcolor="#d7d7d7"><td valign="justify" colspan="1" width="15"><img src="http://i310.photobucket.com/albums/kk420/bscgirl10/Tiny%20Icons/application_double.png"></td> <td valign="top" colspan="3" width="250"><a href="" style="text-decoration: none;">Topic</a> Write a sentence about [...] here.</td> <td align="center">#</td> <td align="center">#</td> <td>by drunkenough on April 17, 2011</td> </tr> <tr bgcolor="#ececec"><td valign="justify" colspan="1" width="15"><img src="http://i310.photobucket.com/albums/kk420/bscgirl10/Tiny%20Icons/application_double.png"></td> <td valign="top" colspan="3" width="250"><a href="" style="text-decoration: none;">Topic</a> Write a sentence about [...] here.</td> <td align="center">#</td> <td align="center">#</td> <td>by drunkenough on Feb. 28, 2011</td> </tr> <tr bgcolor="#d7d7d7"><td valign="justify" colspan="1" width="15"><img src="http://i310.photobucket.com/albums/kk420/bscgirl10/Tiny%20Icons/application_double.png"></td> <td valign="top" colspan="3" width="250"><a href="" style="text-decoration: none;">Topic</a> Write a sentence about [...] here.</td> <td align="center">#</td> <td align="center">#</td> <td>by drunkenough on April 17, 2011</td> </tr> <tr bgcolor="#ececec"><td valign="justify" colspan="1" width="15"><img src="http://i310.photobucket.com/albums/kk420/bscgirl10/Tiny%20Icons/application_double.png"></td> <td valign="top" colspan="3" width="250"><a href="" style="text-decoration: none;">Topic</a> Write a sentence about [...] here.</td> <td align="center">#</td> <td align="center">#</td> <td>by drunkenough on Feb. 28, 2011</td> </tr> <tr bgcolor="#d7d7d7"><td valign="justify" colspan="1" width="15"><img src="http://i310.photobucket.com/albums/kk420/bscgirl10/Tiny%20Icons/application_double.png"></td> <td valign="top" colspan="3" width="250"><a href="" style="text-decoration: none;">Topic</a> Write a sentence about [...] here.</td> <td align="center">#</td> <td align="center">#</td> <td>by drunkenough on April 17, 2011</td> </tr> <tr bgcolor="#ececec"><td valign="justify" colspan="1" width="15"><img src="http://i310.photobucket.com/albums/kk420/bscgirl10/Tiny%20Icons/application_double.png"></td> <td valign="top" colspan="3" width="250"><a href="" style="text-decoration: none;">Topic</a> Write a sentence about [...] here.</td> <td align="center">#</td> <td align="center">#</td> <td>by drunkenough on Feb. 28, 2011</td> </tr> <tr bgcolor="#d7d7d7"><td valign="justify" colspan="1" width="15"><img src="http://i310.photobucket.com/albums/kk420/bscgirl10/Tiny%20Icons/application_double.png"></td> <td valign="top" colspan="3" width="250"><a href="" style="text-decoration: none;">Topic</a> Write a sentence about [...] here.</td> <td align="center">#</td> <td align="center">#</td> <td>by drunkenough on April 17, 2011</td> </tr> <tr bgcolor="#ececec"><td valign="justify" colspan="1" width="15"><img src="http://i310.photobucket.com/albums/kk420/bscgirl10/Tiny%20Icons/application_double.png"></td> <td valign="top" colspan="3" width="250"><a href="" style="text-decoration: none;">Topic</a> Write a sentence about [...] here.</td> <td align="center">#</td> <td align="center">#</td> <td>by drunkenough on Feb. 28, 2011</td> </tr> <tr bgcolor="#898989"><td colspan="7" align="right" valign="top"><a href="#top" style="text-decoration: none;">RETURN TO TOP</a> <a href="http://asylums.insanejournal.com/rp_tutorials/173241.html#cutid1" style="text-decoration: none;">©</a></td></tr></table></lj-cut>

The Code to Add a New Light Gray (#d7d7d7) Section:
<tr bgcolor="#d7d7d7"><td valign="justify" colspan="1" width="15"><img src="http://i310.photobucket.com/albums/kk420/bscgirl10/Tiny%20Icons/application_double.png"></td> <td valign="top" colspan="3" width="250"><a href="" style="text-decoration: none;">Topic</a> Write a sentence about [...] here.</td> <td align="center">#</td> <td align="center">#</td> <td>by drunkenough on April 17, 2011</td> </tr>

The Code to Add a New Dark Gray (#ececec) Section:
<tr bgcolor="#ececec"><td valign="justify" colspan="1" width="15"><img src="http://i310.photobucket.com/albums/kk420/bscgirl10/Tiny%20Icons/application_double.png"></td> <td valign="top" colspan="3" width="250"><a href="" style="text-decoration: none;">Topic</a> Write a sentence about [...] here.</td> <td align="center">#</td> <td align="center">#</td> <td>by drunkenough on Feb. 28, 2011</td> </tr>

(Post a new comment)

	tugboatssing 2011-05-22 08:31 pm UTC (link)
	I think this will come in handy for a game I'm working on reopening as before there was a fake website set up by an NPC for the characters to discuss certain changes going on in the world. I'm definitely bookmarking this to show the other mod, thank you so much for sharing! (Reply to this) (Thread)

	drunkenough 2011-05-22 11:32 pm UTC (link)
	You're welcome. <3♥ I'm glad someone else might actually have a use for it! :D (Reply to this) (Parent)

	barrel_of_pbs 2011-05-23 12:01 am UTC (link)
	This is awesome. Great work! (Reply to this)

	forsythia 2011-05-26 04:15 am UTC (link)
	I love this! I don't really have a reason or place to use it, but still... Very convincing as a forum - and one of the well-styled ones, at that. :) (Reply to this)