SP Simple Portfolio
SP Simple Portfolio extension is a free Joomla! 3.x component designed to create interactive portfolio functionality with category filtration in to your website. Easy Portfolio contains also a module, which can be used on any place on current layout.
It will help you create and manage multiple image or video portfolios for your website with different sets of items and individual settings. It’s very easy and fast to create stunning portfolios and integrate them into your Joomla! site. Package can be download for free and use in both private & commercial projects
Package contains component and module - it means that you don't have to install them separately.
How to add new items
You have to start from adding a new tags in component, without them you won't be able to add new items. Add at least one new Tag. The same tag can be applied to many different items across portfolio.
Each new tag have its own name and alias. If you add one or more tags you can start to add new items.
You have to fill all fields marked with * : title, image, description and tags.
- Alias - the Alias is used in creating the URL (website address) for the detail page. By default component will use the Title for creating the alias (with modifications) unless you type an Alias in yourself. Joomla will make the alias all lower case, replace spaces with dashes and take out any characters that can not be accepted.
- Image - About choosing a image for item, you can use those which you have or upload a new one. We recommended image size : 1170px X 800px, but of course if you have only smaller you can also use them.
- Video URL - Portfolio items can contain not only images but also Youtube or Vimeo video clip. Just insert your video URL. Leave this filed blank if video is not required.
- Description - in this field you can add description or even addcional images which will be displayed on the item detail page under main image.
- Tags - All items are based on Tags system, which are similar to categories. Once you get to three letters you will start to see suggested tags that already exist. The advantage of this solution is that each item can be assigned to multiple tags. Also the same tag can be applied to many different content items across portfolio. Tags will be used to filter portfolio items.
- URL - Each item can include its own link. Leave this blank if you do not want to show project URL.
- Status - Whether this item is published or not.
- Language - Items include a basic way to implement a multi-language site. All items may be associated in different languages.
We suggest to add at least 3 or 4 items before you will create a menu link to component view. But in general component can use unlimited items and their tags.
Displaying a portfolio items
Once you have tags and some tagged items you can display portfolio in the front end in several ways.
- Using Menu Manager you can create a menu link that displays portfolio items.
- You can use SP Simple Portfolio module.
Each new menu item in Menu Manager include settings which can help you customize appearance of portfolio view.
- Show Filters - Enable or Disable showing filter buttons. Filter option can display a list of items that have a exactly this same tag to the currently clicked tag.
- Grid Layout Settings - select from Default, Gallery with or without space between images.
- Columns - select number of columns per row (2, 3 or 4).
- Thumbnail Size - select from Square, Rectangular shape or Masonry style.
- Items per page - enter the number, in most cases number 12 is optimal.
Masonry Gallery style (with space)
Masonry effect works by placing elements in optimal position based on available vertical space.
Square Gallery style (no-space)
If you don't need margins between images use "no-space" style in Layout settings.
Rectangular default style
If you want to show more info (title and tags) under portfolio thumbnails use default Layout style.
Under "Options" you will find few new settings, whcih allows you to:
- Set size of Square, Rectangle and Tower blocks
- Set type of Crop Ratio - with Crop, Scale Fill, Scale Fit and Crop Resize option.
- And fininally Reset Thumbnails to refresh created before thumbnails to get new size/apperance.