2018 SiteBuilder Updates Online Now

Site Builder Updates – 2018
2018 SiteBuilder updates are now online and ready for all customers to use.  This update will feature many new enhancements and optimizations.

Updates
– HTTPS Security
– Mobile Editing
– Performance
– Data/Privacy GDPR
– Site Editor Updates
– System/Components
– Design Updates

HTTPS – TLS / Secure Connections enhancements.
With the Google Chrome update this July, Google will start displaying all websites that are not using HTTPS as “Not secure”. The site builder update will automatically enable HTTPS for all websites. The system will install a HTTPS certificate and redirect all pages to secure mode. The certificate setup is completely automated and will not require customers to do anything. Basic certificates will be included with all site builder plans (no additional fees to users).

Even with the switch over to HTTPS, some sites may still not display as secure because they have custom HTML,scripts and code. Customers will need to review their sites and update any pages that are not displaying as secure.

We will still offer enhanced certificates for purchase.

Site Editor Mobile Mode
The mobile edit mode makes it much easier to manage your site and edit content from mobile devices. When logging in from a mobile device users will have the option to switch to the mobile editor. The mobile editor simplifies the editing environment and uses responsive design to make the site editor much easier to use.

Touch/Swipe Support
The content slider has been updated to support swiping left/right to change slides.

Performance/Speed Optimizations
Many optimizations are being enabled to help sites load faster on both web and mobile. Optimizations include..compressing and combining script/css files, optimizing scripts to load and run after the page loads optimizing HTML pages, server enhancements, and more.

#Privacy/Data Policy (GDPR)
Starting this month the Europe Union (EU) General Data Protection Regulation (GDPR) will take effect. This regulation affects customers in the EU as well as any website that has customers/visitors from the EU. We are not experts on the law. It is very complex and has many requirements. It is up to website owners to determine what they must to do comply with the law. Depending on your location and where your customers are from, site owners may need to make adjustments to their site and how they use data.

Here are just a few of the components of the law….The law requires site owners to be more transparent about what data they collect from users and exactly how they use the data. Websites need to have a clear privacy/data policy. Users have a right to request all the data that you have collected about them as well as the right to have all of their data deleted (right to be forgotten). Data collection and usage is Opt In. Users must explicitly agree to each way that a site owner may want to use their data.

We are making adjustments to help site owners comply with the law and will continue updates as we learn more.

– Check boxes for mailing list signup (not checked by default)
– Form builder – new option to have required check boxes to submit a form
– Global privacy policy setup – privacy link is automatically added to forms that collect data
– Form to request user data – we are putting together a process to generate a report on data that the system has about a user.
– Form to request user data deletion – we are setting up a process to delete data about a user

NOTE: The site builder data reports will only include data from our systems. To be complaint with the law, site owners need to also report/delete any other data they have about users. This could be in emails, downloaded files, or data added to other systems out site the site builder such as a CRM system.

Site Editor UI
The site editor UI has been updated and optimized to make it easier to edit and manage your site. Many pages now have sticky apply buttons so you can scroll up/down and click apply without having to scroll back to the top or bottom.

Power Edit Key (Experimental)
When viewing or editing a page hold down the CTRL key when hovering over a component. Click the component to quickly access the component editor. This feature allows you to jump directly to the component editor without having to scroll around and click the “EDIT” link above the component. It can also be used on the site menu, banner, logos and footer areas.

InPage Editing (Experimental)
When editing a page, hover over text areas and titles. Click on highlighted areas to edit directly text on the page.

New Templates / Styles
New layouts have been added and with more layouts and style sets coming soon.

Design Area
The design area UI has been updated to focus on the design and text styles. With a couple of clicks you can easily adjust your base style settings for default text and titles.

New Design Styles
Several new styles have been added. These include groupboxes, page titles and tabbed content boxes.

Menu Options
New templates now have the option to enable/disable the sticky menu and inverse menu options. You can also set the sub menu in/out animation styles.

Page Layout
Adjust column widths from the page layout area.

Page Layouts Modern Style
Several new starter page layouts have been added. Click add page and choose the modern layouts. New page layouts include a quick option to start with a single page website layout.

