Getting Started

Where do I start?  What can Caravel do?

Well a good place to start is reading some of these FAQs and tutorials. This will also give you a pretty good idea what Caravel can and can't do. Once you have taken a look at the documentation we suggest you just experiment. Don't be afraid to play around with your site. Add content, add some styles, and just have fun. Once you have done this then you are ready to start designing your first site. For some examples of what type of sites are possible check out one of these sites:

http://berkeyavenue.org
http://mennochaplains.mennonite.net
http://unionproject.org
http://mountainstates.mennonite.net
http://www.adnetonline.org
http://edenmennonite.org
http://www.goshen.edu/its/Welcome

How long does it take to learn Caravel?

That's a tough question--a bit like asking how long it takes to learn Photoshop.  It depends on what you want to do.  If you just need to learn the basics of how to edit text and make basic changes to an existing site, much of what you need to know can be absorbed in an hour or an afternoon.  If you want to design custom sites from scratch, be prepared to come up to speed over a period of weeks and months.

Why the disparity?
Caravel is enterprise-class software that happens to be designed to help non-technical people create websites.  There's a lot of richness under the hood that makes it possible for technical people to do some amazing things--generate thousands of sites off of corporate data, set up portals and e-portfolio sites, integrate Caravel with your existing enterprise webspace, integrate security with your enterprise directory, etc.  If you aren't interested in any of those things, don't worry, we've hidden much of the complexity, so it's only there when you need it, or your administrator decides you need it.

 

I don't know HTML. Can I still add content to my site?

Yes. The HTML editor that Caravel uses does not require any HTML knowledge to accomplish most tasks. Just about any standard content can be made with this editor. Having said that, a basic knowledge of HTML and CSS will definitely help you out. If you want to start doing really complicated layouts and designs with flashy content knowing these will eventually be needed.

Tip:  Clicking the HTML button in the editor brings up a window containing the text and underlying HTML code for the current block.  This can be useful for both learning HTML and troubleshooting layout problems.

Tip:  Caravel will convert RTF files to HTML automatically as you upload them into your site.  This is enormously useful if most of your content is in MS Word format.

 

Is there a site on which I can try a demo of Caravel?

Check the demo link for a page with direction to the demo site.

 

Creating Content

How Do I log in?

Depending on how your site has been set up, there are three common ways to log into a Caravel site:

1) A login block.  In this situation, the login form is embedded right in the layout.  Just enter your userID and password and click the Login button
2) A login button.  Particularly on older sites, there may be a login button in the lower right corner of the screen.  Click it to log in.
3) A login page.  On more recent Caravel installations, you can type /login.php at the end of any page URL and you'll get a login page.

Tip:  When you use a Login block, you have the option of redirecting the user to another page when they log in.  This can be handy for directing them to Members page with links to members only content.

 

What is a block?

Sometimes there can be a lot of confusing jargon associated with Content Management Systems. We have tried to keep this to a minimum but there are a still a few here and there in Caravel.

A block is your basic container, every bit of content and every application that you put on a page becomes a block. When you add a new document to a page it becomes a block that contains that document. When you add a new feature like a RSS Reader, it gets added in a block.

 

This makes certain operations that you do much simpler because everything you need to do can be done from the block menu. If you want to get rid of anything on your page, you just click the trash icon and delete its block. If you want to apply styles to anything on your page you can just click on the palette icon and apply styles to its block. If there is an edit mode for your content or feature, just click on the pencil icon from the block menu to edit it.

Tip:  You can retrieve a deleted block by dragging it out of the Trash sidebar
Tip:  You can move a block to another page by dragging it to the Block Clipboard sidebar, navigating to the destination page, and dragging the block from the Block Clipboard to the desired location.
Tip:  When dragging a block from the Block Clipboard, if you hold down the Control key, a copy of the block remains in the Block Clipboard.  This is handy when you want to copy a block to multiple different pages.
Tip:  To give a block a Titlebar, from the Block Options menu, choose Block Settings and type in your block title.  You can then choose from different titlebar styles from the Block Template dropdown menu.

 

How do I add content?

