Using Webvanta
The Webvanta platform is very powerful, and once you learn its ways, it is easy to use. Because it takes a different approach than other web tools, there are some new concepts and techniques you’ll need to learn to take full advantage of the platform’s capabilities. These articles will help you through this process.Understanding Webvanta
- Check Out Our New Video and Quick Reference
We've just posted a new introductory video that gives a whirlwind 5-minute tour of how to build sites with Webvanta. Check it out and let us know what you think! We've also been hard at work on easy-to-use WebvantaScript references, and we have a great new cheat sheet. - Understanding Webvanta's Caching System
The Webvanta system works hard to give you the best of both worlds: the performance of static pages, and the flexibility of dynamic pages. It's important to understand how the caching system works so you can fully optimize your site's performance. - Webvanta Glossary
- Introduction to Webvanta
A quick introduction to how the Webvanta service makes it easy to build web sites that organize their content in a database, without requiring any server-side programming. - Using the Blog
A blog is preinstalled as part of your initial Webvanta site. To add a post, select Blog Posts from the Content menu and click the New Blog Post link. The blog system is highly configurable.
Step-by-Step Tutorials
- A Custom Database
In the previous part of this tutorial, we set up the Knowledgebase to store our links to other resources from around the web, organized into categories and types. Often, though, your site needs to organize and present some information that is particular to your subject material, and you need custom database fields. - Setting up the Knowledgebase
- Basic Styling
In this tutorial we apply some basic styling to the AllAboutPets site, uploading a new logo and changing colors using Config Settings. - Initial Setup and Editing
In this tutorial, we begin building a new web site, AllAboutPets.com. We'll see how to reorder pages in the menu and change the home page text.
Creating and Styling Pages
- Accessing Open-Source Library Files
Our Webvanta template site makes use of a variety of open-source CSS and JavaScript code. You can access this code from the master sources and upload it to the Images & Files section of your site, if you want to have your own copy. - Search Engine Optimization
- Creating and Editing Pages (not updated for 2.0)
You can easily create as many pages as you need with Webvanta. The page template can define multiple regions (such as columns), and each part of the page is editable separately. - Creating an Event Calendar
It's easy to create sophisticated event calendars with Webvanta. - Using WebvantaScript
WebvantaScript is a simple language that you can use to access content stored in the content management system or in the database.
Working With Media
- Using Image Metadata Fields
- Associating an Image with an Article or Database Item
Often, it is helpful to a site's visual design if you can have an image associated with each article or other database item. Webvanta makes his easy to implement.
- Displaying Video
There are two different ways to incorporate video in your site: Use the embed code from YouTube, Vimeo, or any other video sharing service that provides embed code; or upload the video to your site and install a video player as part of your site. Webvanta includes a preinstalled video player, and all you need to do is upload your .flv file and set up the player with a couple lines of code. - Using the Photo Gallery
Your Webvanta site includes a photo gallery and slideshow that is very easy to use. This gallery uses a highly configurable jQuery plug-in called galleriffic, and it is styled entirely with CSS so it is easy to make it look and behave exactly how you want.You can easily customize any HTML, JavaScript, or Flash photo gallery to work with Webvanta. You can start with our photo gallery and modify to meet your needs, or follow the general approach and substitute any gallery code that you'd like.
- Creating and Accessing Image Renditions
Often, when you have a photo gallery or other uses of a number of images, you need those images in more than one size. Typically, you'll want a thumbnail, and you may want other sizes as well. Each size is called a rendition. Webvanta can automatically create multiple sizes for you when you upload images.
Using the Database
- Using Fieldsets for Repeating Sets of Fields
Fieldesets are an advanced technique for use with custom item types. They allow you to define a group of fields, and to then repeat that group of fields as many times as you need for each item. The number of instances of a fieldset in a given record is not fixed, but can vary from one record to another. - Importing Data from CSV Files
When entering information into your Webvanta database, you can always enter it one record at a time using the automatically created admin forms. But if you have lots of existing information to enter, it may be easier to do so by uploading a file. - Displaying Related Content
The need often arises to display a list of database items that are related to the item being displayed. Webvanta provides a variety of mechanisms for accomplishing this. - Working With Related Assets
When you create a custom item type, you can define a field as being a Related Asset. Typical uses of this capability include associating a number of images with a project, a logo image with a company, or a PDF document with an item. - Working with Related Items
When you create a custom item type, you can define fields as being of the type "related item". This provides a connection to one or more database items of any type.
Administration
- Making Your Site Public
When you first set up a Webvanta site, it is viewable only by you and others for whom you set up administrative accounts. While you’re building your site, visitors will see only a page asking them to log in. There's no charge for hosting your site as long as it is in development.When you’re ready to make your site publicly viewable, you need to sign up for a paid account.
- Using Configuration Settings
- Working With External Services
- Working With User-Generated Content
Visitors to your site can add their comments to any database item. This includes your own articles and blog posts, as well as links to other web sites, books, and anything else you put in the database. - Managing Users
Using WebvantaScript
- Using Fieldsets for Repeating Sets of Fields
Fieldesets are an advanced technique for use with custom item types. They allow you to define a group of fields, and to then repeat that group of fields as many times as you need for each item. The number of instances of a fieldset in a given record is not fixed, but can vary from one record to another. - Working With Related Assets
When you create a custom item type, you can define a field as being a Related Asset. Typical uses of this capability include associating a number of images with a project, a logo image with a company, or a PDF document with an item. - Working with Related Items
When you create a custom item type, you can define fields as being of the type "related item". This provides a connection to one or more database items of any type. - Displaying Paginated Database Results
When you have lots of items to list, sometimes there's more than you want to show on one page. The universal solution to this is pagination: break the list up into some number of pages, with a maximum number of items per page. Of course, you then need some sort of control to navigate between the pages. - Check Out Our New Video and Quick Reference
We've just posted a new introductory video that gives a whirlwind 5-minute tour of how to build sites with Webvanta. Check it out and let us know what you think! We've also been hard at work on easy-to-use WebvantaScript references, and we have a great new cheat sheet.
WebvantaScript Cookbook
- Blog Recent Posts
This is the code for the recent blog category list. - Blog Post Category List
- Calendar
The first bit of code is used where the calendar is to be located and loads the calendar at that location in the codeThe second bit of code is the javascript required to run the calendar. Fullcalendar.min.js is the javascript file needed to run the calendar and the rest of the code is to initilize the calendar code.
For a more indepth tutorial please see http://www.webvanta.com/article/54326-creating-an-event-calendar
- List of Recent Blog Posts
Shows the most recent six blog posts. Change the limit value to show more or fewer.
In the snippet "recent_posts" in new sites, and used in the right column of all blog system pages except the main blog page (which is itself a list of recent posts).
- Page-Based Subnav
Generates a subnav list based on the page hierarchy (not the menu hierarchy). This is designed for sites with a two-level page hierarchy.If the current page has children (subpages), then this is a top-level page, and the subnav list shows each of subpages.
If the current page does not have any children, then presumably it is a subpage, so the subnav shows the other subpages of the same parent. The w:if_self statement adds a class to the menu item for the current page.
Navigation
- Adding External References to Menus
Sometimes you want to add a link to an external page directly from the menu. To do this, add an External Reference by clicking the button of that name at the top of the page index. - Creating Navigation
Using the Editor
- Customizing the Rich Text Editor
The Rich Text Editor is customizable in two ways: The styling that is applied to content in the editor preview window, and the styles that appear in the Style pop-up menu. - Using the Rich Text Editor
The Rich Text Editor (RTE) allows you and your client to edit HTML content without seeing any code: it is a wysiwyg environment much like a stripped down version of Word. - Using the Code Editor
The code editor provides a variety of features that make it easier to write, edit, and debug your code. It supports HTML, CSS, JavaScript, and WebvantaScript. - Using the Editor (Overview)
Webvanta provides a dual-mode editing widget that is available to you throughout your control panel, and as an in-place editor when viewing your site.
Integrating Third-Party Services
- Setting up e-mail for your domain
If you're moving a site to Webvanta, you may need to move an existing email service as well. And if you're creating something new, you'll probably want to set up email as well as the web site. - Importing Information from RSS Feeds
You can set up your Webvanta site to periodically import information from any RSS feed into your database. By pulling content from RSS feeds into your database, you can apply your own ratings, or delete ones you don't want to include. You can present them with complete flexibility, just like any other database content. As an extra bonus, the information from the RSS feed appears to search engine spiders as if it is part of your site; if you use a JavaScript widget instead, the RSS content is invisible to the spiders. - Setting Up Mailing Lists
When visitors come to your site, your best chance of initiating a follow-up conversation is if you can induce them to give you their email address, and permission to send them something. Since this is such a common need, there's a plethora of services that you can use to help you capture names and email addresses, and to send emails to the list this creates. It's easy to integrate any of these services into your Webvanta site.
- Customizing Your FoxyCart Checkout and Receipt Pages
If you are using FoxyCart and want the checkout and receipt pages to look like the rest of your site, you'll need to set up a page template to use for these pages, a Webvanta page for each of these pages, and a CSS file. - Setting Up E-commerce with FoxyCart
An e-commerce web site involves several coordinated functions: choosing products, ordering products, and processing payment. Webvanta provides an excellent solution for creating the product database and presenting them on the site. Unlike most other approaches, you can easily add whatever fields you need for your products, and you can display them however you want. Webvanta by itself does not include a shopping cart or payment processing, but you can easily add these capabilities by using a hosted shopping cart, such as FoxyCart.
© 2010 Webvanta, Inc. All Rights Reserved.