Social Networking Icons
New modern style social icons have been added. These icon styles are designed to help your pages load quickly.

File Manager
The file manager has been enhanced to make it easier to select and manage your images. View images and adjust image sizes so you can see more.

Component Slider/Flow
Add components into a slider. Choose how many components to show on the screen and use navigation arrows to cycle through the list. There is an option to quickly copy the last component to make editing faster. With component flow you set the number of columns and components are automatically arranged on the page to fit. Both the slider and flow modes are responsive and will auto adjust for mobile.

Form Builder
The form editor has been updated to help make setting up your forms easier. There is a new option to setup required checkbox fields. The UI for showing required fields to users has been updated.

Blog
New option to enable a “read more” button under the blog post summary. New blog styles.

Big Text Component
Add styled/larger text to your site.

Facebook Feed Option

Designs

After the full update is out, We will be adding many new design/style options.

If you have any comments or questions, just let us know.

New SiteBuilder Updates Online.

New Templates / Styles

New layouts have been added and many more are in the works. These responsive layouts give you the flexibility to setup any kind of design to meet your needs.

New Page Layouts

We have made it easier to create fantastic looking pages. Our new page layouts will get you started with great looking pages. Select your page style, upload images and enter your text.

Updated Text Editor

The text editor has been updated and now supports the Microsoft Edge Browser

Image Hover Animations

Enable advanced hover animations for images. When visitors move the mouse over an image, you can set the image to zoom in. For image captions you can set the captions to fade in on top of the image or display with a slide in animation. To setup hover animation go to the design->advanced settings->animated transitions page. More great animations coming soon.

Simplified Text Edit Bar

Remove clutter from the text editor and quickly access primary editing functions: styling text, editing links and inserting images.

Long Page Updates

The long form pages are now much easier to edit. You no longer need to select which section you are editing. The full page can be edited at the same time. Edit and easily move components anywhere on the page.

Mobile App Services (Beta/Upgrade)

Are you looking to have an App in the IOS AppStore or Google Play Store for your customers/site visitors to download? With the new App Services we can take your existing website and turn it into a downloadable App. Once it is created, you can use the site builder to manage the content displayed in your App. Contact Support for more information.

Copy Component

Once you have a component set with all the options that you want, it can easily be copied so you can start editing with the setting that you like to use. To copy a component, tap the green box to the right of the component edit link and then click the copy button. NOTE: only some components support the copy feature.

New Icons

Hundreds of new icons have been added to the icons area. To add icons to your pages, use the image component and then tap the choose icon button. You can select different icons styles and customize your colors.

More Button for Text Components

Easily add a more button to the bottom of your text components. The more button creates an easy way to link a quick text paragraph to a detailed page with more information.

Text/Image Animation Component

Create dynamic text/image animations. As you scroll through pages text and images will animate.

Animated Rotating Word Component

Use the rotating word component to create an animated text sentence. Choose a word in the sentence and have to rotate between different words. Customize colors, words, animations and more.

Mobile Enhancements

Many updates have been added to help your pages display better on mobile devices. The new responsive templates have updated menus and options for search and viewing a shopper’s cart.

Form Component

This is a new mode that allows the form to auto size to fill the available page space. The form now allows for larger files to be uploaded when visitors submit a form. The new date field type allows visitors to enter a date or select the date from a popup calendar. The date field will show in newer web browsers.

Spacer Component

The spacer component allows you to add more space between components and sections. Adding space between components can help your pages to be easier to read and navigate.

Groupbox/Icon

A new groupbox style has been added that allows you to customize the color and choose an icon or image to be displayed at the top of the box.

Ecommerce

  • Miscellaneous updates to Amazon payments
  • Product option that requires a user be logged in to view pricing and order a product
  • Miscellaneous subscription feature enhancements
  • Company name can now appear on packing slips
  • Miscellaneous updates to product display
  • ShipStation upgrades and updates
  • New USPS shipping method options and removal of some methods per USPS updates
  • Miscellaneous PayTrace gateway enhancements
  • More custom text options for ecommerce
  • Subscription recurrence date can be changed
  • Option to automatically cancel a subscription
  • Inventory alert notice now includes link to edit the product
  • Coupon enhancements
  • Stripe gateway enhancements
  • AUPost API upgrade
  • VAT tax calculations for shipping fees
  • Google category setting for Google shopping export
  • Support added for Mastercard 2 series cards
  • Square gateway
  • Security updates to use stronger ciphers for PCI compliance
  • Checkout quantity restriction enhancement
  • My account and billing info update

