Congratulations on choosing a Filemobile Media Community, our most advanced application.

The Media Community is fully functional, feature-rich interactive web application that enables you to provide a unique and engaging experience for your users. This application includes everything you need to collect and publish user-generated content including user profiles, galleries, uploaders, webcam recording, maps flexible categories and robust search.

While the Media Community can be completely customized, it can also be branded and deployed very quickly - it is a fully functional website out of the box. This documentation assumes a basic design implementation. There are few key concepts that you should understand in order to prepare your deployment and you should review this documentation site before you dive in.

Quick Start Guide

Here is a quick run-down of everything you need to do to get the Media Community loaded up into a browser error-free:

1. Read the System Overview
2. Install the Application in your Media Factory project
3. Set up responding domains
4. Create some groups
5. Create channels
6. Create a collection
7. Configure Facebook Login
8. Configure Global Variables
9. Edit email copy

Next, you'll want to make it look your own:

1. Edit and replace the sprites
2. Add other images
3. Edit the CSS
4. Change form fields

System Overview

Templates

All Media Factory applications consist of the following types of templates:

Backups

Backing up your Media Community is easy.

If you plan on making changes to an application (live or staging), we recommend you first make a backup. Inside the Application click "Backup and Restore". On this page, on the left hand side, change the filename field (something like "myappname_todaysdate" works well) and click "Download". This will download a XML file of all the templates and translations in that app. This is a great way to move your staging application changes to the live application. If something goes wrong, or you want to update a live app with the staging version, simply restore that XML file. On the right side of the same page, click "browse", find that XML backup, and click "Restore".