To add content onto your site just move your mouse to the plus icon on any column. A menu will appear and one of the options will be "New Document". When you click on this, a WYSIWYG HTML Editor will appear. It works very similar to the way a word proccessor works and adding text and images is quite easy. When you are done editing, make sure to name your file, and optionally give it a title and author, and then save it. Your document is now visible as a block in the column.

Uploading Files
Caravel also allows you to upload files from your local hard drive.  From the Add Block menu, choose Upload File, and locate the file you wish to upload.  Caravel will automatically recognize most common web file formats (ie. .jpg, .gif, .png, .mov, .rtf, .htm, .swf, .mp3, .m4a, .mp4).  Files that are not normally visible on the web (ie. .ppt, .doc, .pdf) will be displayed as links, which are either downloaded or displayed by a browser plugin.

Displaying Content You've Already Uploaded
Sometimes the content you want to display has already been uploaded into Caravel.  In this case, from the Add Block menu, choose Open File or Open Folder.  The Open File command displays a single file in a new block, while the Open Folder command displays the contents of a Folder, typically as links, buttons or entire files.  The Folder Viewer is a very powerful feature and once you've mastered it, you're ready to tap into some of the more powerful capabilities of Caravel.

Tip:  You can add multiple files, folders, even nested folders using the Java Uploader in the File Manager
Advanced Tip:  You can simplify site maintenance for non-technical users by creating an "upload dashboard" using Caravel's Public Uploader and Public Uploader Rapid Edition.  These tools allow you to upload multiple files to multiple destinations with a single click, and define custom dropdown menus with common destinations (ie. for submitting committee minutes to various committtees). To add a Public Uploader block, choose Add Block/Add Feature and Click the Admin Tools Link.

 

The editor keeps acting oddly and losing my changes, whats happening?

Sometimes when you have put so much formatting in a document it starts to overlap and interact in unfortunate ways. You may change a font from one size to another and find that nothing changes since the formatting is messed up. Our suggestion for dealing with this is to select the area that is not working correctly and click on the "Remove Formatting" button, the eraser icon. This removes all formatting and you may need to redo your font sizes and colors, but it almost always solves the problem.

 

How do I upload slide shows/PowerPoint programs?

There is not a way to display a PowerPoint online. If you want to make a Powerpoint presentation available, you can upload it in the File Manager. To create a download link, go to 'Add Block', then 'Open File' and select the powerpoint presentation you uploaded.

You can, however, make a slide show. The first step is to create a folder in the File Manager, and upload photos that you would like to display. Next, add the slide show app. Go to 'Add Feature', and click on the 'Slide Show' application. On the right side is the list of folders that are in your file manager. Find the folder that contains your pictures, click on the button beside it, and click 'Select Folder' at the bottom. On the left side are the slide show settings. These settings are fairly self explanatory.

Note: After selecting the folder in the Slideshow, make sure you hit save, and that the correct folder is listed beside 'Folder currently saved in settings:'

 

How to I place a photo in a block?

Use the File Manger to upload the photo. Next, go to the block where you would like the picture to be, and under 'Add Block' click 'Open File'. Now you can select the photo you just uploaded, and it will be displayed in the block.

How do I add a blog or an RSS Reader?

There is another FAQ that details how to add a blog using Caravel's FolderViewer. Read the adding a FolderViewer and using the FolderViewer to mantain a blog FAQs.

Adding an RSS Reader is simple. Just move your mouse to the plus icon on any column and a menu will appear. Choose "Add Feature" and a window will popup with a list of all of Caravel's applications and their descriptions, sorted by category. The RSS Reader is in the Site Widget category so choose it from the menu on the left. Then just click anywhere on the RSS app to add it to your page.

Once it had been added you will be presented with multiple configuration options. The most important is just the url of the RSS feed you want to subscribe to. Enter that and hit save and you are done.

Tip:  You can customize the look of your RSS feed in two ways:  1) choose from the configuration options at the bottom when editing the RSS Viewer Block, and 2) use the Style Editor (Block Options/Set Styles) to add a background color or picture, change the font, color, style, margin, padding, etc.

 

Layout

How do I add a row or a column?

