HTML - Blog Layout Help *easy*
i know very basic html, i have taken some free script to create a blog layout for my website:
http://www.williamhessian.com/bloglayout.html however, even using the original code that i was given, i cannot get the sidebar to appear on the actual side. it constantly wants to appear below the other content. i think this is probably a simple problem, but i cannot figure it out. any help is much appreciated. also if you see any other script problems while you are viewing source please let me know. suggestions are very welcome. william Similar TutorialsHello all, I use Internet Explorer 7 which is also the browser I preview my layouts on. I've had problems with my layouts looking like they should on Firefox for the longest time and I think it's time I tried correcting the problem. When I load my blog on Firefox the entry box overlaps with a portion of the image. The entry box's height is also too long on Firefox. I do know that coloured scrollbars don't show up on Firefox so that's not a problem. My main issue is that the basic arrangement of the boxes of my layout is completely messed up on Firefox. Here's the HTML: Quote: <html> <head> <title>o.d.c v41: i am more than you will see.</title> <style type="text/css"> A:link { text-decoration: none; font-weight: bold; color: #924146 } A:visited { text-decoration: none; font-weight: bold; color: #924146 } A:active { text-decoration: none; color: #000000 } A:hover { text-decoration: line-through; cursor: default; color: #000000 } body {background-color: #E6DDD0; scrollbar-face-color: #E6DDD0; scrollbar-highlight-color: #E6DDD0; scrollbar-3dlight-color: #E6DDD0; scrollbar-shadow-color: #E6DDD0; scrollbar-arrow-color: #E6DDD0; scrollbar-track-color: #E6DDD0; scrollbar-darkshadow-color: #E6DDD0; font-family: tahoma; color: #000000; text-align:justify; margin: 0px; font-size: 8pt;} .entry {position: absolute; top: 80px; left: 163px; width: 514px; height: 481px; border-left: 1px solid #52191D; border-right: 1px solid #52191D; border-top: 1px solid #52191D; border-bottom: 1px solid #52191D; padding: 10px; letter-spacing: 0pt; line-height: 9pt; overflow:auto; background-color: #D9B8AE; scrollbar-face-color: #D9B8AE; scrollbar-highlight-color: #000000; scrollbar-3dlight-color: #D9B8AE; scrollbar-shadow-color: #000000; scrollbar-arrow-color: #D9B8AE; scrollbar-track-color: #D9B8AE; scrollbar-darkshadow-color: #D9B8AE;} .image {position: absolute; top: 50px; left: 680px; border-left: 0px solid #52191D; border-right: 0px solid #52191D; border-top: 0px solid #52191D; border-bottom: 0px solid #52191D;} .links {position: absolute; top: 50px; left: 163px; width: 514px; height: 10px; border-left: 1px solid #52191D; border-right: 1px solid #52191D; border-top: 1px solid #52191D; border-bottom: 1px solid #52191D; padding: 6px; text-align: center; background-color:#D9B8AE;} </style> <script type="text/javascript" src="http://www.haloscan.com/load/tripwires"> </script> </head> <body> <div class="image"> <img src="http://img.photobucket.com/albums/v628/yelen/mewithtext.jpg"> </div> <div class="entry"> <center><font color=#BC6A6F><b><u>%%short_description%%</u></b></font></center> <p align="right"><i>written: %%time%% on %%date%%</i></p> <P> %%entry%% <P><P><P><P> <P align="right"> <font size=1.5><a href="javascript:HaloScan('%%page_name%%');" target="_self"><script type="text/javascript">postCount('%%page_name%%');</script></a></font> <P><P> <p align="center"><a href="%%prev%%">previous entry</a> || <a href="%%next%%">next entry</a> <P><center><hr width=90% noshade color=#000000 HR size="1"></center><P> <b> Previously:</b><br> %%older_entries%%<P> <br> <P align="center"> <!--WEBBOT bot="HTMLMarkup" startspan ALT="Site Meter" --> <script type="text/javascript" language="JavaScript">var site="s13cyelen"</script> <script type="text/javascript" language="JavaScript1.2" src="http://s13.sitemeter.com/js/counter.js?site=s13cyelen"> </script> <noscript> <a href="http://s13.sitemeter.com/stats.asp?site=s13cyelen" target="_top"> <img src="http://s13.sitemeter.com/meter.asp?site=s13cyelen" alt="Site Meter" border=0></a> </noscript> <!-- Copyright (c)2002 Site Meter --> <!--WEBBOT bot="HTMLMarkup" Endspan --> <!-- Begin Nedstat Basic code --> <!-- Title: like i could care --> <!-- URL: http://offence.diaryland.com --> <script language="JavaScript" src="http://m1.nedstatbasic.net/basic.js"> </script> <script language="JavaScript"> <!-- nedstatbasic("ABZB6g7C7XYY5+UwEEa7SkNbtBHg", 0); // --> </script> <noscript> <a target="_blank" href="http://v1.nedstatbasic.net/stats?ABZB6g7C7XYY5+UwEEa7SkNbtBHg"><img src="http://m1.nedstatbasic.net/n?id=ABZB6g7C7XYY5+UwEEa7SkNbtBHg" border="0" nosave width="18" height="18"></a> </noscript> <!-- End Nedstat Basic code --><P> </div> <div class="links"> <a href="http://offence.diaryland.com/index.html">new</a> <a href="http://offence.diaryland.com/older.html">old</a> <a href="http://offence.diaryland.com/bio.html">bio</a> <a href="http://offence.diaryland.com/omake.html">extras</a> <a href="http://offence.diaryland.com/layout.html">layout</a> <a href="http://members.diaryland.com/edit/notes.phtml?user=offence">notes</a> <a href="mailto:yelen.dean14[at]gmail.com">email</a> <a href="http://offence.diaryland.com/poetry.html">poetry</a> <a href="http://www.fanfiction.net/~hisashilovesyelen" target="_blank">fanfiction</a> <a href="http://www.fictionpress.com/~hisashilovesyelen" target="_blank">originals</a> <a href="http://offence.diaryland.com/faveentries.html">favourites</a> <a href="http://www.diaryland.com">host</a> </div> </body> </html> Here's the link to my blog: http://offence.diaryland.com I have VERY basic knowledge of HTML, as I'm sure is obvious. Any help is, therefore, greatly appreciated. Hi! This is was my blog looks like at the moment: http://neverrgrowold.blogspot.com/ I would like to add a 3rd column to my 2 column layout. I know this will mean resizing the other two columns which I know how to do.. I just have no idea to add another column to the right. Here is the html: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <title>Never Grow Old</title> <style type="text/css"> #navbar-iframe{height:0; visibility:hidden; display:none;} body {background-color: #000; font: normal 10pt Trebuchet MS; color: #e5e5e5; cursor: crosshair; line-height: 75%; scrollbar-face-color: #ddd; scrollbar-highlight-color: #fff; scrollbar-3dlight-color: #ddd; scrollbar-darkshadow-color: #ddd; scrollbar-shadow-color: #fff; scrollbar-arrow-color::#fff; scrollbar-track-color: :#ddd;} a:link, a:visited, a:active {color: #e5e5e5; text-decoration: none; text-transform: none; font: normal 8pt Trebuchet MS; cursor: normal;} a:hover {text-decoration: ; text-transform: None; font: normal 12pt Trebuchet MS; cursor: normal; color: #FF4C79;} blockquote {font: normal 8pt trebuchet ms; color:#e5e5e5; padding:5px; border-left:7px solid #ddd; background-color:#000;} blockquote:hover {-moz-border-radius:4px; padding:5px; border:2px solid #000; } blockquote:first-letter {background: #000; font: italic 15pt "Georgia"; color: #FF4C79;float: padding: 5px; text-transform: uppercase;} .head {text-align: center; font-family: impact; font-size:12pt; color:#CCFF66; text-align: left; text-transform: none; line-height: 9pt; font-style: none; background:#000; padding: 5px; } .content {font-size: 9pt; font-family: Trebuchet MS;color:#e5e5e5; background: #000; line-height: 14px; padding:10px; border: 2px solid #111; } .headline1{font:normal 30pt Courier New; color:#e5e5e5; letter-spacing:-3px; text-transform:uppercase; line-height:100%; } </style> <script type="text/javascript"> /*********************************************** * Disable select-text script- © Dynamic Drive (www.dynamicdrive.com) * This notice MUST stay intact for legal use * Visit http://www.dynamicdrive.com/ for full source code ***********************************************/ //form tags to omit in NS6+: var omitformtags=["input", "textarea", "select"] omitformtags=omitformtags.join("|") function disableselect(e){ if (omitformtags.indexOf(e.target.tagName.toLowerCase())==-1) return false } function reDisable(){ return false } if (typeof document.onselectstart!="undefined") document.onselectstart=new Function ("return false") else{ document.onmousedown=disableselect document.onmouseup=reDisable } </script> <script language=JavaScript> <!-- //Disable right click script III- By Renigade (renigade@mediaone.net) //For full source code, visit http://www.dynamicdrive.com var message=""; /////////////////////////////////// function clickIE() {if (document.all) {(message);return false;}} function clickNS(e) {if (document.layers||(document.getElementById&&!document.all)) { if (e.which==2||e.which==3) {(message);return false;}}} if (document.layers) {document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;} else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;} document.oncontextmenu=new Function("return false") // --> </script> <body> <div style="position: absolute; top: 10px; left: 188px; width: 500px;"> <span class="headline1"><img src="http://i44.tinypic.com/bfoq69.png"/> </span><br> </div> </div> <div style="position: absolute; top: 440px; left: 525px; width: 600px;"> <Blogger> <div class="head">@ <BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader> </div> <div class="content"><$BlogItemBody$></div><p> </Blogger> </div> <div style="position: absolute; top: 440px; left: 190px; width: 310px;"> <div class="head">Welcome! </div> <div class="content"> <div><img src="http://24.media.tumblr.com/avatar_66b2c19ef795_64.png" align="left" /><font color=#e5e5e5>I believe we never truly grow old unless we let ourselves. You'll find anything and everything to do with your childhood if yyou grew up anywhere between the late 80's to the early 2000's. So sit back, enjoy your stay, and take a trip down memory lane ;) </font></div> <p> </div><p> <div class="head">Memory Lane.</div> <div class="content"> ghghghghh </div><p> <div class="head">Support</div> <div class="content"> Place your tagobard here, <a href="http://cbox.ws">Cbox</a> recommended<BR> </div><p> <div class="head">Links</div> <div class="content"> Place all your links here,<br> <a href="http://www.blogskins.com/me/theomorphi-c">theomorphi-c</a> <a href="http://www.blogskins.com/me/theomorphi-c">theomorphi-c</a> <a href="http://www.blogskins.com/me/theomorphi-c">theomorphi-c</a> <a href="http://www.blogskins.com/me/theomorphi-c">theomorphi-c</a> <a href="http://www.blogskins.com/me/theomorphi-c">theomorphi-c</a> <a href="http://www.blogskins.com/me/theomorphi-c">theomorphi-c</a> <a href="http://www.blogskins.com/me/theomorphi-c">theomorphi-c</a> <a href="http://www.blogskins.com/me/theomorphi-c">theomorphi-c</a> <a href="http://www.blogskins.com/me/theomorphi-c">theomorphi-c</a> <a href="http://www.blogskins.com/me/theomorphi-c">theomorphi-c</a> </div><p> <div class="head">Looking Backwards.</div> <div class="content"> <BloggerArchives> <BloggerArchives> <a href="<$BlogArchiveURL$>"> <$BlogArchiveName$></a> </BloggerArchives></a><br><br> </div><p> <div class="head">Credits</div> <div class="content"> Designer @<a href="http://www.blogskins.com/me/theomorphi-c">theomorphi-c</a>,<br> Basecode: <a href="http://www.blogskins.com/me/sacrificelove-">sacrifice</a><a href="http://love--bites.blogspot.com">love-</a><br> </div><p> </div> </body> I've been trying to figure it out with my basic html knowledge for a while now and I can't get it, I would be really appreciative if someone could help me out. Thanks!! Hi I am new to this site, I am having problem in my non blog site. I was trying to integrate wordpress blog in my non blog site. I am nearly done only few issues. Here is the site http://www.zipanatomy.com/blog/ 1. the post titles are coming some other way, without linking and some coding. 2. down to the footer, I have called a footer.php file which is from the non blog site and is in the root directory, the problem here is, they are linking to the wordpress log folder. 3. And one more issue is when I click the categories and do any search from the sidebar, that are opening on the extreme right of the page instead of in center. please, advices from the pros where I am getting wrong. thanks in advance, chander Hi I've built a website for my karaoke show, and would like to add a blog page to the site. Rather than 3rd party, I'd prefer to have my own blog on my own domain to increase traffic for the SE crawlers. I was wondering... - what some good options are ie what blog software to use - if I can have a blog that somehow incorporates Facebook and Twitter (i've seen Facebook connect, but I'd like something that posts my blog messages to my Facebook and Twitter pages) I currently have a Typepad blog on there, but as I said, I'd prefer to have my own blog code, not third party. The site is www.billygoatkaraoke.com.au , and I'd really like the blog to stay on the site - I'm thinking that I'll have a blog page open up over the goat when someone clicks on the BLOG link. Cheers Shaun Hi All, I've finally successfully gotten a blog up on my organizations website but I am having a lot of trouble getting it to look like the other pages. I used a template for my main page and tweaked it a lot (www.cleaneducation.org). The main template is mostly html with a css file. I had never seen how blogs were done until now and see that there is no html index at all but only a php file associated with a css file... So my question is how to I get my html/css template to convert to the necessary type (assuming php/css) for the blog. The blog is an internal blog for the directors (myself included) to keep in touch with one another and to keep up to date so if it's really hard to get it to look like the main template it isn't a huge deal but if it's possible I personally would prefer it. Oh yeah, I am using wordpress for my blogging software (really easy install through the hosting company I use). I am Blogging Special Focus on Technology, Blogging,Internet, Top News Stories, Online Money Making, Search Engine Related.Thank You for Reading This. Please! Simply Share your views. I use blogger and I have a search bar on my blog. It's on my navbar and I need to move it to the right so I can add more links but I don't know how to move it. Can I get some help please? To see for yourself my blog is: http://freebielink.blogspot.com/ heres a link to my blog http://leader-of-our-nation.tumblr.com/ heres my coding <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <!-- Theme: The Minimalist v1. Design: The Minimalist (http://minimalist.co) --> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head><a href="http://leader-of-our-nation.tumblr.com/"><img src=< href="http://s1218.photobucket.com/albums/dd412/tappzstar/?action=view&current=loonbannerresize.jpg" target="_blank"><img src="http://i1218.photobucket.com/albums/dd412/tappzstar/loonbannerresize.jpg" border="0" alt="Photobucket"></a></a></a> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>{Title}{blockostSummary} | {PostSummary}{/blockostSummary}{block:SearchPage} | {lang:Search results for SearchQuery}{/block:SearchPage}</title> <meta name="description" content="{MetaDescription}" /> <meta name="if:Show description" content="1" /> <meta name="if:Show search" content="1" /> <meta name="text:Twitter name" content="" /> <meta name="text:Google Analytics ID" content="" /> <link rel="shortcut icon" href="{Favicon}" /> <link rel="alternate" type="application/rss+xml" title="{Title}" href="{RSS}" /> <!-- Styles --> <link rel="stylesheet" href="http://static.tumblr.com/f1whv92/Mp9l6ewcg/reset.css" /> <style type="text/css"> Hi Everyone! I'm new to this forum. I have this problem about commenting in blogs. how should you know if you can use html codes in blogs if you're commenting? I am using wordpress blog. I have a simple site that is hosted by my school. I was wondering if it where possible to embed the blog within my blog page on my website? Hi All Wondered if anyone could help me. I have a website, which I am able to create a blog page with, which I have done. I do not like any of the layouts/templates that are provided for this service and I want to stream the information that I blog to a section/div tag of my actual site and leave the actual blog page non visable to viewers. Is this possible using only html? or will I have to delete this blog page and set up another with the likes of joomla or wordpress? Cheers Saz I was getting help (in this thread http://www.htmlforums.com/html-xhtml...e2-137472.html ) but I guess he got busy and I really need this done by tomorrow morning... Can someone please just tell me how to publish the html to my blog?? Thanks so much. Hi there, I'm desperately seeking help regarding an effect I want to create on my blog. My blog is created on tumblr ( the address being www.bogeyland.com) and I want to create an effect by were the next image fades in when you scroll down the screen. A good example is on this blog which was also made using tumblr (www.thisisnthappiness.com) Please can somebody give me a code as to how its done.I've tried looking at the source but I don't know where to begin. Thanks alot guys, greatly appreciated. Hello knowledgable HTMLforum gurus. I have a client that would like a blog feature on her site, so that she can update one of the pages with announcements, etc. Is there some free code anywhere that I can use to accomplish this? I'd like the code to be able to archive old entries and have a search function if possible... Also, I need to have the blog section fit into the same design scheme as the rest of the site that I will be creating, so outsourcing to blogspot or something like that is out of the question. Does anyone know of any freeware that can accomplish this? Thanks in advance, hous edit: please forgive the placement of this thread - not sure where this belongs. This is my blog, http://www.therawness.com. If you look at my left sidebar, you will see something called the Amazon carousel, an interacting spinning carousel showing books that I recommend to people. Problem is, it only allows a maximum of 10 books to be shows. What I wanted to do is to create a random, rotating array of carousels and have a different 10-book carousel appear every time the viewer refreshes the browser. So basically, what I wonder is what I have to do to accomplish this. Here are examples of codes for 2 widgets I want to alternate whenever the browser refreshes. Widget 1: Quote: <OBJECT classid="clsid27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://fpdownload.macromedia.com/get/flashplayer/current/swflash.cab" id="Player_1aa9293d-9691-4546-afa0-e8f585ee5738" WIDTH="120px" HEIGHT="500px"> <PARAM NAME="movie" VALUE="http://ws.amazon.com/widgets/q?ServiceVersion=20070822&MarketPlace=US&ID=V20070822%2FUS%2Fjohnnytriangl-20%2F8010%2F1aa9293d-9691-4546-afa0-e8f585ee5738&Operation=GetDisplayTemplate"><PARAM NAME="quality" VALUE="high"><PARAM NAME="bgcolor" VALUE="#FFFFFF"><PARAM NAME="allowscriptaccess" VALUE="always"><embed src="http://ws.amazon.com/widgets/q?ServiceVersion=20070822&MarketPlace=US&ID=V20070822%2FUS%2Fjohnnytriangl-20%2F8010%2F1aa9293d-9691-4546-afa0-e8f585ee5738&Operation=GetDisplayTemplate" id="Player_1aa9293d-9691-4546-afa0-e8f585ee5738" quality="high" bgcolor="#ffffff" name="Player_1aa9293d-9691-4546-afa0-e8f585ee5738" allowscriptaccess="always" type="application/x-shockwave-flash" align="middle" height="500px" width="120px"></embed></OBJECT> <NOSCRIPT><A HREF="http://ws.amazon.com/widgets/q?ServiceVersion=20070822&MarketPlace=US&ID=V20070822%2FUS%2Fjohnnytriangl-20%2F8010%2F1aa9293d-9691-4546-afa0-e8f585ee5738&Operation=NoScript">Amazon.com Widgets</A></NOSCRIPT> Widget 2: Quote: <script type="text/javascript"><!-- amazon_ad_tag = "johnnytriangl-20"; amazon_ad_width = "120"; amazon_ad_height = "600";//--></script> <script type="text/javascript" src="http://www.assoc-amazon.com/s/ads.js"></script> Any help would be greatly appreciared! Hi there, Could somebody here tell me what this particular kind of website is? http://www.ozbargain.com.au/ it is not a forum and I don't think it is a blog. Would I be able to buy templates like this off the web? Thanks Hi: I wish to create a 'blog' that *I* control, and where the blog content would reside on my own Apache Server at my home. Is this reasonable and/or easy to do, OR should I use a commercial blog site (e.g., www.blogger.com) For example, I'd like my visitors to access my site (www.myblogsite.org) and then 'Vent their Spleens' on the subject of interest (which will be Heallthcare in the USA and its prospects for change, and the rantings about 'socialism' on the Fox Channel). Thanks for any guidance. -Mel Smith I am trying to code my own blog. I assume id have to use XML. However, my question is how do i create the drop down box that would sort all my previous posts by cat? thanks I'm Not Sure if ;m Putting This in the Wrong Forum Area, But here Goes. How to I Go About Adding a Menu In Blogspot? my blog is at www.artballvideos.com How Would I go About Adding a menu of past Blogposts. I am Aware I asked a mouthfull. But Please be Patient with me, I;m Semi beginner . Thanks |