SSL

  • Option to purchase SSL Certificates
  • SSL browsing enhancements

Forms

  • Updates to spam filtering for forms
  • New form date field option
  • Form file upload now allows for larger files

Responsive/Mobile Updates

  • Form enhancements to work better on mobile browsing
  • Responsive banner will display the logo if set
  • Miscellaneous responsive template updates
  • Responsive design updates
  • Miscellaneous mobile updates

Media

  • Audio playback enhancement for newer browsers
  • Video backgrounds on long form page

Design

  • Rotating banner updates
  • Content slide banner can now be set to different sizes on home versus other pages
  • Image gallery component upgrades
  • Blog enhancements
  • Image resizing adjustments

Long Form Pages

  • Long form page footer enhancements
  • Video backgrounds on long form page
  • Long form pages can now be copied

Google/Search Engines

  • Google tag manager
  • Google maps update

Speed/Quality

  • CDN enhancements for faster image loading
  • Site search enhancement
  • PCI compliance upgrades

Miscellaneous

  • Domain manager enhancements
  • User account can be directed to a specific page after login
  • Site owner notification when a user account is created
  • Custom page – allows a custom section layout

Coming Soon

  • Text Animations
  • Page section backgrounds
  • Image Hover Effects
  • New components
  • Text formatting updates

Custom Web Design Process for SiteBuilder CMS

 

This is an overview of our SiteBuilder Content Management System (CMS) web design process. This is only for customers that want a full custom or highly modified Website built out on our SiteBuilder CMS Platform.

Initial Consultation/Pre Service Agreement:

1. Discuss customers business goals and objectives for the website.
2. Receive requirements document/email from customer.
3. Review requirement document and contact customer with any questions or concerns.
4. If, no requirement document is provided, we offer an option to work with the customer on a consulting basis to development one.
5. The most basic of requirements would be, Navigation structure, theme, number of pages and sub-pages, special functionality such as eCommerce or other interactive features. (This can be a very long list) We would also ask for links to sites you like with an explanation of what you do or don’t like about the sites.
6. Once site requirements are submitted and approved, we prepare and submit our proposal to the customer.
7. Customer accepts or rejects the proposal.

Service Agreement

1. If the proposal is accepted, we email over the service agreement.
2. Service agreement needs to be signed and emailed or mailed back to us.
3. We Typically require half of the payment for the web site as Initial payment. The final payment is due upon completion or on a specified date. However, for smaller sites we require payment in full up front. We accept checks or major credit cards (except Discover) as payment. Payment may be made securely through our online form.

Design Specs (look and feel):

1. We will need your logo in electronic format (no scans). The preferred format is Photoshop .PSD or high quality .GIF or .JPG
2. We typically base the color scheme of the site on the logo colors. However, this is subjective and we can base it on complementary colors or colors of your choosing.
3. We ask that you send us 3 or 4 sites that you like and tell us why. You may like the colors on one, the layout on the other, the ease of navigation of another and so on. This gives us an idea of the style that you like. Another option is to just have us design it to one of our industry leading, professional specifications.
4. Once we get a good idea of what you are looking for in the design, we start on the integration into the SiteBuilder CMS.
5. At this point, we need to activate your SiteBuilder Hosting Account. We will need a credit card for this.
6. We publish the site online for you to review. Note: Site will be online but not mapped to your domain name at this point.
7. At this time, the customer either approves the design or asks for revisions.
8. Once the design is approved, we complete the site.

Content integration

1. Once the design is approved, the customer must send us the content for all the pages of the site that are under development.
2. Content development includes written copy and images that you may want to go on specific pages. We recommend stock images unless you have a professional photographer. We have resources that we can recommend for stock images. The sooner you can get this to us the faster your project will be completed.
3. The customer should specify where the content is to be integrated. All copy needs to be sent to us in electronic format such a Microsoft Word .DOC format. Images can be sent in .JPG format.
4. When we receive ALL of the content, we start on the content integration.

