Create A Webpage On MsnTv's
This tutorial will explain how to avoid the most common errors when beginning a webpage on Pagebuilder.
After your webpage is begun and a proper URL is set for it, I will then explain advanced techniques which will give you complete control over your webpages.
Since this tutorial begins with the basics of creating a webpage, we begin with this WARNING: |
WARNING - Adding any HTML to your Title-box will improperly add it to your page's URL...and, you don't want that to happen! (The contents of the title-box is not supposed to be visible on your page, so DO NOT try and center this title!)
When you initially publish your page you will then see this check-box below your Title-box: |
| Show this title on your page |
NEVER check the "Show title on page" box! (On ANY page - really bad things will happen if you do :-) Make certain that it's UN-CHECKED and looks exactly like this before you publish your page: |
| Show this title on your page |
| *NOTE: The above WARNING will soon be relevant in Step #2 of "Creating" a webpage below: |
STEP #1: You begin your webpage by clicking on "Create" and then choosing a template background...for this example, I chose the "Blue" background on page 2 of the template backgrounds (any BG will do since you can easily change it later),
STEP #2: You next will give your page a title...this "Title" will NOT show on your webpage (Remember the WARNING from above!) Instead, this "Title" is incorporated into your page's URL, so give your page a short title (lower-case is best with no punctuation...and, one word is preferable.)
After you choose your page's background (in Step #1) you will return to your rough-edit screen and you will then see your chosen background (blue in this case), and within the blue background there will be this link to your add-title box:
"Choose this to add a title to your document." - click on this link now in the rough-edit box below to proceed to the Add-title box: |
Choose an item to change or remove it
|
STEP #2 (Continued):
This is what your "Title-box" looks like where you will choose the URL for your page - I had originally named this webpage simply "tute" (to keep my Url short), so we'll use that page-title in this example, which will give me this URL:
http://community-2.webtv.net/kdine/tute/
Later, after you publish your page and its Url is set, then you can return to your Add-title box, delete the short title, and give your page a longer title which will then show in your page's status-bar window.
After you write your short title in the add-title box, UNCHECK the "Show title on page" box and press the "Done" button and you'll go to Step #3 (go ahead and do it now): |
Title for your page
 | The title appears at the top of your page (if you choose to show it) as well as in the list of your pages. |
Type your page's title:
| Show this title on your page |
|
STEP #3:
After you input your page's URL extension into the "Title-box" and press "Done" you will immediately return to the rough-edit of your new page...so far, we have only picked a blue background, so that is all that shows in the rough-edit of the page so far.
But now, it is finally time to add more content to this new page, so go ahead and click the "Add-item" button and we'll jump to Step #4 where the real pagebuilding magic will begin: | |
Choose an item to change or remove it
|
STEP #4: Although Pagebuilder gives you six options for adding content into your pages, in the advanced methods only the "Add-text" and "Pagebreak" items are used. The "Add-picture" feature is used only to add images into separate "Image-storage" pages since you would have no control over your images if they were added directly to your page from your scrapbook - click on the "Add-picture" icon for directions on creating image-storage pages.
Scroll down for more info on each "Add-item" feature and click on the icons for further details on how to write the code yourself: |
Add an item to your page
Choose the type of item to add:
|
 | Pictures should never be added to your pages directly - click on the icon for directions on how to create image-storage pages to link your images into your Add-text box:
<img src="URL"> |
 | Links are easily added to your page by writing them yourself in the add-text box:
<a href="URL">Click</a>
Click on the icon for directions on writing links. |
 | Lists are also very easy to write:
<UL>
<LI> Item #1
<LI> Item #2
<LI> Item #3 </UL>
Click on the icon for further directions on writing your own lists. |
 | Clicking this item merely nests your title within <H1> tags: <H1>Title</H1> - however, it's easier to just write these very simple tags in the add-text box. Click on the icon for more info on header tags.
|
 |