We'll start with how to add a row. Every page will always have at least one row on it, because the last row can never be deleted. So, to add a new row all you need to do is move your mouse cursor to the plus icon on a current row and you will see three options. The second one is 'Add Row'. Click this and a row will be added after the current row.

Adding a column is very similar. Find the row that you want to add a coulmn to and move your mouse cursor to the plus icon. Click on 'Add Column' and a column is added to that row.

Tip:  Each row can have its own width and justification
Tip:  Rows can be fixed or variable width.  This is determined by using pixels (fixed) or percent (variable) when setting the row width
Tip:  You can set the width for all rows on a page simultaneously by choosing Row Widths and clicking the All Rows radio button.

 

How do I resize a row or a column?

This is one of the easiest layout changes you can do with Caravel. To resize a row simply move your mouse cursor to either the far left or far right of a row. A vertical orange line should appear and your cursor should change. Simply click and drag to resize the row. 

 

 

 

Resizing a column is quite similar. Just move your mouse to a columns inner border and once again a vertical orange line should

 appear and your cursor should change. Drag and release to resize the row.
Tip:  You can specify an exact width for a row or column in pixels or percent by choosing Row Widths or Column Widths from the Row's Add menu.

 

 

How do I move a block?

To move a block, move your cursor over its title bar. The cursor icon should change to a crosshair. Now just click and drag the block to where you want it to be moved to. A thick dotted orange line will appear where the block is going to move to. Once this line appears just release your mouse button and the block is moved instantly.

Tip:  You can move a block to a different page by dragging it into the Block Clipboard sidebar, navigating to the destination page and dragging the block to the desired location.
Tip:  If you hold down the Control key while dragging the block out of the Block Clipboard, a copy of the block remains in the Block Clipboard.  This is handy when you need to copy the same block to multiple pages.

 

I want to make my column smaller but it won't let me, is there anything I can do?

Occasionally you will want to make a column smaller and it will not allow you to. It will flash the message 'Minimum Width'. The reason it does this is because the browser refuses to make the column smaller either due to an image with a set width or a long line of text with no spaces or a long string of   (non-breaking spaces). There are several ways of getting around this problem. If it is an image you can remove the block with the image that won't get smaller, fix the width, and then add the image back. If the problem is text you can insert spaces into the line of text which will allow it to wrap onto multiple lines, if it's non-breaking spaces you can usually find and delete them using the HTML view in the WYSIWYG editor. 

Tip:  A related problem is when a row becomes wider than its defined width.  The fixes are pretty similar--find the offending block and either scale down the picture, eliminate the  's, or long strings of unbroken text.
Tip:  Caravel now offers picture editing tools that allow you to scale and crop images right in your browser.  You can access these tools from any picture block, or from the File Manager, just double-click on the image you want to resize.  It's very handy for fixing oversized images.

 

Templating

What is a template?

A template is a page format, that has margins, fonts, headers and footers, logos or any other kind of formatting that the template designer wants to appear on each page that uses the template. You create a template much like you would a page. You add blocks with content, add stlyes. The one difference is that in a template you can specify a particular column as the "Content Area". What this does is that when you assign a page to use this template, all that pages content will be displayed inside the content area.

When designing a template you want to put all the content and styles that will be used on all pages in the template. This will save you a lot of work when you are designing and building your sites.

 

How do I change a page's template?

To change a pages template move your mouse up to the upper right and mouse over the palette icon, this is the template menu. This menu will have three options. One of them is "Change Template". Click on this and a small window will popup. This window will have a dropdown of all available templates for this page. Choose one and click the change button. If you want the template you choose to be the default template for all new pages on this site then check the checkbox that says "Set this template as the site default".

 

Now that I have made a template is there any way to share it?

Yes.  When you are editing your template page, the Template menu has an Export Template option that allows you to save your template as file that's saved to your local hard drive.  This file can be shared with other Caravel users, who can use the Import Template command to bring that file into their site.

 

How do I make new pages use my template?

If you have a particular template that you want all new pages on your site to use, you can make it the site default template. To do this go to your template. Move your mouse to the upper right and mouse over the palette icon, this is the template menu. One of the options on this menu is "Set as Default". Click this and all new pages on this site will use this template.

 

