WebBuilder Quick Start Guide
1. Introduction
Myers WebBuilder is your website control center. In WebBuilder's Web Site Editor you have the ability to add pages and photos, edit content, and much more. To access the Web Site Editor, follow these easy steps:
- Log in to Originator Network.
- Select "Manage Website" on the top navigation bar.
- Select "Edit Web Site" on the left navigation bar to access the Web Site Editor. Use this area to make changes to your web site.
- To return to the Web Site Editor home page, select the Web Site Editor logo in the upper-left corner of your screen.
The convenient checklist helps you identify the main tasks associated with administering your website. The customization process is outlined and involves editing, previewing, publishing and viewing your website.
Your website is composed of text, graphics and much more. Powerful, user-friendly wizards take you step-by-step through many editing and administration processes. Click the links directly on the checklist or on the left navigation bar to access wizards. Wizards let you save and preview changes to your site. When you are satisfied with your changes and want them to be displayed on your live site, select "Publish Changes." If you don't want to publish your changes, select "Exit" to return to the main page. Your changes will be saved in your back office, and can be published at a later time. If you decide to publish your changes at a later time, click on the "Web Site" tab located on the top navigation bar. You will notice a "Publish Changes" button in the upper right hand corner. If you do not have any outstanding changes to be published, you will see a "Published" button instead of the "Publish Changes" button.
Here are a few helpful wizards to get you started. You'll find these under the Web Site tab.
3.1 Change Style and Color
The first wizard you'll find on the left nav bar is "Change Style and Color". Click this link and experiment with many available website colors and styles.
3.2 Home Page Configuration
The next link is "Home Page Configuration." Follow the link to reach a wizard which will guide you through the process of changing the design of your home page.
3.3 Search Engine Optimization
In your website administration portal, under Search Engine Optimization, follow any of these links to access wizards for editing the Meta tags (Title, Keywords, Description, other) on all your content pages, including your home page.
View the tutorial: click on the link and get a quick introduction to search engine optimization.
Also follow each of these wizards to help you set up your web site optimization.
- Is my Web Site listed with Search Engines?
- Submit my Web Site to Search Engines
- View Referral links Report
- Edit Home Page and Flash Intro Page Titles
- Edit Default Keywords and Descriptions
- Edit Title, Keywords and Description by Page
- Edit Additional Default META tags
- Edit Additional META Tags by Page
- Count Keywords
3.4 Add Page
"Add Page" is a powerful tool to help you provide additional content to consumers and increase your search engine ranking. Use "Add Page" to create or edit many consumer oriented content pages, and create custom forms on your website. Include keywords in your content.
During the process of adding a page, you may:
- Create an editable content page
- Create custom forms and custom registration forms
- Link to an existing page on your web site
- Link to an external web site
- Feature a page link in your site's navigation bar
- Open the page in a new or current browser window
3.5 Add Category
Do you have new content that needs its own category on your web site's navigation bars? Create a new category with this smart Wizard!
3.6 Edit Pages & Categories
Would you like to rearrange or remove some of the system content we provided? Want to change editable content, or remove links or categories? Use "Edit," "Unlink" or "Delete."
3.7 Upload Documents & Images
Use this tool to upload special photos and important documents (e.g., videos, disclosures, testimonials, etc.). The following file types are supported: GIF, JPG, TIF, PDF, DOC, XLS, TXT, HTML, PPT, PUB, WAV, RMF, AVI, AIFF, MIDI, AU, RAM, MOV, MPEG, WMV, MP3 and SWF. Each file can be up to 5MB in size.
The Edit Layout Mode Tab offers an intuitive approach to editing your site. Navigate your "Layout Mode" site as you would your live site, personalizing your site quickly and easily. Clicking on the "Edit Layout Mode" tab will open your web site home page and its edit tools. Clicking on the red boxes will begin editing that section or element. Upload your logo, header and personal photo. Edit your side show. Change home page content. Follow the links on the left navigation bar to all the pages of your web site.
4.1 Editing text
In many areas of your Web Site Editor you can use a text editor to compose your own content. By default, the text editor is in WYSIWYG ("What You See Is What You Get") mode. Content you create in this mode will render just as you see it. This is the easiest mode in which to compose content. While in WYSIWYG mode, the editing tool bar looks like this:
Quick Reference for Editing/Formatting Icons
To view the function of each icon in the WYSIWYG ("What You See Is What You Get) editor, put your cursor over the icon image and it will display what that particular icon is used for.
4.2 Paste as plain text
Use the "Paste as plain text" icon if you plan on copying text from your favorite word processing program - Ex. Word or WordPerfect. This tool allows you to paste text without custom formatting. This is the preferred method for pasting in text created from program such as Word. When pressed, the icon will bring up a dialog box which will allow you to paste text. The text will appear in the editor and the formatting tools can be used to make any changes to the format of the text.
4.3 Insert a New Table
Use the "Inserts a new table" icon to create a new table where your cursor is in the editor. Once you click on the "Inserts a new table" icon, a dialog box will pop up giving you table options such as the number of rows and columns, table alignment, border thickness, table width, and cell spacing and padding. Once you have added a table to your page, you can manipulate the table by right clicking on the table within your WYSIWYG editor.
4.4 Select Text Color
Use the "Select text color" icon to change the font color of any text you highlight. Once you press the "Select text color" icon you can either choose a color from the color map, or enter in a hex color in the text box within the dialog box.
4.5 Select Text Background Color
Use the "Select text background color" icon to change the text background color. Once you press the "Select text background color" icon you can either choose a color from the color map, or enter in a hex color in the text box within the dialog box.
4.6 Insert Horizontal Ruler
Use the "Insert horizontal ruler" icon to insert a line horizontally across the page. Once you press the "Insert horizontal ruler" icon a horizontal line will be inserted where your cursor is placed. The color of the line will automatically match the color your website.
4.7 Insert/Edit Link
Use the "Insert/edit link" icon to link the text &/or images you have highlighted to a page within your website or to a new website. Once you press the "Insert/edit link" icon, a dialog box will pop up. You will need to select the page on your website that you wish to link to or select the "Custom URL" option to link to another website. You can also enter in a title for the link and select whether you would like the link to open in a new window. If you do not select the "Open link in new window" box, the inserted link will replace the current page. You can also edit a link you have previous placed inserted with this tool. You will need to highlight the text you wish to link before using this option.
4.8 Unlink
Use the "Unlink" icon to unlink a link that you have previously inserted into the WYSIWYG editor. You will need to highlight the link you wish to unlink before you use this option.
4.9 Insert Link to File
Use the "Insert link to file" icon to link to a file that you have already uploaded to your "Upload Documents and Images" tool.. Once you press the "Insert link to file" icon, a dialog box will pop up. You can link to a file that you have previously uploaded by clicking on the "My Files" link. You can also link to one of Myers' preloaded documents in the "File Library". Some of the preloaded documents include a Uniform Residential Loan Application (1003) and numerous disclosures.
4.10 Insert Image
Use the "Insert image" icon to insert an image that you have previously uploaded to your "Upload Documents and Images" tool in your Agent Center, or to insert one of Myers' preloaded images. Once you press the "Insert image" icon, a dialog box will pop up. You can insert an image that you have previously uploaded by clicking on the "My Images" link and selecting the image you have uploaded. You can also insert one of Myers' preloaded images by clicking on the "Image Library" link. Once you have inserted the image you can resize the image by clicking and dragging the edges of the image.
4.11 Edit HTML Source
Use the "Edit HTML Source" icon to see and edit the HTML source code for the current page. Once you press the "Edit HTML Source" icon, you can paste HTML from you favorite HTML editor, manipulate the current HTML source from the page, or insert other HTML that you have received. Once you update the HTML the editor will automatically reformat the code, taking out any white space or malicious code. Please note, the HTML editor will not validate your HTML, just reformat it. Some uses for the HTML editor are: inserting JavaScript, cleaning up formatting, and adding formatting. Please note: The HTML feature should only be used by those experienced with HTML code.
HTML Source Editor. Clicking the HTML button displays page content in the HTML Source Editor as illustrated below.
The HTML Source Editor is best utilized by people experienced in HTML. For most people working in WYSIWYG mode will be more efficient.
Note to HTML editors: Do not compose your HTML script in the Source Editor. Use an HTML editor to compose your script, then paste your script into the text mode editing page.
Use the Source Editor to paste HTML from other web pages or from an HTML editor. After you press the "Update" button, the HTML you pasted into the editor will be formatted. All spaces and formatting will be removed (HTML tags will remain).
In Preview mode you can see the results of your customization(s), and you will be able to see what your web site will look like after you publish changes. You can use the left navigation bar to visit the areas you changed.
When you are ready to publish your changes to your live website on the Internet, select Publish Changes in the upper-right corner of the screen.
Fully manage your email contacts. Your contacts can be imported from and exported to Act!, Outlook, or Outlook Express. You can view contact information from people who have submitted a lead-generating form via your web site.
8. Listings (optional upgrade)
Get the optional Real Estate Upgrade to administer your listings. Follow the "Add a Listing" link to access the wizard. It will guide you through adding a listing. You can provide as much information as you wish. Upload photos and add links to virtual tours too!
8.1 Assign Listings to Groups
This can be found under the Listings tab, in the Manage Listings Groups section. Click on Add a Group to create a new group or Edit to edit an existing group. Three display styles are available.
Display listing photo with property information
Display listings in table format
Display a Google map with listings. Each listing is identified on the map
9. Staff Directory (optional upgrade)
Get the optional Staff Directory and Bio Pages add-on product to add staff members and groups (categories) to a Staff Directory page. In the same way your navigation bar categorizes content, you can categorize members of your Staff Directory.
Click on the Help link in the back office for FAQs, Product Docs and Training classes. Click on the Live Chat button for Customer Service. If you need additional assistance, call Customer Service at 800-693-7770 or email Customer Service at cs@myers.com.