HTML - Help With Tutorials And A Template.
Hello,
I downloaded a couple of templates a week ago, thinking I could use them to base my site (which is just going to be a simple, personal site) off of them. However, I seem to hit a complete blank in knowing what any of it means! I've done some html sites before, albeit about 6 years ago and I don't remember much of what I did then. So when I looked at these templates and tried to work with them I was just perplexed just how to go about changing it to do what I want.. I was wondering if anyone would know of any tutorials, very good ones that go into detail about the code the templates use. The code for one of the templates is below, the other uses the same style. One thing I am quite frustrated with is that every link simply links to the whole main page and brings it all up again, so in effect I would have to have several copies of the main page. I would like so that all links simply bring the information up in the lower left part of the page (below the "Maecenas" link). I have used iframes for that in the past, however I can't remember how, or how with this style of code. I've also been told that ALL frames should be totally avoided, including iFrames! (I thought it was just the normal frames..). So if anyone would be able to help me out with this, it would be very much appreciated. Thanks, Pete Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"/> <meta name="description" content="description"/> <meta name="keywords" content="keywords"/> <meta name="author" content="author"/> <link rel="stylesheet" type="text/css" href="default.css"/> <title>Deep Red</title> </head> <body> <div class="main"> <div class="main_left"> <div class="header"> <h1><a href="index.html">Deep Red</a></h1> </div> <div target="_blank" class="link_menu"> <a href="index.html" accesskey="1">Vestibulum</a> <a href="index.html" accesskey="2">Suspendisse</a> <a href="index.html" accesskey="3">Elemen</a> <a href="index.html" accesskey="4">Maecenas</a> </div> <div class="content"> <h1>Porttitor posuere</h1> <div class="descr">Jun 13, 2006 by Vulputate</div> <p>In hac habitasse platea dictumst. Duis porttitor. Sed vulputate elementum nisl. Vivamus et mi at arcu mattis iaculis. Nullam posuere tristique tortor. In bibendum. Aenean ornare, <a href="index.html">nunc eget pretium</a> porttitor, sem est pretium leo, non euismod nulla dui non diam. Pellentesque dictum faucibus leo. Vestibulum ac ante. Sed in est.</p> <blockquote><p>Sed sodales nisl sit amet augue. Donec ultrices, augue ullamcorper posuere laoreet, turpis massa tristique justo, sed egestas metus magna sed purus.</p></blockquote> <p>Aliquam risus justo, mollis in, laoreet a, consectetuer nec, risus. Nunc blandit sodales lacus. Nam luctus semper mi. In eu diam.</p> <p>Fusce porta pede nec eros. Maecenas ipsum sem, interdum non, aliquam vitae, interdum nec, metus. Maecenas ornare lobortis risus. Etiam placerat varius mauris. Maecenas viverra. Sed feugiat. Donec mattis <a href="index.html">quam aliquam</a> risus. Nulla non felis sollicitudin urna blandit egestas. Integer et libero varius pede tristique ultricies. Cras nisl. Proin quis massa semper felis euismod ultricies. </p> <h1>Adipiscing</h1> <div class="descr">Jun 11, 2006 by Laoreet</div> <p>Aliquam risus justo, mollis in, laoreet a, consectetuer nec, risus. Nunc blandit sodales lacus. Nam luctus semper mi. In eu diam. Phasellus rutrum elit vel nisi. Cras mauris nulla, egestas quis, cursus at, venenatis ac, ante. Fusce accumsan enim et arcu. Duis sagittis libero at lacus. Suspendisse lacinia nulla eget urna.</p> <ul> <li>Tristique</li> <li>Aenean</li> <li>Pretium</li> </ul> <p>In hac habitasse platea dictumst. Duis porttitor. Sed vulputate elementum nisl. Vivamus et mi at arcu mattis iaculis. Nullam posuere tristique tortor. In bibendum. Aenean ornare, nunc eget pretium porttitor, sem est pretium leo, non euismod nulla dui non diam. Pellentesque dictum faucibus leo. Vestibulum ac ante. Sed in est. Sed sodales nisl sit amet augue. Donec ultrices, augue ullamcorper posuere laoreet, turpis massa tristique justo, sed egestas metus magna sed purus. Fusce eleifend, dui ut posuere auctor, justo elit posuere sapien, at blandit enim quam fringilla mi.</p> <h1>Interdum</h1> <div class="descr">May 24, 2006 by Lectus</div> <p>Praesent nisi sem, bibendum in, ultrices sit amet, euismod sit amet, dui. Donec varius tincidunt nisi. Ut ut sapien. Integer porta. Fusce nibh. Curabitur pellentesque, lectus at <a href="index.html">volutpat interdum</a>, sem justo placerat elit, eget feugiat est leo tempor quam. Ut quis neque convallis magna consequat molestie. Nullam semper massa eget ligula. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Pellentesque a nibh quis nunc volutpat aliquam</p> <code>margin-bottom: 12px; font: normal 1.1em "Lucida Sans Unicode",serif; background: url(img/quote.gif) no-repeat; padding-left: 28px; color: #555;</code> <p>Eget feugiat est leo tempor quam. Ut quis neque convallis magna consequat molestie.</p> </div> </div> <div class="main_right"> <div class="link_projects"> <div class="lbl">projects</div> <span class="left"> <a href="index.html" class="g1" accesskey="c"><span>CSS</span><br/>Cascading Style Sheets</a> </span> <span class="right"> <a href="blog.html" class="g2" accesskey="p"><span>Blog</span><br/>of Nonsensical Musings!</a> </span> </div> <div class="link_updates"> <div class="lbl">updates</div> <a href="index.html"><span>PHP</span>laoreet<br/>-<br/>2006-12-19</a> <a href="index.html"><span>PHP</span>neque convallis<br/>-<br/>2006-12-15</a> <a href="index.html"><span>CSS</span>pellentesque<br/>-<br/>2006-12-13</a> <a href="index.html"><span>CSS</span>quis neque<br/>-<br/>2006-12-10</a> <a href="index.html"><span>CSS</span>ultrices sit amet<br/>-<br/>2006-12-07</a> <a href="index.html"><span>PHP</span>nascetur ridiculus<br/>-<br/>2006-12-06</a> <a href="index.html"><span>PHP</span>semper massa<br/>-<br/>2006-12-05</a> <a href="index.html"><span>CSS</span>nibh quis nunc<br/>-<br/>2006-12-04</a> <div class="clearer"><span></span></div> </div> </div> <div class="footer"> <div class="left"><a href="index.html">Website</a> © Copyright 2006, Arcsin </div> <div class="right"><a href="http://jigsaw.w3.org/css-validator/check/referer">Never before could a mind be so blank.</a></div> </div> </div> </body> </html> Similar TutorialsHello Sir, I am new to this forum. I would like to learn HTML in depth. Could anyone forward some material or any url's where I can find information about the basic HTML and advanced HTML concepts. Waiting for reply. Anjali Reddy I am very new in html and css and now try to learn this one now. As an aged person and as I am in a service so my lots of time is engaged in my office and I want to learn it through video tutorials. Can any one give me some good linked video tutorials to know how to slice one psd , and code them with valid css and use div tags. Any help will be highly appreciated. Regards trnghosh Can anyone recommend a good tutorial site for learning HTML? I'm just starting out. Free is good, but I know you get what you pay for, so if the tutorials are good, I wouldn't mind paying for something of good quality. I don't want to get in over my head too soon and get discouraged. I'd really like to find some video tutorials. Thanks. Im a beginner so please if anyone knows let me know. Im actually learning for free on w3schools.com and e-learningcenter.com but now, Im willing to buy me a complete course even though I know I can learn for free. Thank you so much! Hi guys.I have very little html experience so I decided to work from a template. Problem is, I didn't even know how to add some of the simple stuff. I was able to figure out how to add: a) the background b) the main header(banner) and c) a few normal pictures I have no idea however how to add the: sidebar, menubar (where about us, etc is), or the footer. I don't know where the programming for them starts or how to add so that the show up. In the following post I'll add my website name and code: HI Guys, I am making a template using Web 2.0. Everything was alright but when I opened the html files in Dreamweaver again for work. One div in the middle it showed white space. When I viewed it in firefox, it viewed completely and there was no white space. The text was there , everything was there. I dont get it, where did the white space came from. Also, if I view the code view, that specific div is highlighted with yellow color. Also the yellow highlighted div is showing in the design view. I am attaching the screenshots. Kindly help with this Regards, a2usmani I'm trying to make a template for e-bay using Dreamweaver. When I use CSS, it applies everything to the whole auction, so even the e-bay things have the font as orange. I went in and changed everything to html and things look better, but I'm having a problem with the border around my images. I would like it to be the color in the background instead of black. Here is a screenshot of what I am talking about. http://s132.photobucket.com/albums/q...screenshot.jpg Here is the code I currently have: <img src="http://i132.photobucket.com/albums/q14/littlestinkerstore/SSTemplate/ssimagej.jpg" width="288" height="288" border="9"></p> <p align="center"> </p> <p align="center"><img src="http://i132.photobucket.com/albums/q14/littlestinkerstore/SSTemplate/ssdescriptionj.jpg" width="450" height="225" border="2"></p> What I would REALLY like is a border around the image that is another image, a pattern used in the background, but I will be happy with a color that matches!! Thanks! here is the template. it's coded badly since I used photoshop and dreamweaver since I dont really know how to code. the only thing I need to do is add a div tag in the body thats white and another div tag for the footer with that color. ive been messing with it but i cant get it. i end up messing the whole template up. could someone please help me with those 2 spots please? Hi, total newbie to website design and I need help in getting rid of a template. I think for now all i want is to go to cPanel, then right to a HTML editor, but every choice seems to leave me with some sort of forced template. I just switched from Sitebuilder to RVsitebuilder and was a little happier with the 'build your own' template... but still there is a template. I want to learn to design my own header, not have some preset thing.... Should I just keep messing with different builders? Try wordpress? (it's Not like i can ruin anything, there is no content up yet to worry about overwriting) Hoping someone feels like answering this tonight Hi, this may not be even a HTML question but... I was wondering if there was a way to create some kind of website template, so if I wanted to add a banner or something to a page I don't have to go into each individual html file and put it in. Something like a css that everything references to and making a change in that changes all. THX. How would you add a template to your site with HTML. This concept is getting very annoying and I have started arguing with someone on this subject. Please if you know how to do this please don't hesitate to tell me. Thanks in advance!! -Levi Hey everyone, First of all, I don't know any HTML, I'll be following a tutorial later this week to learn it, yet I decided to give website lay-outs, a go. Here's what I got so far. Now my questions are, do I have to add the text on there now? Or will I add it with HTML later on? And my other question is, how exactly does the slice tool work? Do I just have to slice it all in pieces? Or do I have to add the URL to it too? (If you double-click a slice you can enter a URL, how can I know the URL if I don't even have a site yet?) Thanks a lot! I have an older template that has a stylesheet and iframes.html I am wanting to put this into it and just havent had any luck. <!-- MLCALC BEGIN --> <script type="text/javascript"><!-- mlcalc_default_calculator = 'loan'; mlcalc_currency_code = 'usd'; mlcalc_amortization = 'year_nc'; //--></script> <script type="text/javascript" src="http://www.mlcalc.com/jquery.js"></script><div style="font-weight:normal;font-size:9px;font-family:Tahoma;padding:0;margin:0;border:0;background:transparent;color:#E5E5E5;width:300px;text-align:right;padding-right:10px;" id="mlcalcWidgetHolder"><script type="text/javascript" src="http://www.mlcalc.com/widget-wide.js"></script>Powered by <a href="http://www.mlcalc.com/" style="color:#E5E5E5;text-decoration:none">Mortgage Calculator</a></div> <!-- MLCALC END --> I have been able to muddle it into the page but get script error. I am sure I need to provide more information. The tables on the page are just to confusing for me to work this in. Just thought I would start off with the problem. Wasnt sure what forum to put this in either thanks in advance for any input. Well okay it's me again. I'm making another template. How do I get this: Image To look like this: Image And then let me add text? Codes: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Apateezer - Home</title> <link rel=stylesheet href="style.css" type="text/css" media=screen> </head> <body> <div id="page"> <div id="Header"> </div> <div id="linkbar"> <div id="page"> <p>test</p> </div> <div id="footer"> <p>Copyright (c) 2008 Apateezer.com <br/> All Rights Reserved.</p> </div> </div> </body> </html> Code: body { background-color:#000000; margin:0; padding:0; text-align:center; font-family:Trebuchet MS Bold; font-size:16px; color:#ffffff; } #page { width:960px; margin:auto; padding:auto; background-image:url(images/page.png); text-align:center; } #header { width:780px; height:123px; background-image:url(images/header.png); clear:both; } #linkbar { width:780px; height:66px; background-image:url(images/linkbar.png); clear:both; } #footer { width:780px; height:51px; background-image:url(images/footer.png); clear:both; } PLease help. Hey there. I have a blog. its called reign of uncertainty, and the url is www.confusedforeternity.blogspot.com i am using a zigmag remedy template. i am trying to put links in the bar, where it says "home, about me, art....". but the template automatically prefixes the blog url before the link. if i put www.deviantart.com in the xml code, it automatically becomes http://www.confusedforeternity.blogs...deviantart.com. i am not the good at coding and i dont know why its happening. the xml template is available he http://www.mediafire.com/?tz3mzcgntmt A solution will be appreciated. Hi I've found a nice template of a website online (free). But i couldn't find a way to fully make the template RTL. Could anyone assist be with some basics? I could even upload the template. Thanks, Hi All, I'm a co-founder of an organization by the name of CLEAN Education, I am responsible for the web site because I'm pretty tech savvy. The site is he www.cleaneducation.org I'm currently cleaning the website to try to make it much more functional for me to update and make it consistent on multiple browsers. Question: How can I make a template? Currently when I want to alter part of the non individual page specific parts (such as the right column that is for recent news) I have to go through each and every page to alter it. Can I make a a template that has everything other than the center white part that is page specific and then somehow call on the content for the page specific part for each page? Altering 10-15 pages on a weekly basis is becoming tedious. Thanks all Hey, I was working on a template and I was learning some new things so I might have messed up some where. But, the template won't center and it has a empty space next to it which I don't know how to get rid of. Can anyone help me? http://teamafterglow.com/templates/template7.html so i need help with this .. what i want to accomplish is have everything with a width of 750px and each item to go after one another .. i thought a table would make that happen but it doesn't seem like it does .. on some previews it shows that it goes straight downward, but i think on larger resolutions it doesn't. i'm using this for ebay and it's showing up like this which isn't how i want it to look like. can someone help? HTML Code: <body><body bgcolor="#000000"> <table width="750" border="0"> <img src="http://www.advancespeedshop.com/d4auto888/top-header.jpg"> <!-- PRODUCT IMAGE --> <img src="http://www.advancespeedshop.com/frictiondesigns/easyimg/images/bfi1241809521c.jpg"> <!-- PRODUCT IMAGE --> <!-- DESCRIPTION --> <img src="http://www.advancespeedshop.com/frictiondesigns/easyimg/images/opt1241809533e.jpg"> <!-- DESCRIPTION --> <!-- POLICIES --> <img src="http://www.advancespeedshop.com/d4auto888/shipping-rates-calculated.jpg"> <img src="http://www.advancespeedshop.com/d4auto888/shipping.jpg"> <img src="http://www.advancespeedshop.com/d4auto888/payment.jpg"> <img src="http://www.advancespeedshop.com/d4auto888/policies.jpg"> <img src="http://www.advancespeedshop.com/d4auto888/returns.jpg"> <img src="http://www.advancespeedshop.com/d4auto888/contact-us.jpg"> <!-- POLICIES --> </table> </body> I am creating a blog, and I went on a blog skin website and downloaded a couple of templates. i signed up to start my blog on blogspot.com. anyway, when i tried to customize and upload my downloaded templates, it had some errors. i'll try to give anyone the html codes...i can't make an attachment with the files on the first template i got the following error: "Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly. XML error message: The element type "html" must be terminated by the matching end-tag "". " i tried the second template, and i got this error: "Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly. XML error message: Open quote is expected for attribute "{1}" associated with an element type "language". " i am wondering if the person who made these made a mistake in the html. please help! oh, here is my blogspot address: harmony-dreams.blogspot.com thanks~ |