How do I change the banner of my template and modify other content?

First you must select 'edit template' from the template menu from the admin toolbar on the top fo the page. This will bring up the template of the page you are on. Whatever you change here will then be changed on every page with that template. To change the image (banner) at the top of the template, simply click edit on the partcular block that contains the image. From here you can customize the appearance of the block and choose your own image (which you will need to upload into the file manager).

 

How can I make it so that flash files don't go "on top" of everything (including menus)?

If you open the block (i.e. click on edit (pencil icon) from the block's menu) then open the advanced options menu, you can change the wmode to be "opaque" or "transparent." This will allow other page content (i.e. menus)  to extend overtop the flash.

 

CSS

 

I made some changes in the CSS Editor but they arent showing up, whats going on?

This is a very common problem. Most browsers cache all css files that they get to speed up future page loads. Due to this your changes are not applied because your browser is caching the old css. There are two ways around this. You can turn off your cache entirely in your browser's settings, or you can clear your cache whenever you think that one of your changes is not being accurately reflected by your browser.

 

Is there any way to add custom CSS classes in the CSS Editor?

Definitely. The ability to add custom classes and allow direct editing of the stylesheet was one of the reasons we designed the CSS Editor. To add these simply bring up the CSS Editor and use the menu on the upper left to navigate to the advanced section. Here you are presented with a textbox that contains all of the css associated with this CSS Editor. You can add new CSS selectors or modify current ones.

 

Some of my styles show up on the template but not on pages using this template. Why?

This is another very common problem. To understand what is happening it helps to understand how Caravel sets up its CSS files. Every template has a CSS file associated with it, the same is true for pages. So if you have a page using a specific template then that templates css file will be included first and then right afterwards that pages css file. Thus it is possible to overwrite a css selector by setting it in the pages css file.

For example, lets say you set all blocks borders to be 1 px and black in the template css file. Then, in the page css file, you set all block borders to be 2px and blue. In this case the borders would all be blue and 2px thick. The pages css will be the one that is applied to all page blocks because it is included after.

Thus if you are ever losing template styles on a page make sure that they are not being overwritten in the page CSS file.

Navigator

Is there any way to get the classic Caravel 2.0 navigator back?

Yes, the classic navigation style is an option in the Navigator. Just go into edit mode on a navigator and choose the Caravel Classic option from the left menu. From here you can set up the navigator to look just like the old classic style.

 

Can I do a breadcrumbs navigator?

The Caravel navigator application can build its list of links from a pages ancestors. To build a breadcrumb navigator go into edit mode on a navigator application and click on "Text Links" from the left menu. Next go to the "Build list from:" option and check the path from top level checkbox. You can set the colors next if you want. The final thing you need to do is decide on a separator, for this example I'll suggest you choose >. This should give you a navigator that looks similar to this:

TopMost Page > Parent Page > Current Page

Tip:  If you wanted an image as the seperator you could just enter the html for the image instead of the >.
Tip:  If you want more space between your page links, you can add spaces on either side of the Separator character.
Tip:  You can control the aesthetics of your breadcrumb using Caravel's Style Editor.  From your Navigator's Block Options menu, choose Set Styles. This allows you to control things like font size, color, style and margin.

Is there any way for me to control the look of the navigator with CSS?

Just about every navigation style has specific classes associated with it and so does the block that it is currently in. You can add css for these classes and ids using the CSS Editor, For more information on adding custom classes using the CSS Editor go here.

 

Folderviewer

What is the FolderViewer and how do I add one?

The FolderViewer is a very unique tool. What it basically does is take a particular Caravel folder and display it as any type of list or group. For example, if you have a folder full of pictures, then the FolderViewer can take that folder and generate a gallery from it. Furthermore, you can specify what happens when a particular item in the list is clicked on. You can make it display that particular item in a popup, in a new page, or any block on the current page. The FolderViewer can make a folder into a gallery, a blog, a list of downloads, or something entirely different.

To add a FolderViewer move your mouse to the plus icon on a column and click on the "Open Folder" link.