| WordPress

Flutter is a Wordpress plugin that allows you to move beyond simple posts and pages in Wordpress. You can create different types of pages with different types of content. In this example we're going to emulate IMDB.com and list movies together with details about the movie.

Install Flutter

tutuploadsmedia_1276341514732.png

Go to Plugins >> Add New and search for "Flutter". Click "Install" on the right hand side of the page, click "Install" again and then "Activate Plugin".

Browse to Flutter

tutuploadsmedia_1276341655482.png

Flutter adds two areas to your Wordpress admin screen. Under "Settings" you'll find "Flutter" which is the main configuration for the plugin. There will also be a whole new area called "Flutter" which is where you will add content.

Create a Write Panel

tutuploadsmedia_1276341789544.png

Click on "Write Panels" and then "Create Write Panel". You can choose different options for your panel. For example, to simplify things for your users you can unpublish custom fields, password, excerpt and other features that are confusing for beginners. Click "Finish" when you're done.

Add Fields to Your New Write Panel

tutuploadsmedia_1276342025515.png

If you'd like to you can group your fields into different areas. For Movies, you might have a group of fields called "People" and inside that fields called "Director", "Cinematographer" and so on. You might also have a group of fields called "Details" and inside that fields called "Release Date", "Genre" and so on. We're going to set that up and click on "Create a Group".

Name Your Group

tutuploadsmedia_1276342215286.png

Create Fields

tutuploadsmedia_1276342243551.png

Enter the Field Details

tutuploadsmedia_1276342323533.png

Flutter will offer you all sorts of options for the field. A "Textbox" is a simple one-line text field but you can also allow people to write in a larger area (Multiline textbox) multiple choices (Checkbox List, Radiobutton List) or even to upload files or images (useful in example to upload movies posters for example). Choose your options then click "Continue" and "Finish".

Add More Fields

tutuploadsmedia_1276342581297.png

See if you can go ahead and create extra fields and one extra group so that your "Movies" Write Panel looks like the image above.

Go and Start Writing

tutuploadsmedia_1276342733413.png

You'll see that Flutter has added a new option called "Movies" at the top left, underneath "Posts". Click "New" to start writing.

Enter Information Into Your Fields

tutuploadsmedia_1276342804666.png

The post page will look just as it does normally with just one exception ... your Flutter fields will show at the bottom of the page. View your post on the front of your site and your fields should be visible.