Web Space (Hosting):

1. You will be hosted on our SiteBuilder Server which is an integrated Content Management System
2. To view plans, pricing and options please see our Sitebuilder Plans page.

Testing and Live deployment:

We make every effort to make sure you have adequate time to review all aspects of your site. After you review and approve the site, we map it to your domain. At this point, we turn the site over to you.

Maintenance:

Since SiteBuilder is built on a content management system so it’s easy for you to go in and edit the site yourself. If you do not have the time or inclination, we offer several maintenance options.

Options include a Retainer based plan and an hourly based plan. The retainer based plan can be customized to your needs specific needs.

Customer Spotlight – sfsalt.com

The San Francisco Salt Company, (sfsalt.com) has come a long way since they developed their first site with us in 2002. The founder, Lee Williamson, would balance long work days and in turn, tool long soaks in the tub each night. Feeling fresh and invigorated each morning he decided to spread the word of the amazing benefits of bathing in sea salts. Things took off quickly in 2002 and the San Francisco Bath Salt Company was formed focusing mainly on Bath Salts.

With the growing demand for gourmet salts, and continued requests by retail and wholesale customers, it was no surprise a few years later when we expanded with a second production facility dedicated to gourmet chef salts. They are now officially the San Francisco Salt Company.

Fast forward to 2015, San Francisco Salt Company is now a top Worldwide supplier of retail Bath and Gourmet Sea Salts. Furthermore they are one of the leading Wholesale and Bulk Bath Salt providers in the industry.

San Francisco Salt Company

Site Features:

  • Custom Design with integration into SiteBuilder CMS
  • Home Page Slide Show
  • Full featured Shopping cart
  • Hundreds of products
  • Worldwide sales
  • Sitebuilder Secure Platform

eCommerce Checklist – Are you Ready?

Thinking about selling a product, a product line or a variety of products on your Web site?  Here are a few things you will need to think about before and during the process of setting up your eCommerce Web site.

Choose the Right Shopping Cart Software

There are many off the shelf eCommerce solutions.  Some are free (open source) and some aren’t.  You want to choose a cart that:
1.  Has all the features you need now and in the future
2.  Is constantly updated,  upgraded, patched and improved
3.  Is supported by a development team.
4.  Is Secure.

There’s nothing worse than purchasing shopping cart software and then being unable to reach the developers or support when you have a problem.

Budget

You must determine what you are willing to spend for the options and functionality you need.
Shopping cart software costs range from free to tens of thousands of dollars. Developing a custom cart from the ground up can cost even more.
The free options may sound good at first until you run into problems or need support that is non-existent.  Which leads us to…

Support

Support of a cart is the probably the most important aspect. If you have a problem, (and you will) does the software provider provide live support?
Do they have a phone number on the site for support?
Do they charge for support?
You may be surprised by the number of software providers that do not even provide a phone number.

Cart/Server Setup

The shopping cart should be professionally installed on your server by a qualified server admin or the cart software programmer.  There are typically many server/cart configuration options that can be very confusing if you are not familiar with the environment.
A database will also need to be setup and tied into your cart.
Also be sure to choose a cart that is compatible with your server operating system.  Typically, Linux servers will run PHP and Perl solutions and Windows servers will use .ASP and .NET applications.

Choose whom you will use to ship your product

Typical Options:
UPS
FedEx
USPS (United States Postal Service)
DHL

Choose how you will calculate shipping cost
Some options would be:

Live rate lookup
Weight based table
Price based table

Live Rate Lookup
Our shopping cart software supports Live shipping rate lookup.  This means that it will return a shipping cost to the customer based on the actual product weight plus packaging.
(Setup varies depending on service selected)

We recommend the live lookup option if possible.
You will need to provide the weight for each product. (Including packaging)

Weight-Based Table

Alternately, you can use a weight-based table.
Weight-based Table Example:

Total Order size (weight) Shipping Price
0 – 29.99 = $9.50
30 – 59.99 = $4.50
60.00 and up Free ($0)

Cost-Based Table
If you choose shipping rate by cost of the product, you will need to setup a shipping rate table and associated costs.

