Showcase Your Portfolio with the Projects App
In this article we’ll teach you how to show off your projects with the new Projects app on your created website. With this app, you can turn your website into an online portfolio to showcase your works! It’s easy and looks great.
See The Projects App in Action
How to Use
When you drop it, by default your app will look like the following image.
Notice that you have several projects and categories already there. You can edit those to enter your own content.
Change Default Items
To edit any of the current items on your app, double click either the sample image or the sample text below it.
This will open up a CMS panel window, from where you’ll be able to edit the content.
Add More Items
In order to add items to your projects app, go to the CMS panel by clicking on the wrench icon on the app toolbar.
On the CMS panel you’ll see the current items of your projects app.
To edit one, click on the “Edit” link on the row of the respective item.
The single-item editor will open.
Here (for each project) you can edit:
- Project name
- Subtitle (can be a tagline)
- Image (will be used as thumbnail)
- Date (you can change it)
- Description (can have images and videos too!)
To edit an image click on the “Edit Image” button on the right.
This image will be used as a thumbnail for your visitor to click and enter that item.
You can have different categories for different kinds of projects. For example, if you’re building a photography portfolio, your categories can be:
And similar. Or if you’re creating a showcase of a graphic designer, your categories could be named:
- Corporate Identity
To edit the categories, go to the “Manage Categories” tab of the CMS Panel (to open the CMS panel click on the pencil icon on the app toolbar, refer to the steps above to “Edit Content”).
Here you can rename any of your current categories, or delete one. If you want to add a new one, click on the next tab, labeled “New Category”.
You can select a category for any of your items (projects) when you are editing them.
The settings panel for the Project app is one of the most comprehensive of our website editor. You have a lots of options. To access them, click on the wrench icon of the app toolbar.
There you’ll see the following options sections:
- List View Settings
- Display Details on List View
- Image Rollover Effects
- Display Details on Entry View
We’ll go over each of them below.
Currently there’s only one option on the General section of the settings. It’s labeled “Show Categories Above List View”.
List View Settings
This will affect how your items are presented on your page. Here you can edit:
- Number of entries to show per page: you can enter a number manually to specify how many projects you want the app to show on each page (you can have more than one page to list your items).
- Columns: how many items you want your app to display on each row? You can select 1, 2, 3 or 4.
- Show project info: the options are “Below Image”, “Over Image”, “Above Image”, “Left Side” and “Right Side”.
- Show project info on: options are “Initial State” (doesn’t require your visitor to mouse over) and “Rollover State”.
Display Details on List View
The following details related to each project and be shown/hidden depending on each of the following check boxes:
- Show thumbnail: the image you set at each project.
- Show name: the title.
- Show subtitle: the tagline.
- Show date: the publishing date (which you can edit too).
- Show category.
Image Rollover Effects
Here you can select an effect to be applied to the image thumbnail when your visitor hovers over the it. You can set one of the following:
- Gray scale
Display Details on Entry View
The options available here will be displayed/hidden on the single-entry page. You can show/hide the date, and the category for each project.
Can I duplicate the Projects app?
No, you can only have one Projects app per page. But you can have several pages, and on each of them you’ll have one Projects app.
Can I use a video instead of images for the thumbnail?
No, you can’t put a video instead of the image thumbnail for your project. But you can add one or more videos on the description of each project, which will be displayed on the single-entry detail page.
Can I share a specific project instead of the general list-page?
Yes, each single-entry has a unique URL which you can copy and share.
What is the “single-entry” page?
The single entry view is available to a visitor when he clicks on any of the thumbnails or project names from the list. There they can learn more about that specific project and see its full description.
Doubts or comments? Please, share them on!