New web-page features... [What do I need to know?]

Discussion in 'Software' started by Kibble, Jan 23, 2007.

  1. Kibble

    Kibble Private First Class

    Hey guys,

    I am looking to start a volunteer project (for my church), and I want to create a web-site with quite a few features I don't really know how to implement (or at least, implement smoothly). The page is basically going to be a multimedia hub, where people can go and check out pictures and video that I post on the web-site, and a place to go to check the calendar and read up on news.

    I have a fairly strong understanding of HTML, and I can use Flash and Photoshop to cover the graphical aspects, but I have some concerns as to what I am going to need to know to make some of the planned features work. Here are a few things I have in mind...

    Forums:
    I have heard of quite a few ways to do this, and heard about a number of free php boards that are fairly good. I don't expect to be able to program a forum myself at this point, so can anyone direct me to some decent ones? I'm not a totally n00b, so I should be able to figure the coding out and be able to integrate it.

    Video Player:
    I want to have videos streamable from the web-site, but I think it would be best done as a separate pop-up window rather than loading it inside the page. How would I go about scripting a movie player in a separate window to play whatever link is clicked on in the main frame, but have the window at a fixed box size so it can't be resized or maximized?

    Photo Album:
    For an example of the complexity of my albums to date... (http://www.artexfab.com/Equipment/ctimages.htm). I am still stuck in the whole 'make a new HTML page for every image' thing, and I KNOW there has to be a better way. Any suggestions/tutorials I could learn off of?

    Thanks in advance for the help guys. I just want to know what direction I should be aiming my efforts if I want to get more into this stuff, and what I should know before taking on something like this, that I haven't done before.

    Regards,

    --Kibb
     
  2. Mada_Milty

    Mada_Milty MajorGeek

    There's two that I can think of off the top, first being VBulletin which I believe is what the Majorgeeks forums use. There's also PHPBB which is freeware.

    VLC Media Player ships with a little HTTP server integrated. It is used both to stream using HTTP, and for the HTTP remote control interface. (It is also very portable across different operating systems.)

    See the online documentation on embedding it into a webpage.

    You make a new page for EVERY image? Wow... it's not difficult to create thumbnail images. It would be as easy as creating image links with a small height and width, and having them link to the path of the file itself. Then, when you click the thumbnail, it would open the fill at full size. If you wanted, you could even make it open in a new tab/window with a little javascript. Here's code that works well for me:

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <link rel="stylesheet" type="text/css" href="style.css" />
    <title>CGL Manufacturing, Ltd.</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <script type="text/javascript">
    	<!--
    	function part_link(){window.open ("images/gearhousing.jpg")}
    	//-->
    </script>
    </head>
    
    <body>
    <a href="javascript: part_link()"><img align="left" src="images/gearhousing.jpg" alt="Gear Housing" height="100px" width="100px"/></a>
    </body>
    </html>

    This is a simple webpage with a 100 pixel * 100 pixel image. When you click the image, you get a new window with the fullsize image in it.

    The best reference I can point you to is http://www.w3schools.com This has all the information on HTML, PHP, Javascript and SQL that you could need. Free tutorials on all these languages and more!
     
  3. Kibble

    Kibble Private First Class

    Nice! That's perfect! Thank you so much ;D

    I'll try and put something together tonight and I'll come back with some questions, but the feedback is invaluable. I'll keep you posted. ;D

    Thanks!

    --Kibb
     
  4. Kibble

    Kibble Private First Class

    One thing...

    As an example site, I'm going to use http://www.vgcats.com/. (Web-comic).

    The way his site is lined up is great. It scales on the sides if your resolution is big, it seems to have a nice graphical functionality, while still having some sort of programming thing going on for his news page (with the date and exact time posted, that kind of thing).

    For the news page and text fields, is that type of data entry a .php thing? I have no idea what language I'd have to learn to do something like that, but it's awesome.

    I don't know what you'd classify a site like that as, but I think that's a great interface.

    --Kibb
     
  5. Mada_Milty

    Mada_Milty MajorGeek

    This could be a PHP thing. It does sort of have the look like it is connected to a database of articles, but it doesn't necessarily have to be. This layout could be easily generated using just CSS and HTML.

    The sides resizing is a common CSS technique. I found a great article on it at alistapart.com. You can see it at this link. This describes in detail how to create the 3 column layout like the author of your link has done.
     

MajorGeeks.Com Menu

Downloads All In One Tweaks \ Android \ Anti-Malware \ Anti-Virus \ Appearance \ Backup \ Browsers \ CD\DVD\Blu-Ray \ Covert Ops \ Drive Utilities \ Drivers \ Graphics \ Internet Tools \ Multimedia \ Networking \ Office Tools \ PC Games \ System Tools \ Mac/Apple/Ipad Downloads

Other News: Top Downloads \ News (Tech) \ Off Base (Other Websites News) \ Way Off Base (Offbeat Stories and Pics)

Social: Facebook \ YouTube \ Twitter \ Tumblr \ Pintrest \ RSS Feeds