Webs.com Website Builder Guide

Introduction

Webs.com is a quick and easy website builder with a simple drag and drop interface that allows maximum versatility.    With a wide variety of different features, using webs.com allows you to build a wide variety of different website options.

Webs.com provides a variety of different premium payment plans, in addition to the free basic plan.

Figure 1:  Premium plans

Figure 1:  Premium plans

At $5.99 a month, the “starter” plan allows you to create an unlimited number of pages, receive a free custom domain name, remove Webs branding, create password protected pages, create mobile websites, enable basic statistics, receive 1GB of storage, and get basic email support.

At $12.99 a month, the “enhanced” plan adds on advanced statistics, 5GB of storage, create up to 20 web store items, use premium themes, receive 3 custom email addresses, and receive email and live chat support.

At $22.99 a month, the ”pro” plan adds on unlimited storage, unlimited web store items, 25 custom email addresses, search engine submission, SEO booster, and gets email, live chat, and phone support.

Once you’ve chosen the plan that’s right for you, it’s time to get started.

Getting Started

First, you’ll need to sign up with an email address, name your site, and choose a site type (business, group/organization, personal, or online store).  Then, you’re asked to choose a theme for your site.  You can search by package (free or premium templates), by industry (agriculture & farming, animals & pet care, art & entertainment, automotive & transportation, beauty & spa, business services, constructions/repair/improvement, education & child care, finance & insurance, food & beverage, health & social services, information & technology, law/public safety/politics, manufacturing, marketing & communications, real estate, religious & spiritual, retail & sales, sports & fitness, travel & accommodation, or use of your own photos & logos), or by keyword.  Click on a theme and the color option of your choice to select it.  Then, agree to the terms of service and create your website.  You’ll be asked if you want a custom domain name for $19.95 a year, or a webs subdomain at mysitename.webs.com.  Once you select an option, type the URL you want below and webs will determine if this URL is currently available.  Then, you’ll select your plan choice, after which you’ll be taken to the website builder.

Site Builder

In the site builder, you can add a variety of modules by dragging and dropping them on your page.  These features are presented in icons at the bottom of your page.  Once you add a module, you can hover over it to get the option to drag and rearrange the content boxes above or below one another, or the red X to delete the content.

Figure 2:  The location of the content feature items and their categories

Figure 2:  The location of the content feature items and their categories

Popular

Paragraph

This lets you add a segment of text to your page.

Figure 3:  Text Editor

Figure 3:  Text Editor

  1. Choose a font.
  2. Choose the font size.
  3. Choose the font colour.
  4. Bold your text.
  5. Italicize your text.
  6. Underline your text.
  7. Strikethrough your text.
  8. Choose your text alignment (left, centre, right, or justified).
  9. Add or go back one tab.
  10. Add a bulleted or numbered list.
  11. Clear all formatting.
  12. Add a link. You can link to a page on your site, an external webpage, an email, or a file.

Title

Add a title segment of text to your page.  This is used for section headings.  The only difference in appearance is that it starts out bolded.  It has the same editor options.

Image

Add an image to your page.  You can upload an image, add a free stock image (by searching for keywords), or add an image from a URL.  Once you add an image, you can use the image editor.

  1. Change the image you have chosen from the image upload screen.
  2. Add a frame to your image.
  3. Align your image left, right, or centre.
  4. Make your image a link.
  5. Drag these circles to resize your image.
  6. Zoom in or out of your image within the chosen boundaries.
  7. Rotate your image.
Figure 4:  Image editor

Figure 4:  Image editor

Image & Text

Add an image and text item that are laid out side-by-side.

2 Columns (also in Structure)

Add two columns so you can insert side-by-side modules.  The centre line can be dragged left or right to change the module sizes relative to one another.

Photo Gallery (also in Media)

This lets you upload or select several photos at once.  Then, you can drag to rearrange the photos.  Hover over a photo and click the speech bubble to add an image title and caption, or click on the trashcan to remove this photo from your gallery.

Figure 5:  Photo Gallery Editor

Figure 5:  Photo Gallery Editor

  1. Manage gallery images.
  2. Choose how many photos are in each row.
  3. Choose the image crop style (square, landscape, portrait, or widescreen).
  4. Choose the amount of grid padding between images (none, small, medium, or large).
  5. Choose to enable or disable a light box (this lets visitors view your gallery as a full screen slideshow).
  6. Choose the icon that appears when you hover over the image (magnify, plus, button, or title).
  7. Choose the hover colour (dark or light).
  8. Choose when the title is shown (only on light box view, only on grid view, on both, or on never).
  9. Choose when the caption is shown.

