Help

How do I make a web page?

Here are the steps for creating a web page:

Create a new web page.
Divide and resize your web page into blocks.
Add content into your blocks.
Make adjustments to your page.
Close the page and publish it.
Click "View Website" and see your new web page.

We will go into each of these steps in detail below:

Step 1: Create a new web page.

After you logging in, you will be brought to the file manager. This is where you create and edit your files.

We are going to start by creating a web page. In order to do that, make sure the "web pages" folder on the left is highlighted, and then click on the "New Web Page" button at the top of the file manager and give your web page a name.

The web page editor will now launch.

Step 2: Divide and resize your page into web blocks

Each new web page appears as an empty canvas.

Click on that canvas with your mouse.

You want to divide your page into a series of web blocks that are going to form the outline of your page. You can divide each block by clicking on the "H Split" and "V Split" buttons.

Those two buttons will divide a block in half either horizontally or vertically depending on which button you click.

After you have divided a block in half, you can adjust the size by clicking on the border between two blocks and moving the border up and down or left and right.

When you have those blocks sized right, click on one of the blocks and divide that.

Repeat the process of dividing blocks in half and sizing them until you have created the outline of your web page.

Step 3: Add content into your web blocks

Once you have a good outline in place, you can start adding content to your page. Blockstar lets you create new text, blogs, and photo galleries directly from the web page editor.

To do that, select the block that you want to add content to by clicking on it. Then go to the top toolbar and click on the new text, new blog, or new photo gallery button.

Let's start by creating a new text file. Click on the "New Text" button

This will launch our text editor as a popup over the web page. You will have to name the text file so you can use it later on if you want.

Now we will create a header for the page.

You can format the text anyway you want using the formatting buttons in the toolbar. We will make this our header by selecting the Heading 1 drop down. Once you are happy with what you created, click the "Done" button at the bottom of the page and your text will automatically be added to the block.

Repeat this process with each of the other blocks that you want to add content to.

If you have already created files, you can insert them into a block by selecting the "Add File" button.

This will let your select any file in the file manager to add into your web page.

Step 4: Adjust your web page.

There are several ways that you can adjust your web page:

You can align each block vertically and horizontally.
You can move blocks around by dragging and dropping them.
You can apply a Cascading Style Sheet (style) to your web page.
You can add a title to your page.

Aligning Blocks

Where blocks get positioned relative to each other are controlled by the V align and H align tags in HTML.

H alignment stands for horizontal alignment, and controls whether a block will appear in the left, center, or right part of the space available to it.

V alignment stands for vertical alignment, and controls whether a block will appear in the top, middle, or bottom part of the space available to it.

You can use these two tags to control how items line up next to each other on a web page.

Moving Blocks

Blockstar lets you change the location of blocks on your web page by dragging and dropping them.

To move a block, first highlight it and then hold down the mouse.

Then drag it over the block you want to move the highlighted block to.

Finally let go of the block. You will be given a choice of whether you want to swap or insert the block. Swapping will change the position of the two blocks. Inserting will split the destination block in half so that it now holds both blocks.

Below is an example of a swap.

Adding Styles (Cascading Style Sheets)

You can control many of the properties of your web page by adding a style to it. A style is a Cascading Style Sheet (CSS) file that controls the colors, fonts, and other properties of your web page.

To add a style to your web page, click the Add Style button and select a style from your Styles folder.

To see what you page looks like with the style applied, click on the Preview button in the web page editor.

Here is how a page with a style looks in the web page editor.

Here is that same page when published with the style.

Add a Page Title

The page title is the name of the page that appears in the upper left corner of your web browser. It is also used by search engines to show people what your page is about. You can set the title of your web page by clicking the "Page Title" button.

Step 5: Publish your web page

Once you are happy with how your web page looks, click the done button and you will be back in the file manager.

At the top of the file manager, there is a "Publish" button. Click that button and we will publish your web page to our servers.

While the publishing process is running, a popup dialogue will appear and the publish button will appear darkened. When publishing has finished, a message will appear telling you.

For now you need to restart the Website Builder after publishing has run. We are working on changing this so you won't have to restart each time.

Step 6: View your website

There are two ways that you can view your website:

1. Click the "View Website" button in the file manager. This will launch a new browser with a listing of all your web pages in it.

2. Login to your account at www.blockstar.com and click on the "My Website" link on the left side of the page.