1. Home
  2. Knowledge Base
  3. Build a website with SiteBuilder
  4. Create pages with text, images, and columns

Create pages with text, images, and columns

The header is the top of your website. You can adjust it in different ways with Sitebuilder. 

IN THIS ARTICLE:

Add text to your page

Add a text field

From the widgets menu on the left, choose the General tab. Then drag and drop the Text widget to your template. You can start typing in it immediately.

drag and drop the Text widget

Add text

When you click on a text widget, a window appears to edit it. This is the text widget editor. Use this to put text in bold, italic, or underlined, or to add a link, check spelling, change font and color, choose a color, etc.

Tip: Use the Headings, it is better than just formatting the text. Search engines add more importance to keywords in headings.
Headings

Delete a text field

Keep in mind that every text field stands on its own. Putting two text fields next to each other will not make them merge. Move the cursor over the widget that you want to remove and click on the red X in the top right corner. If you have multiple text fields you have to delete them one by one.
Delete

Add images, galleries and carousels to your page

Add or change an image

Add an image

From the widget menu on the left, choose General. Drag and drop the Image widget to your template. You will immediately see the standard image frame appear.

Drag and drop
Edit picture

Give an effect to the image

  1. Move the cursor over the image. The words ‘Edit Image’ will appear. Click on them.
    Edit image
  2. With ‘Effects’ you choose what happens when you move the cursor over the image – that is, on the final version of the website.
    Effects
  3. With ‘Align’ you position the image.
  4. With ‘Link’ you can have the image refer to a website, a page on your website, or to an email.
  5. With ‘Text’ you enter ‘Title’, ‘Alt text’ (very important for SEO) and a ‘Description’.

Change an image

  1. Click on ‘Edit image’ to open the editor.
  2. Click on ‘Change image’.
  3. Select an image from the library of files.
  4. Click on ‘Send’
  5. Click on ‘Apply’
  6. Click on ‘Close’
Add a carousel image

The Sitebuilder contains an abundance of free images. But adding your own images is always highly appreciated by your visitors. Here you will learn how to upload your images and create a carousel:

  1. Click on the ‘Files’ tab in the menu on the far left.
    FilesFiles
  2. You are in your file library. Click on the ‘Upload files’ button at the top right. Scroll to find the images you want to use and insert them. Click on ‘Close’ to continue.
  3. Add a carousel to your layout: choose the ‘Media’ tab in the widget menu on the left. Click and drag the Images Carousel to the desired location in your layout. The manager will open immediately.
    Drag and drop
    Slideshow editor
  4. On the left you will see a number of standard images. Delete them.
  5. Add images from the file library by clicking on the ‘Add Image’ button or by dragging and dropping your own.
  6. Switch to the ‘Settings & Preview’ tab. Play around with the design, player settings and advanced settings until you achieve the desired result. On the right you will be seing the preview.
    Settings & preview
  7. Click on ‘Save & Close’ to return.
  8. Publish and view the preview.
  9. Repeat these steps until you reach the desired result.
Add an image gallery

The Sitebuilder contains an extensive library with free images. But visitors will probably appreciate your own images more. You can upload images and compile a gallery yourself:

  1. At the Media tab click on ‘File’.
    File
  2. You are now in your file library. In the upper right corner you will find the ‘Upload files’ button. Click on it, browse for the images you want to use in your gallery, and add them. Click on ‘Close’.
    Files
  3. Add a gallery to your layout: at the widget menu on the left, choose the ‘Media’ tab. Drag and drop the Gallery widget to the desired location in your template. The Gallery Editor opens immediately.
    Drag & drop
  4. You will see a number of standard images on the right. Click on ‘Delete’ for each image that you want to remove.
  5. In the upper left corner you will see a ‘Upload files’ button. Clicking on this will open your file library.
  6. Select the desired files and click on ‘Send’.
  7. In the Layout section, choose a magnifying glass function.
  8. The size and ratio in the Thumbnail Image section determine which part and how much of your image is displayed. You may have to adjust this later, depending on the focus on your images.
  9. Rearrange the order of your images using the arrows in the thumbnail images.
  10. Add descriptions if desired – those will appear below the enlarged image.
  11. Click on ‘Send’
  12. Publish and view your gallery in Preview. Repeat these steps until you reach the ideal design.

 

Organize your pages into columns

The Columns widget is useful when you want a neatly arranged layout.

  1. Add columns to your layout: choose the tab General from the widget menu on the left. Click and drag the Columns widget into your template.
    Click and drag
  2. Move the cursor over the Columns field until the Edit icon appears in the upper left corner.
  3. Choose the number of columns that you want to use by simply clicking on the number 2, 3, 4 or 5.
    Number of columns
  4. Click on the dividing line between the columns and drag it to the left or right to adjust the width of your columns. A handy tag with the percentage of the width pops up at the bottom.
  5. Place other widgets in the columns.

    Tip:To remove a column widget, you must first remove all content from it. Then move the cursor over the box and click on the red cross.

Updated on 3 September 2020

Was this article helpful?