It is recommended that you have two applications for each project. A live app and a staging app. The live app will contain your custom URL(s) (http://www.mydomain.com/) and the project.fm domain (myappname.projects.fm) and will be what the the world sees. The staging app will only need a projects.fm domain (staging.myappname.projects.fm) and it's where you should do all your development. And only after testing should you backup and restore the staging app to live.

Editing Templates

The Media Factory CMS includes a basic template editor that uses file locking and records that last edit by time and user. The editor is accessed via the applications tab in Media Factory.

The web-based editor may not provide an ideal experience for a developer working for many hours on customizing the application. If you prefer a desktop editor experience, you will need to configure WebDAV for Media Factory. The instructions can be found in the developer documentation.

Caution: Please note that WebDAV for Media Factory is beta, and while it is well used by many developers it can be unpredicatable in some configurations.

Caution: WebDAV for Media Factory does not support file locking, so be careful not to overwrite other developers if you are working in a group.

Caution: WebDAV for Media Factory does not support time and user stamping.

Assets

Assets are the static files that your application uses such as images, custom JavaScripts, custom CSS or anything else you might need.

There are two ways to manage your assets: the Asset Manager web interface in Media Factory and via WebDAV.

The Asset Manager can be accessed via Applications > Assets in Media Factory. This basic interface is limited to uploading one file at time, whereas WebDAV allows batch uploading using drag and drop.

Note the two fields highlighted above: Template URL and Absolute URL. The absolute URL is the actual path to the image which MUST be used in the template application - relative URLs will not work. The Template URL makes use of the {$assetbase} variable, which renders the base path to your assets. So, when placed in a Media Factory template, both of these strings will render the same URL path.

Why would we do such a thing? The first and most important reason is that your assetbase URL can change if you choose to enable secure HTTPs on your project. Recent changes in Facebook now require all apps to be HTTPS, and if you used {$assetbase}, all your URLs can be updated at once. Another benefit is portability across projects, each of which have their own asset base URLs.

System Updates and Application Upgrades

The Media Factory system consists of three main components: the Media Factory CMS, Applications and the API. Each are handled differently with respect to upgrades.

Your Media Community was likely installed for you. Now you need to configure it.

Back to Quick Start Guide

Responding Domains Setup

One of the first things that you will likely ask yourself is, "how do I see the website?" By default, the application has probably been set up on a URL similar to http://your-app.projects.fm. This URL is configurable in the Settings section of your application.

First, visit the application settings for your application:

Domains are configured on the first tab: General.

Tip: To use your own domain, create a CNAME to www.filemobile.com and enter your domain in the Application Settings section. Media Factory takes care of the rest.

On the General tab, you can change the name of the application and edit the responding domains. You can also add additional domains to the list. For example, if you are hosting a website in multiple languages, you would configure on URL for each language with a corresponding language parameter beside the domain name (en). When that URL is requested, the application is automatically displayed in the appropriate language. For more information on the translator, see Translation below.

Back to Quick Start Guide

Groups Setup

Groups represent the organization of media in the application. Groups can be found in the Community > Groups section of Media Factory.

Tip: Check out the article about groups, channels and collections on the Filemobile Blog.

The hierachy and list order of groups is displayed on the /grouplist and /galleries pages on the website. The application is optimized for displaying groups up to three layers deep, although the template code can be customized to meet your exact needs if necessary. If you want to change the order of the groups, just drag and drop in Media Factory. If you want to hide a group, simply deny it. The top-level group is configured in the galleryGroupFilter parameter of the Global Variables.

Tip: Create two top-level groups - one for displaying content, and one for content not for display. This is handy for keeping things organized.

Users can upload into multiple groups, and by default all bottom-level groups that appear on the website can accept uploads. You can modify what groups are displayed for upload in the sub_group_selector template. Use caution, this is for advanced users.

Tip: Create stand-alone upload forms by repurposing the /upload template using a single group as a fixed hidden field. Put them anywhere!

Another important feature of groups is that each group can have its own homepage, similar to the main community homepage. A group page aggregates everything within the group, including (optional) sub-groups. To access and edit the details of a group, click the group name on the /communitygroups page in Media Factory.

On the group info page, there are number of fields you should become familiar with.

Back to Quick Start Guide

Channels Setup

Channels are used to keep different types of media separate. This is important for filtering in the application as well as reporting. Channels also govern geo-fencing.

Tip: Check out the article about groups, channels and collections on the Filemobile Blog.

Channels can be found in the Media > Channels section of Media Factory.

You should set up at least these standard channels:

To create a new channel, follow these steps:

1. Inside Media Factory, hover over "Media Manager" and click on "Channels".
2. Click "Add Channel".
3. Fill in the name field with "Content". When you click on the shortname field, it should autofill with "content".
4. No other information is required at this point.
5. Click "Create".
6. The new channel should now show up in the list. Note the id number. You will need it for setting up the global variables.
7. Repeat these steps for the other channels.

Next, you should configure the Content channel to send the appropriate moderation emails. Also make sure that the Project Settings are correct.

From the drop-down menus, select the appropriate Approved moderation email and Denied moderation email. These emails should be included in your Media Community.

Back to Quick Start Guide

Collections

Collections are like playlists, and have lots of uses in Media Factory applications. In order to get up and running with the Media Community application, you need to create at least one collection for featured content.

To create a collection, visit the Media > Collections section of Media Factory:

Create the "Featured" collection.

1. Inside Media Factory, hover over "Media Manager" and click on "Collections".
2. Click "New Collection".
3. Fill in the name field with "Featured".
4. Set a description and select "Saved Search".
5. Click "Create".
6. Set your search preferences, and click Update. The logic used in this collection will govern how the featured item is selected on the main homepage and all group home pages.
7. The new collection should now show when you return to the list. Note the id number. You will need this for configuring Global Variables.

Back to Quick Start Guide

Facebook Setup

If you want to use Facebook Login in the Media Community, you'll have to first create a Facebook Application.

1. Login to the Facebook developer section and create a new application.

   
   

2. You should arrive in the Settings > Basic section, where you can edit your app icon and name. These elements show up when users login to your site with Facebook for the first time.

   
   

3. In the Website section below, enter the public URL of your Media Community website. If you have more than one URL, you'll need multiple Facebook Apps for login.
4. Copy the App ID and App Secret keys and paste them into your Media Community application settings. See Responding Domains above.
5. Go to the Setting > Advanced section and make sure that you have a support email entered. This is a Facebook requirement.

   
   

When a user submits an entry or adds a comment, they are prompted to add it to Facebook. You can change the default text that appears in the "entry" category of the Translator.

Tip: Create a Facebook alter-ego for testing

You are going to be testing the behaviour and copy of messages shared to Facebook. In order to avoid annoying your friends and spoiling the surprise for your sponsor, create a second or third Facebook account. Connect your alter-egos so you can see what the feed messages will look like.

Back to Quick Start Guide

Translation

The Media Factory application template system includes a powerful translation tool. Each application has its own table of translations that can be found in the Translator section:

Translations are broken out into categories, and are made up of keywords and associated strings. The usage syntax in a template is {%category:keyword}. The template will render the appropriate translation based on URL, which is configured in Responding Domains above.

More detailed information can be found in the developer documentation, or watch this quick video:

Back to Quick Start Guide

Global Vars

In addition to managing language translations for multilingual websites, the Translator tool also manages global variables.

Open the translator section of the application inside Media Factory and open the var section:

The following table describes each of these variables, and identifies which ones MUST be changed:

* Caution: Webcam upload is beta only.

Back to Quick Start Guide

Project Settings

Project settings concern configuration that affects all applications, media and users in the project. They can be found under Settings > Project settings in Media Factory:

PSDs

Each sprite PSD contains a layer with information saying what part of the site the image belongs to, and what CSS style uses that part of the image (in case you need to change the CSS height or width).

You are free to edit the sprite as much as you want, but the further you stray from the default image sizes and postition, the more changes you'll have to make to the CSS.

There are some images that can't, or shouldn't, be added to the sprites. These include the homepage tout, gallery thumbnail backgrounds, form element background, loading icon and default thumbnail icons. You can modify these graphics as standalone images.

Translating Images

If you are planning a multilingual website, you will most likely have images that are language-specific. Our recommended approach is to create two folders in assets, say "en" for English and "fr" for French. Within each of these folders, place all the images for both of the sites, maintaining the same file names for both.

Now, to render the correct path when the page loads, use the {$lang} variable:

<img src="{$assetbase}/images/{$lang}/tout.png">

On http://english.my-app.projects.fm, this will render <img src="http://assets.newspark.ca/681/images/en/tout.png">

Included in the Media Community templates are four CSS files: global.css, reset.css, base.css and lightwindow.css

Caution: While you are free to edit any of the CSS as much as you'd like, there are a few things that may be better left alone. Inside base.css, any style that appears before where the sprite included has to do with the overall structure of the site, the three different box sizes and the thumbnail layout. There probably won't be a need to change anything in here except the colours and thumbnail background image URL

When adding custom form fields you should use meta data. To use meta data, make sure the 'name' attribute of the form field has to be 'meta[varname]'. And to access the variable in a <fm:MediaList> use the variable {$$media_metadata.user.varname}

Adding custom meta data to the register form in the 'sub_form' template