Sandvox Video Tutorials

(Partial transcript follows.)

In Sandvox, a collection is a group of pages. A site can have many collections, but each site must have at least one collection, the Home Page.

In the “site outline” of my website, the Home page contains the pages and other collections of the site arranged in a hierarchy. I’ll click on the disclosure triangle for the “Recipes” Weblog collection to reveal the pages.

Similar to arranging file folders on your computer in which, a main topic may include many folders and files, a collection can contain nested pages and even other collections with other nested pages. But, unlike a folder on your hard disk, which just groups its contents together with a name and a general folder icon, a collection is visible on your site as a page, and usually that collection shows an index of what is inside the collection, in the form of summaries or thumbnail images.

Think of a collection as a parent, and the contents of that collection as children. Parent collections can have any number of children pages so, every child page belongs to a parent collection.

This diagram provides an alternative view of how collections are arranged. At the very top of the family tree is the grandparent, the Home page.

The dropdown menu on the toolbar displays “Collection” choices; Weblog, Download list, Photo Album, and so on. Another way to access Collections is to go to “Site” in the menu bar . . . then “Add collection”.

You can create several different types of “Collections”. Each collection has a purpose.

A Weblog can be used as a Blog, offering written, podcast, or videocast content to site visitors.

A Download List is used to present thumbnails, titles, and pages that facilitate the download of files.

The Photo Album provides the grid structure and mechanism for the layout of photos, and so on.

(Abridged Transcript follows.)

With Sandvox Pro, you can register your website with Google in order to give you better control over how Google lists your website.

...

First, to perform site verification with the Google Webmaster tools, open up the inspector by clicking the "I" icon in the toolbar . . . then choose the Site segment . . . then the Google tab.

Click the “Google Webmaster tools” link to go to the site. “Sign in” to Google Webmaster tools with your Google Account email address and password.

When you “Sign in”, you are directed to the Google Webmaster tools Dashboard. Add your site by inputting the url . . . and click “Add Site”.

Google Webmaster tools gives you access to the Overview page. Click the “Verify your site” link.

Choose the “Add a meta tag” verification method from the dropdown menu.

Notice the code they provide. Select it here . . . then “Copy”.

I’ll go back to my site in Sandvox.

In the site inspector, in the “Google” tab, paste the code into the “Site Verification” text box.

Click the “Publish” icon in the toolbar to send the changes up to the site.

Go back to the Google website and click the “Verify” button.

Uploading the verification meta tag into the site’s root verifies to Google that you are the authorized site owner. By being verified as the site owner, you are able to examine any errors that Google may have with your website, choose how Google visits your site, and so on. You will be able to see information about your site verification almost immediately.

In the second task, I will create a sitemap for Google.

But first, it is important to define the differences between the “Site Map” page on your website and the Google sitemap. A Google Sitemap is not a page on your website, it is a special file that Sandvox can generate to communicate with Google about your website.

In Sandvox, you are able to make a “Site Map” page to help visitors get an overview of a complicated website. In my website, Antique Cellphones, I have a Products page, a Contact Us form, a Blog page, a Terms of Service page, and a Site Map page. This “Site Map” page is to help human visitors find the pages they need on the website.

I’ll show you how you can exclude a page from the human-readable “Site Map” page on your website and the Google sitemap.

All the pages, in my site are listed here in the “Site Outline”. I’ll “select” the Terms of Service page. In the Page segment of the inspector, by “checking” or “unchecking" here, I can choose whether I want it included in the “Site Map” page on my website and the Google sitemap.

Click on the Site segment in the inspector . . . and then the Google tab.

Check “Generate Google Sitemap”.

“Copy” the url Sandvox provides in the textbox. If I had not set up my website for publication, I would have to do that first, since I need to get the actual url of the published sitemap page for this process.

Go back to the Google website.

Choose “Sitemaps” in the Dashboard.

“Paste” the sitemap url into the “My Sitemaps” textbox . . . then click “Submit Sitemap”.

Google may also choose to make use of the sitemap page you provide as a hint for which pages are worthy of showing in sitelinks. It’s up to Google as to whether they will show Sitelinks on your website, but providing the sitemap is a good way to help Google do this.

...

Sandvox automatically marks the Home page and all the pages listed in the “Site Menu” as the main pages for the site.

Google integration with Site Verification and Google Sitemap Activation is complete. Every time I publish my site from now on, the sitemap page will be updated to reflect those changes. And Sandvox will automatically notify Google that the sitemap has changed.

Hello and welcome to this screencast for Sandvox.

With Sandvox, you can integrate Google Analytics into your Web site to track visitor traffic in six steps.

I’ve used the Clockwork design for my website called Antique Cellphones.