Example of a Cost-based shipping table.

Total Order size (dollars) Shipping Price
$0-$24.95 = $9.00
$24.96-$49.99 = $5.00
$50.00 and up Free ($0)

Note:  The free is just an example of what you can offer.  You do not have to offer free shipping.

How will the package arrive at the shipping office?

Shipper picks up package from you on a regular basis
You deliver the package to the shipping office

This will impact your shipping cost.

Things to consider:

Package size can impact cost of shipping
Handling charge.  You have the option to add a handling charge
What countries will you ship to?

Note:  Shipping is a VERY important aspect of setting up your eCommerce shop.  Setting shipping rates too high is one of the leading causes of shopping cart abandonment.

Product Categories

You will need to determine how many product categories you are going to need and how many products will be in each category.  It’s best to start of small and add products over time.

Product Images

You will need product images.
We recommend a professional photographer.  It is essential that your photos be of top quality.  In some cases you may be able to get them from the manufacturer.
A poor quality image looks unprofessional and will not help sell your product.
However, if you choose to take the photos yourself, try and follow these guidelines

Use light backdrops (not white)
Try and use natural sunlight or studio lights that produce no shadows

You will need a thumbnail image and a larger detailed image.  There is a variety of good photo editing software on the market.  Paint Shop Pro is a good low cost, multi-purpose editor.
Adobe Photoshop is the top of the line software tool for photo editing, retouching and compressing your images.  The choice of professionals.

Photo Naming Convention

Be sure and categorize the images and give them descriptive names.  If you use numbers, be sure that they correlate with the product description detail “Photo Name” (see below).  Typically save in .JPG format.

Delivery Options (if we are doing the work)

Burn to a CD or DVD and mail to us
Zip and email (if less than 5 megs)
FTP – Publish on your site in a specified directory and give us FTP access

Product Description

For each product, you will need a written description.

You will need a Short description (one sentence) and a Long description (paragraph or more).

You want to attract and intrigue potential shoppers so be sure to use interesting copy that is full of adjectives and possibly a bullet list of features in the long description.

Product Details

Depending on the cart used, you may have to adhere to the following format.  Use a Word document or Excel worksheet for each category. Please name the document/worksheet relevant to the category, i.e. name it Widgets if the category is Widgets.

Category:
Item Name:
Description Short:
Description Long:
Photo Name:
Item or product #:
Sort Code:
Shipping Weight:
Price:
Keywords associated with the product:
Options: (color/size/scent/etc.): (If applicable)

(If we are doing your work, please submit all the products and images at one time.)

Merchant Account/Taking Payments

What is needed to accept credit cards online?

You will need a merchant account and a payment gateway.

Options:
A.    If applicable, use your existing merchant account and setup an authorization gateway (authorize.net, Linkpoint, etc.) that will interface with your merchant account through your cart and handle the transactions in real time.

B.    Setup a new merchant account and payment gateway.  This is the most professional setup and will instill confidence in your customers.

C.    Interface with PayPal.   We consider this a stop gat measure until you get your merchant account and payment gateway setup.  Many people use PayPal as an entry point for eCommerce or selling products at lower volumes.

Security

All transactions should be encrypted via SSL (Secure Socket Layer) This requires a security certificate to be installed on the server.  There is a variety of SSL vendors such as Verisign, Thawte, GeoTrust and many more.  This is absolutely essential for any site accepting credit card payments online.

Other configurations
Take your time and go through all the configuration options.  Shopping carts are complex programs and there are often 10 or more page of configuration options.  Each option should be reviewed to determine if it’s right for your store/product.

Ultimately, setting up an eCommerce solution takes a lot of thought, time and effort.  Advanced Web Site Publishing has setup hundreds of eCommerce solutions. We are also experienced in all facets of running an eCommerce site.  Let us recommend the correct solution for you.
Contact support@awsp.com for more information.

Integrate MS Word Content in SiteBuilder

Integrating content is a very simple thing to do with SiteBuilder.  However, there are incorrect ways to do this that can cause problems.  I will briefly talk about them here.

