Our team here at Arvixe is dedicated to providing each and every customer the latest tools that they need to easily manage and build their websites. RVSiteBuilder’s user friendliness is why we have chosen to offer it to you when you sign up for any of our web hosting plans. RVSiteBuilder enables users to easily construct visually impressive websites with no emphasis on coding languages in as few as 7 steps. Its friendly graphical user interface gives users the options they need to build professional websites and to get those websites published and visible in as simple and timely a manner as possible.
Professional looking websites are not the only thing that RVSiteBuilder offers. RVSiteBuilder provides tools for building and managing HTML forms and tables, and provides easy-to-use managment features for images and hyperlinks. Styling your website has never been easier with RVSiteBuilder. Built-in styles can be customized to your liking without the modification of any HTML/CSS code. Don’t be discouraged if you are a competent programmer either: RVSiteBuilder can help you organize and deploy embedded code directly into your website.
In this tutorial I’m going to build a basic website. As you can see RVSiteBuilder offers a Blog interface as well. Additionally, there is a button called “Overview” that will take you through a step-by-step video tutorial if this written version isn’t enough! This screen is accessible when you click “Home” and will be your base for backing up, editing, and creating projects. For this tutorial I am choosing to the first option labeled “Click HERE to start”.
RVSiteBuilder is a very user-friendly program. Information can be inputted like any traditional form online – and more advanced features are included like HTML recognition and translation. You have the options to make fundamental decisions for you website: do you want a website title, do you want a business name associated with the website, do you want to include a website logo? These decisions can affect search engine results so think carefully about what names you associate with your website!
RVSiteBuilder is a tool suited for several audiences – those who know and want to use programming languages in their websites and those who want to design their website visually without complex programming languages. For those who don’t, there are several tools that you can refer to advance your website beyond the realm of a simple text website. Be sure to read the advice offered when you hover your cursor over the “Question Boxes”. They offer help for those people who may not know their programming languages but want to harness the powerful features that they offer.
To continue to Step 2, click the “Save” button.
Fortunately, RVSiteBuilder is bundled with hundreds of professional quality templates that builders can choose from. They’re organized into categories so you can quickly choose a template for your website. Don’t worry if you cannot find a perfect template just yet – there are several other options that you may want to take and you can change your template at any time during the building process!
If hundreds of templates aren’t enough, don’t fret. RVSiteBuilder allows builders to create their own templates, color schemes and design. Click on “Create DIY Template” if this is something that interests you! You’re also privileged enough to import RVSiteBuilder’s themes and customize those! This process is described next.
If you choose to “Create DIY Template” you’ll have the opportunity to customize what color your website will display for various components of it (i.e., the header, the menu, etc). This option can also be used in conjunction with the third tab labeled “Export and Import”. This option allows you to download a theme to your local machine. After you download it, you will be required to upload it to the RVSiteBuilder to edit it as you wish. This path can be complicated for a new user, I would recommend experimenting with a build in template to learn the names of objects and where they’re located (i.e. the header, the sides, the content pane, etc).
To continue to Step 3, click the “Save” button.
If you have an understanding of programming languages like HTML and PHP, here is your opportunity to embed code directly into your web pages.
From this panel we can see several areas of our website that we can edit. The top of the page outlines them for my template: Side1, Top, Bottom, and Side2. If you would like to edit any of these areas simply click on the area and a pop-up window will appear with any and all actions that you can take to modify this area. Notice that there is also a large pane in the middle of the page that you cannot edit quite just yet. This is the content pane and you will be able to edit this pane in Step 5.
If complicated programming isn’t your thing, there is the option to create, edit, and modify text, images, and media with the visual editor alone! This side of website development will be done using the “Design” tab. This tab is chosen by default on any of the edittable areas (i.e., Side1, Top, Bottom, Side2). After you’re done creating your website on the design side, you can view and edit the code that is generated by switching over to the “Source” tab. This step isn’t necessary but enables builders to inject customized code directly into the website!
If programming is your forte, you will be mainly using the “Source” tab. Though the source tab has less buttons and lights, it is very powerful when used in conjunction with the “Design” tab. As an example I included a simple snippet of PHP code that will produce the current date and time on the Bottom section of my website and provides a nice touch to the website. If you’re not familiar with PHP, no worries. The “Design” tab has more than enough friendly features to design your website. You could also try searching the web for prepackaged PHP programs.
To continue to Step 4, click the “Save” button.
During this step we’re going to determine the structure for our website. My website has a home page, an about me page, and a demo page. My website has no database components quite yet and is a relatively simple website – if I’m not quite sure exactly what I want my website to look like I can save my progress and continue to the next step.
This step is the step
To continue to Step 5, click the “Save” button.
The first time you get to Step 5 you will be offered to use the WYSIWYG (What You See Is What You Get) tool. This tool great for those who do not wish to use a programming language to design their website. WYSIWYG tool is a great visual styling tool to construct the content pane of your website. There are many helpful tools that are available in the WYSIWYG tool – so many that I would have trouble describing them all. I’ll describe just a few of these great tools below. If you’re curious about what a tool is used for, try hovering your cursor over the symbol to see a pop-up description of what it is used for.
Programming HTML tables can become very messy, intricate, and tedious to manage. The WYSIWYG tool makes life easier by providing a visual tools to build websites using tables. Basic table tools are included in the tool that let you add, edit, delete, and merge elements in tables to help you build complex and professional websites with ease. Tables are an amazing feature of HTML that allow builders to treat elements as separate pages. You have the abilities to embed code, add HTML forms, add formatted text and HTML, add images and even media. My website has a basic 3×3 table which will illustrate a simple way tables can be used to build your own website: visit it at sitebuilder.arvixedemo.comThough this tutorial isn’t a lesson on HTML, I recommend reading about HTML to advance your building skills. No need to buy a book or enroll in a class, some of the best learning resources are on the web for free: a quick google search will open a new door to building your website!
WYSIWYG also offers very user friendly tools for working with HTML forms. Forms allow your website to interact with the user and collect valueable information to allow your website to thrive. The process is described in detail trhough the program’s step-by-step description and placement of the HTML forms you want.
After you’ve completed this step you may wish to modify your website, add new pages, or perhaps add new functionality to it. This overview page is a very helpful page that allows you to launch the WYSIWYG tool, view the source code for the page, or create internal pages that can only be accessed by your main pages. Curious what your website may look like in a web browser? The green “Preview” button in the upper right corner will load your website for you to view! This is the last required step – if you are pleased with your websites appearance you can skip right to Step 7 to publish your website.
All the extras that a mainstream website may want can be edited from this panel. You can manage such things as meta tags, page names and titles on this panel. This is not a necessary step and should be used only if necessary.
This panel may require you to save manually, click the save icon to do so. To continue to Step 7, click the icon that says “Step 7″ at the top of the screen.
Be sure to save your website for future development and modifications!
Finally, the step that we’ve been waiting for: publishing your website. This step is simple and straightforward. Your main domain should be set as the default path – you simply need to click “Publish”. Take a look at the final product: visit it at sitebuilder.arvixedemo.com
This has just been a breif look at what RVSiteBuilder can help you build. Hands on experience will reveal a great many other features that this tool offers and I personally recommend building a demo site yourself to grip the full power of this program. If you have any experience that you feel should be mentioned in this article, please feel encouraged to write a comment on this page with the advice that you may have for a new builder. Have an opinion? I also recommend you share your ideas through the comments section.
Stop by the Arvixe Homepage for competitive web hosting packages that include this powerful tool!