Video (also in Media)

Add a video to your page.  You can upload a video, search YouTube for one using keywords, a username, or a URL, or embed a video code from another website.  The options let you change the video, add a frame, and choose the alignment of the video (left, right, or centre).

Contact Form

Add a form whereby users can send you a message.  The default form fields are name, email address, and message.  If you have a paid plan, you can edit or add new form fields.  You can manage the submit button like you would any other button by clicking on it.

Map (also in Other)

Display a map on your page.  You can enter an address, choose a frame, or align the map left, right or centre by clicking on it.  You can also choose whether or not to show controls, allow a “get directions” button, show a marker at the address of interest, and if the map is in colour.

Button

This lets you add a button to your page.  It has all of the same editor options as text, but also lets you choose the button background colour and determine if you want an icon inside the image (from a list of default icons) and whether it appears to the left or right of the text.

Combos

These are default content sections that provide useful templates commonly found on pages using a variety of different modules.

Timeline

This lets you add a progressive story to your web page.  It contains a title, then rows with text on one side, and an image on the other.  The side with the image alternates each row.  At the bottom, a green plus button lets you add another row for more timeline events.  Rows can be deleted with the red button next to them.

Features

This is for adding a variety of features about your company that you deem important.  Each row has a circular image on the left, a title and subtitle at right, a line, and a description box.  Again, rows can be added or deleted.

Services

This lets you list services your company offers.  Each column by default has an image, a title, text, and a button layered on top of one another.  Under settings, you can choose which of these items you wish to include, and the order in which you want them displayed.  You can also determine the number of columns you want (up to 5).

Team

This lets you add team members in your company.  Each row has a circular image, a title, a subtitle, a social media link area, and a description box stacked on top of one another.  The settings lets you choose the number of rows, and whether or not social media links are enabled.

Footer

This lets you add a footer to your page.  Note that the true site footer can only be customised with a paid plan, but this added in footer can be dragged to the bottom of your page to function as a de facto one.  By default, your footer has your site name, your account’s email address, a phone number slot, an address slot, and a social media buttons slot.

For headers, note that you must click on the pre-made header at the top of your page where your site title and menu appears.  In the header, you can enable or disable logos, titles, or taglines.  You can also add text or videos (which can be dragged around the header).  You can also enable a grid in header view for optimal text and image alignment.

Menu

This lets you add a restaurant menu to your page.  Each row has room for a dish title and description on the left, and a price on the right.  Similar to other combo modules, rows can be added and removed.

Quote

This lets you add a quote to your page.  It has space for a quote within large quotation mark icons, and space at the bottom for the author of the quote.

Contact

This lets you add contact information for your company.  It has a row for an address, contact phone and email, hours, social media links, and a map across the bottom.

Structure

3 Columns

This lets you divide your content into three columns of modules.

Table

This lets you add a table to your page.  By default, it comes with a header and one cell.  You can use the “+ column” and “+ row” buttons to add columns and rows.  The individual cells can be edited with the typical text options.  The settings allows you to enable or disable a header or border, choose a header colour, choose a row colour, and choose to have every other row be a different colour with “alternate row colour”.

Divider

Add a divider between content.  You can choose from a variety of styles, and choose if you want a dark or light style.  The advanced settings lets you choose the margin size, the width (percentage of the module space), and the position (centre, left, or right).

Spacer

Adds a row of blank space that can be dragged for an increased size between items.

Media

Slideshow

This lets you add a slideshow of images to your page.

Figure 6:  Slideshow Editor

Figure 6:  Slideshow Editor

  1. Manage slideshow. Here, you can add new images, reorder them, or hover over added images to add a caption or delete an image.
  2. Display the slideshow with no thumbnails.
  3. Display the slideshow with thumbnails on the bottom.
  4. Display the slideshow with thumbnails on the top.
  5. Align the slideshow left, right, or centre.
  6. Choose if the slideshow is on auto play.
  7. Choose whether or not a background is on the slideshow.
  8. Choose the background colour.
  9. Choose the speed of the auto play.
  10. Choose the transition between slides (fade, puff, horizontal slide, vertical slide, horizontal carousel, vertical carousel, or none).

Audio

Add audio to your page.  You can upload an audio, choose the size (small or large), and choose the scheme (light or dark), the color, and whether or not it is on auto play.