The most common problem is when customer’s copy and paste text/written copy from Microsoft Word into the SiteBuilder WYSIWYG text field.  While this seems innocuous, it actually can cause lots of issues.

Common issues:
Browser incompatibility
Different font sizes and spacing
Blown out table cells
Entire site spacing issues
Large WYSIWYG toolbar images
Incorrect HTML
Search engine unfriendly
Heavy page to download.  (Extra code increases file size and increases load times)

This occurs because when you copy from MS Word, you are not just copying the text on your document, you are also copying the “invisible” markup code that is behind the scene that controls the look and feel of the Word document.  MS Word markup code is not compatible with HTML and a combination of the two will cause multiple site errors.  Your browser cannot understand the Word markup.

Example:
Here is an example of some Word markup pasted into a SiteBuilder site.

In SiteBuilder the text looks like this:  Welcome to My Site

However, if you look at the source, it looks like this.

Word Markup:
<p style=”MARGIN: 0in 0in 10pt; LINE-HEIGHT: normal; mso-margin-top-alt: auto; mso-margin-bottom-alt: auto”><strong style=”mso-bidi-font-weight: normal”><span style=”FONT-SIZE: 14pt; COLOR: #9bbb59; FONT-FAMILY: ‘Times New Roman’,’serif’; mso-fareast-font-family: ‘Times New Roman’; mso-themecolor: accent3″><font color=”#008080″>Welcome to My Site</font></span></strong><span style=”FONT-SIZE: 12pt; COLOR: black; FONT-FAMILY: ‘Times New Roman’,’serif’; mso-fareast-font-family: ‘Times New Roman’”>

This may look familiar to anyone who worked with “Reveal” codes in the old Word Perfect program.

Proper HTML would look like this:
<p>Welcome to My Site </p>

All formatting should be done using the SiteBuilder WYSIWYG tool.  This will ensure proper HTML formatting.

Solving this problem is very easy.  Just copy from MS Word and paste into Notepad or any text editor.  This will strip away the Word markup and leave you with clean text!  Next, copy from notepad the paste into SiteBuilder.  Apply any formatting you need such as Bold, color, etc. and your done.

Another way to add clean text to your page is to type your copy directly into the text area in the SiteBuilder interface.

Update:  SiteBuilder now has a Paste from Word feature in the WYSIWYG editor.  If you are pasting from Word, remember to use it!

Is Your SiteBuilder Site Search Engine Friendly?

The SiteBuilder developers have worked very hard to make our online Website Builder responsive and search engine friendly, however,  there are changes you can make to circumvent  those efforts.

These are the top 5 things to consider.

  1. One of the worst things you can do is setup an intro screen or a “splash” page before you get to your main content. Many times this is Flash that has no readable content for the search engines to pickup. Your home page is the most relevant page to the search engines, do not waste it on a splash page.
  2. Using I-Frames. Do not place content in I-Frames. The search engines do not recognize this as on page content and will not index it.
  3. Do not use images instead of written text on your pages. Search engines cannot index text that is in an image. Make sure you do not overuse images where you could use written text or CSS that the search engine can index.
  4. Slow page load times. Google is starting to look at page load times. Heavy pages may be penalized. Therefore, you need to keep the page loading fast as possible.  If you need to put images on the page make sure they are optimized locally (jpg compressed to 60%) on your local machine before uploading  We highly recommend Photoshop or Photoshop Elements.
    A JPG should always be compressed.  For instance, using Photoshop or Photoshop Elements a 1.3 meg photo can be compresses down to 60k without losing definition.  The quality setting should be set at 60 when compressing JPG images.  All good image editing software will have a similar feature.  A good image editing program is a must for web design.
  5. Pasting from Word and using HTML tables.
    a) Pasting from MS Word will also paste in the markup from Word which is not HTML .  This can throw the design and responsive nature of the site off.  If you paste from work, use the paste from Word tool that strips out the Word markup or paste to notepad, them copy from notepad and paste into your content area.   This effectively strips out the Word Code.
    b) Using HTML tables instead of CSS can cause the site to display improperly in devices, essentially mucking up the responsive nature of the site.  There is no need to use tables anymore.   CSS is the way to go to keep your site responsive.

These are just a few tips to give you a good foundation for starting your SEO program.