In step one, I’ll click on the blue italic "I" in the toolbar to bring up the inspector. Click the site segment and then the Google tab. Click the "Visit Google Analytics" link to go to the Google Analytics web site.

For step 2, I’ll click the "Sign Up Now" link. If you don’t already have a Google account, you can create one here.

I have an account, so I will sign in with my email address and password.

In Step 3, sign up for Google Analytics

Input your Web site’s URL: www.antique-cellphones.com

Input the Account name.

You can track many web sites with separate names. If you have more than one account name, you will be provided with a drop down menu of accounts to choose from.

The country…and time zone…then "Continue."

Step 4: Once logged into your account, the overview page shows the tracking code for each profile. Highlight the tracking code in the text box and … copy.

In Step 5, I’ll return to my Antique Cellphones website in Sandvox.

If the inspector is not visible, click the icon for the inspector in the toolbar to bring it up.

Step 6: Click the inspector site segment and then the Google tab and paste the tracking code in the Google analytics text box.

Now you are done! So just click the Publish icon in the toolbar to send the changes up to the site. It may take about 24 hours for Google Analytics to start showing your traffic, so be patient!

Now you can track visitor traffic.

Thanks for watching!

Find out more about Sandvox at www.sandvox.com.

Full transcript for this screencast is available at http://www.karelia.com/sandvox/screencast_transcript.html

This is the text for Chapter 1: A day in the life…

Hello and welcome to this screencast Introduction to Sandvox, the powerful, playful and intuitive website creation application from Karelia Software.

In this screencast I’ll be showcasing many of Sandvox's creative features. To get started, I’ll show what it's like in the "day in the life" of a Sandvox website.

Here on the Desktop is my Sandvox document. Let’s open it. This is a website I’ll build from scratch later, one that recounts my family’s summer trip to Ireland. For now, to get an overview of how Sandvox works, let's add a new page, make some simple edits, and publish those changes.

This main document window is how you'll work with most aspects of your site. At the top we have a standard Mac OS X toolbar with icons to help us add pages, create links, and so on. Here on the left hand side we have our Site Outline, which shows all the pages of my site; the home page is at the top. The rest of the window is the WebView, which shows us the content of whatever page we have selected in the Site Outline, just as it would look in the Safari web browser.

The first thing I’ll do is edit the content of the “about” page, which explains the purpose of this site. I’ll select “About” in the Site Outline. Now it displays that page in the WebView.

To start editing, I click on the area of the text I want to change. For this page I’ll just remove a paragraph, and add another in its place.

Then I’ll work in some basic styling. I’ll select some text and make it bold by selecting “bold” from the Format menu

Next, I'll add some hyperlinks. I want to link the word “pictures” to the photo album I created, so I highlight that text and click on "Create link" in the toolbar. A little panel opens up. If you want to link to another website, you would type or paste in a URL . But since I need this link to go to another page on my own site, I drag this target icon to the site outline, and connect it to the page I want to link to. To close the link panel I click in some other part of the window. Notice when I hover over that link, I see where it’s linked to, down on the status bar at the bottom of the window, just like in Safari.

For my last edit, I’ll add an entry about my day trip to Blarney Castle to the weblog.

A weblog can be thought of as an online journal; a collection of articles with the most recent entries at the top.

Adding a new entry to an existing weblog is very easy to do. I’ll add a text page from the popup menu in the toolbar, and then type the entry directly into Sandvox.

Now, with all of my editing done, I’m ready to publish, so I click on the publish icon in the toolbar.

From Sandvox you can publish to any web host, or even your own computer. This site is already setup to upload to an FTP site. If you’re curious about publication settings, they will be reviewed in detail toward the end of this screencast.

When uploading is finished, I can visit the site. There it is in Safari; and there are my changes.

This covers what “a day in the life” of a Sandvox website is like. Over the next few chapters of this screencast we'll recreate this website in Sandvox from scratch, demonstrating how to:

• Create a new site;

• Manage content with pages, pagelets, and collections;

• Add and manage a weblog as well as albums of photos and movies;

• Setup publishing;

• And look at some advanced features.

Full transcript available at http://www.karelia.com/news/new_screencast_how_the_kare.html

Transcript begins:

Hi, this is Dan from Karelia Software. We create a Macintosh application called Sandvox that makes website creation easy and elegant. A number of people have told us that they didn't realize that our own website is built with Sandvox. Well, it is.. This is our website ..... and here is Sandvox, editing our website. This is a screencast to take you for a little tour of the site to show you how we put it together with Sandvox, Pro Edition. I'm going to assume that you have some familiarity with Sandvox already; if you don't, please check out our introductory screencast at www.karelia.com/screencast.html.