Pagebreaks are used to end one page and start the next - there is room on Pagebuilder for over 1,000 webpages, so either use the "Create" button or a pagebreak to freely create as many new pages as you want.
This is what a pagebreak looks like: |
The "Add-text" feature is where you will write all your HTML.
All advanced Pagebuilder methods avoid the hidden template code that Pagebuilder's editor adds to your pages by writing the HTML code in only one add-text box per page.  If you have previous experience using HTML in your sig-box, then this method is very similiar, except you DO NOT add <HTML> tags to Pagebuilder (this tag is already in PB's template).
Click on the Text-icon for a demonstration of writing all of the above HTML in one add-text box. |
The One Add-text Box Per Page Method:
Simply write all of your page's content in the very first add-text box on your page and DO NOT use any of Pagebuilder's add-item features.
In this example, I have written a page in only one add-text box which has everything that Pagebuilder's template features write for you - however, in this advanced method of creating a webpage you can instead see ALL of the HTML which affects your page, and thus alter it as you choose.
You can CC&P the contents of my add-text box below and paste it into one of your own add-text boxes in order to see how the code works (or, Click Here to see what the code below looks like when published): |
Add text to your document
Type a title (optional):
Type your text here:
|
|
Click Here to see what the code and text in the Add-text box (above) looks like when it's published.
~ LINKS ~
- Use the AE Fix to add your own backgrounds to Pagebuilder.
- Use Bunny's Way <Script></Script> to add your own backgrounds to Pagebuilder.
- MsnTv's Update History
- Preview Pagebuilder's proposed new 2.8 Advanced Editor (takes 10 sec. to load):
If you should have any questions, or need any help using these methods, please go to [alt.pagebuilder.help]
If you have any suggestions or comments, or if you just want to say "HI" and leave a link to your own pages:
Guestbook by Escati
|
Kounters
- You have visited this page
times.
At any time, even after your page is done, you can click on the "Change page style" button and choose a different template background for your page.
If you choose to use one of the Advanced Editor methods and use your own background, then it really doesn't matter which page style you choose since it will later be cancelled out by the AE code. Get AE directions here:
- Use the AE Fix to add your own backgrounds to Pagebuilder.
- Get more info on Pagebuilder's template backgrounds Here.
|
|
Title and description for your page
The title appears at the top of your page, if you've chosen to show it. The title and description appear in the list of your pages.
Type your page's title:
Type your page's description:
| Include this page in your public list of pages |
|
This is what the "Title-box" looks like when you access it from your Pagebuilder's index list of pages...when you access the Title-box this way, instead of the "Show title on page" check-box, you have the Description-box & the Public-list check-box.
Click [HERE] to see how the Title-box looks when it's instead accessed from Pagebuilder's sidebar link. |
Below is the HTML for a typical Pagebuilder webpage. The tags which are highlighted YELLOW are the hidden template tags which MsnTv automatically adds to each webpage for you.
The words and tags which are highlighted BLUE are those which can be added by you via one of PB's various data-entry boxes. Next to each blue area are numbered links which will take you to Pagebuilder's corresponding data-entry box where it was actually entered.
Sorry old Classic users...you will just see the tags and not the highlighted colors. |
<html>
<head>
<META NAME="generator" CONTENT="WebTV Page Builder v1.1">
<META NAME="description" CONTENT="My PB Demonstration [#1]"><title>tute[#2] </title>
</head>
<body text="#7ac2d5"bgcolor="#11144c"link="#a5a033"vlink="#25a51f">
<P>
<TABLE>
<TR><TD>
<P ALIGN=left>
----------------START ADD-TEXT BOX---------------
</table>
<H1 align="center"> My Title </H1>[#3]
~ REST OF PAGE CONTENT HERE ~
<table><tr><td>
-----------------END ADD-TEXT BOX----------------
</TD></TR></TABLE>
</P><table border="0" cellpadding="0" cellspacing="2" width="100%">
<tr height=0>
<td height=0>
<spacer type=block width=30% height=0>
<td height=0>
<spacer type=block width=30% height=0>
<td height=0>
<spacer type=block width=30% height=0>
</tr>
<tr>
<td colspan="3">
<hr>
</td>
</tr>
<tr>
<td valign=middle width=30%>
<font face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular">
<b>
</b></font></td>
<td valign=middle width=30%>
<center>
<font face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular" size=-2><I>
<a href="http://www.msntv.com">Powered by MSN TV</a>
</I></font></center>
</td>
<td align=right valign=middle width=30%>
<font face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular">
<b>
</b></font></td>
</td>
</tr>
<tr>
<td colspan="3">
<hr>
</td>
</tr>
</table>
</BODY>
</HTML>
|
|
|