Icon

Add an icon to your page from the stock icon library.  The settings let you change the icon, choose its color, choose its alignment (left, right, or center), and turn it into a link.

Social

Social Links

Add links to your social media pages.  Under “manage social links”, choose “add a link” next to the social media sites you wish to incorporate.  You can either input a URL or a username.  You can link Facebook, Twitter, LinkedIn, YouTube, RSS< Tumblr, Blogger, Flickr, Vimeo, Last.fm, Pinterest, and Instagram.  You can also use settings to change the icon style of these social links.

Twitter Feed

This lets you add a Twitter feed to your site by entering a username.  You can also change the settings to modify the text colour, link colour, and background colour.

FB Like Box

This lets you add a Facebook like button to your page by entering a URL for a Facebook page.  Settings lets you choose whether or not to add a header, to show faces next to the usernames of people who have liked you, and whether or not to show a stream of people who have liked you.

FB Comments

This lets you add a Facebook comments section to your webpage.  Under settings, you can choose the number of posts and the colour scheme (light or dark).

Follow

This lets you add a Twitter follow button so people can click a link to automatically follow your twitter username.  You simply need to input your Twitter username.  You can choose the alignment (left, right, or centre), decide if the follower count is enabled or disabled, and the button size (medium or large).

Share

This lets you enable a button to share content from your site on social media.  You can choose if the display is number of shares, small icons, or large icons.  You can also choose which icons to display (like, tweet, email, Google plus, and “more”).

Commerce

PayPal Buy Now

Use this to allow visitors to purchase something on your site via PayPal.  You can edit the button to input a PayPal username, an item name, the price, the shipping amount, the tax, and the button style (large, small, or large with credit card logos).

PayPal Donate

This lets you to allow users to donate to your site via PayPal.  You can edit the button to input a PayPal username, what the donation is for, the donation amount, and the button style.

Products

This lets you add a product from your webstore to your page.  “Manage Products” lets you choose the products you have created that you wish to add to your page.  The settings allows you to choose the products per row and whether or not to display the name, price, and/or button.

Other

Custom HTML

Add custom HTML code to your page.  This can only be done if you have a premium plan.

Subscribe

This lets you add a form for visitors to subscribe to your website.  The form has name, email, and verify email.  The title and button can be changed with the typical options.

Featured Products

This adds a display of the most popular items in your web store (if you have one).  It displays the image, a link to the item, and the item’s price.

Recent Photos

This adds a display of the most recent items added to your photo album page (if you have one).

Pages

Page Settings

In the upper right-hand corner, you’ll find the settings for your page.

Figure 7:  Settings

Figure 7:  Settings

  1. Undo last change.
  2. Redo last change.
  3. View a live preview of your website.
  4. Rename the current page.
  5. Edit the Meta tags and description of the page.
  6. Hide this page from the navbar.
  7. Password protect this page if you have a premium plan.
  8. Change the page layout. You can choose standard, a sidebar on the left, a sidebar on the right, with a banner, with a banner and left sidebar, and with a banner and right sidebar.
  9. Learn how to use site builder more efficiently.
  10. Create a new page.

Pages Menu

Click on the Pages bar at the top of the page to access the Pages menu.

Figure 8:  Pages menu

Figure 8:  Pages menu

Figure 9:  Page Editor
Figure 9:  Page Editor

  1. Add a new page to your site. You can choose to add a standard page (and its layout), an app page (web store, blog, photo albums, or calendar), or an external link.  At the bottom, you can input your page’s name.  Note that free plans can only have up to five pages.
  2. When hovering over your pages, drag them to rearrange their order in the menu bar that appears in the header of each page.
  3. The home icon appears next to your home page.
  4. Rename this page.
  5. Create a copy of this page.
  6. Change this page’s settings. Choose MetaTags, password protect it (if you have a premium plan), or hide it from the Navbar.
  7. Delete this page.

Apps

Photo Album

When you create this app, you’ll be asked to upload images into your first album.

Figure 10:  Photo Album Page Editor

Figure 10:  Photo Album Page Editor

  1. Change the gallery settings. Modify the gallery title, description, and view (slideshow or social gallery with commenting).  The description can be modified through most of the typical font tools.  You can also add links, videos, images, and emoji’s, as well as modify the HTML source code.
  2. Edit the photo album categories. Then, you can rename them, move them up or down, or remove them.
  3. Add new photos to your albums. You can choose to add these to a new or existing album.  For each album, you can choose a title, description, and category.  For each photo, you can add a title, caption, move it up or down one item, rotate the image, delete the image, set the image as an album cover, or move the image between albums.
  4. Sort your album by category or view all.
  5. Edit this album and the images within.
  6. Add images to this album.
  7. Remove images from this album.
  8. Drag albums to rearrange the order they appear on your page.
  9. Click on the link to preview how the album will appear on your page.

