|
|
|
|
Getting there from here: Lots of paths to enlightenment, grasshopper As you probably know by now, the creative types here at Blogdrive.com have gone to great lengths to create cool layout templates for your blogging pleasure. What's your pleasure? Gothy? Simple? Black? White? Rose? Just click on Select Layout and choose a template that strikes your fancy (or perhaps just tugs on your fancy's sleeve…) All Blog template flavors have a clean professional appearance and have been tested in the labs for stability and viewability (is that even a word??) on all the popular browsers and operating systems. That having been said, we're offering you even more! (is that possible?). You now have the ability to edit the template itself! But be warned, it's not for the squeamish…: But what have we done for you lately? Now you can customize your Blog template to satisfy your own brilliant, misunderstood artistic cravings! But be warned, this is risky business for the HTML-challenged. Before you make any edits, we strongly recommend that you get up to speed on HTML and/or CSS - check out Blogdrive primers on HTML and CSS). Not the world you envisioned? Here are some tips to avoid the stages of anger that will follow… Let's face it: if you make a mistake editing your Blog's code, someone will have to pay! First, it will be you ("How could I be sooo stupid?! Arrrgh!"). Then, it could be, um, Bill Gates ("Damn him and everything that comes out of Redmond, Washington!"). And finally, your wrath could wind up being hurled at us, your humble servants here at Blogdrive ("Oh, that Helpee character did this on purpose! Blogdrive makes me sooo angry!! I'll show them. Where's my ##$%&! flamethrower?!") To help you help yourself avoid these predictable and unfortunate stages of anger (sure there are more, but hey, who's writing this anyway?), here are some tips you'll want to consider when you make changes to your Blog template: Back it up, baby. After you've customized your Blog code-and before you click the "Submit" button - copy and save the modified code to your hard drive as a text or HTML file for backup. Why? Well, if you select a new layout from the "Select Layout" page, all changes you made will be overwritten. Gone. Vanished. But all is not lost; remember, only the template will be overwritten if you select a new layout - all of your Blog entries, tagboard and comment areas will still be saved in the Blogdrive database. Hideous beast? Don't be scared. If after you've made edits and pressed the submit button, then viewed your page only to find that you've created a hideous beast, don't panic. You can still continue to make edits here or simply visit the Select Layout page and choose another layout template or reselect the one you originally started with and all will be well again in your digital world. A (cascading) style all your own. One of the easiest ways to make changes to the look of your pages is to modify some of the CSS (cascading style sheets) code. CSS governs the way fonts show up on your Blog. You can easily edit CSS to change font styles, colors and sizes for entire sections of your page. Our CSS code is laid out vertically for your editing pleasure for almost every area of the page, so you can easily edit areas like the tagboard and comment fonts. For a primer in basic CSS click here. Can't we all just get along? About browser compatibility… The HTML used in creating the Blogdrive layout templates is fairly straightforward and stable in most browsers. The code works in conjunction with the CSS and Blog Tag areas within each page. Occasionally there are some tricks that are used that may be difficult for beginners to grasp. For instance, many of the layouts make heavy use of tables and graphics in creating what might be called graphic containers that appear to expand and contract, depending on how viewers see your page (based on individual monitor resolution settings). Before starting a new HTML exercise program, check out the Blogdrive primer (or consult a geek). User Friendliness 101: 800 x 600 is the standard. When making edits to the HTML in your layout template keep in mind that many users will be viewing your page with an 800 x 600 pixel resolution. Don't know what your monitor's settings are? Right-click on your computer's desktop (for Windows users), and select "Settings." You should create your page to be viewed comfortably at 800 x 600 without horizontal scrolling. Most professional sites, especially portals such as Yahoo, use this limitation as a baseline in their designs. It should also look good at higher resolutions. Browser Friendliness 101: Make your site simpatico. Window's Internet explorer (IE) is quite forgiving when displaying broken or misplaced HTML tags, but Netscape isn't. A page filled with errors may still display fine in IE, but when viewed in Netscape it might look distorted or seem as if entire sections have vanished. Madness? Yes, but you can avoid it and help make your Blog creation more browser-simpatico by checking it in both (and if you're feeling really anal, check it out in the Opera browser. If you have a chance, check it on a Mac as well. Blog Tags / Tog Blags / Got Glabs? The Blog Tags are part of your Blog layout template code and act like location pointers for sending data to and from the Blogdrive database. Before working with any of these special Blog Tags, you should first understand what they are and how they are used. At a glance each tag is fairly self explanatory, as you can see below. Blog Tags at a glance: [title] [header html] [profile image] [profile] [tag board] [calendar] [side html] [gallery] [search] [polls] [favorites] [hitcounter] [notification] [contact form] [rss] [date] [blog title] [body] [extended entry] [extended keywords] [time] [author] [comments] [permalink] [comment data] [previous page] [next page] [bloghome] Details: Wherever these tags are placed in your page is where the information collected from the data base will appear. Each tag corresponds to its particular blog element or feature. For example, the [title] tag can be placed anywhere within the document, then when the page is rendered in a browser the title of your blog will appear wherever you've placed the [title] tag. The same is true for say, the [calendar] tag. When the page is seen in a browser, the archive calendar will appear wherever you've placed the [calendar] tag. Now, obviously the [title] tag should be placed between the HTML title tags. This is where it was designed to be used. Before making edits, look at the template as it is here in its raw un-rendered form. Then, in another browser window perhaps, view your page fully rendered. Compare the two. Over time, depending on your current understanding of HTML and such, you'll begin to see how this all works and be confident in making edits. Viewing the source code of a fully rendered page also helps in this understanding.
If you're not confused enough already, try this... There are a few other tags with which you should become familiar. They are xml tags that help create the repeated entry area. Here is what they look like: <blog> <dateheader> </dateheader> <datefooter> </datefooter> </blog> Here is an example of how they should appear in your template. The example below is the section of the template that is used for your entry area. It contains the XML tags along with the entry area Blog tags and some CSS DIV reference tags. This entire area should be place where you would like your entries to appear in the template. <div align=center>[search fields]</div> <blog> <dateheader> <DIV CLASS="date">[date]</DIV> </dateheader> <DIV CLASS="blogtitle">[blog title]</DIV> <DIV CLASS="blogbody"> <p>[body] <DIV CLASS="exte">[extended entry]</DIV> <DIV CLASS="extk">[extended keywords]</DIV> </p> <DIV CLASS="posted">Posted at [time] by [author]<br> [comments] [permalink]<br><br> [comment data] </DIV> </DIV> <datefooter> </datefooter> </blog> |