Calendar

Use this app page to add a calendar of events to your website.

Figure 11:  Calendar Page Editor

Figure 11:  Calendar Page Editor

  1. Change the calendar settings. Choose the page’s title, the description, the time zone, the default calendar view, and who can post comments (anyone or no one).  You can also choose to delete all posted events, overlay automatic events on your calendar (religious holidays, moon phases, or country holidays), and choose if you want to import events from an existing calendar in iCal format.
  2. Add a new event to your calendar. You will need a title, description, start and end time and date (or if it is an all-day event), repeats (daily, weekly, monthly, yearly, or never), and the location (if desired), with an optional link to a map.  Once these events are added, you can click on them to view them and post comments.  You can also edit or delete the event.
  3. Switch between months (or weeks or days, depending on your current view).
  4. Switch the calendar view type. All events simply displays a list with the listed date, time, and title of your events.
  5. Add an event to this specific day.

Blog

Use this app page to add a blog page to your website.

Figure 12:  Blog Page Editor

Figure 12:  Blog Page Editor

  1. Modify blog settings. You can add a blog description, choose the default view (full or summary), choose who can post comments (everyone or no one), choose the comment display order (oldest first or newest first), and choose how many blog entries to display per page.
  2. Edit categories into which you can place your blog posts. You can add a new category, or modify old ones (changing the name, changing the location in the list of names, or removing it).
  3. Create a new blog entry. You can choose the title, up to three categories, the post time (if you want to post it in the future), if you wish to disable contents, and the post content.  You can then either publish it, or save it as a draft.
  4. Search through your blog posts for specific key words.
  5. Choose to view your blog posts as full or summary posts.
  6. Sort your posts by specific categories.
  7. Toggle between viewing published posts, or drafts.
  8. Click here to view a live view of this blog post. From here, you can post an “owner’s comment”, as well as view other current comments.  You can also use arrows to go to older or newer entries.
  9. Delete this blog post.
  10. Edit this blog post.
  11. View comments for this blog post.

Webstore

This lets you sell items on your page.

Figure 13:  Webstore Page Editor

Figure 13:  Webstore Page Editor

  1. Manage your store settings. To add a payment provider (PayPal or Stripe), you’ll need to have a premium account.  Here, you can manage your store currency, description, policies (which appears on the shopping cart page), and purchase confirmation and cancel messages.  You can add coupons or shopping cart headers if you have a premium account.  You can choose the image crop style (full or square), the products per row, the default sort (none, newest first, sale items first, price low to high, price high to low, or alphabetical), choose to show or hide the search bar, and say how many items must be left for you to start displaying the remaining inventory (if set blank, it will never be displayed).
  2. Edit item categories. You can add a new category by providing its name, deciding if it is present in the navbar, and providing a description.  Once added, you can rearrange the category order, as well as remove a category.
  3. Add a new product. You can provide a product name, description, image (or images), and category (or categories).  You can add a price, a sale price, a tax (none, settings from PayPal, or set percentage of price), and options for the product (like sizes and colors).  You can add additional instructions (a question that the purchaser fills out upon checkout), shipping option by countries (cost for the item alone or them item added with others), and item status (active, new, on sale, sold out, coming soon, free shipping, or hidden).
  4. Search for a specific item on your page.
  5. Choose a sorting method for your items. In addition, if you have categories you can select them below to only show items from that category.
  6. Clicking on the item will take you to view a live preview of it on your page. Hovering over the item allows you to select to edit or delete the item.  You can also perform these actions form the item preview page.

Conclusions

In summary, webs.com makes it easy to create functional websites of any type.  However, their required themes are lackluster, they don’t offer a lot of freedom for modules or module placement, and they are notorious for poor customer service.  Overall, webs.com is an acceptable way to create a new, fully-functional website, but it wouldn’t be my first choice.

Figure 14:  Support Menu Access

Figure 14:  Support Menu Access

For additional support for webs.com, you can use the support button at the top of any page to search through and access FAQs.  If you have a premium plan, you can use this button to get email support, chat support, or phone support.