Step 1: First download from you purchase email or login and download from purchase history. Then install the com_portfolio

Step 2: After installation go to top Joomla admin menu Components => TLP Portfolio PRO


Then Go to options to setup the configuration option


Step 3: Configuration: For Settings there are 3 tabs General Settings, Style Settings and List View Page Fields control

Main Settings: General Settings

3.1) Image Path: First set image path where you want to store your image.

3.2) Image Size: Set Small, Medium and Large image width and height.

3.3) Grid Type: Set which Grid you want “Even Grid” or “Masonry Grid”.

3.4) Item to Item Margin: Bootstrap Default (30 px) or No Margin (0px)

3.5) Short Description Limit: Add short description limit by default is 15 characters

3.6) Display Per Row: Set how many you want to show per row.

3.7) Bootstrap Version: Select own Grid or if your template has Bootstrap 3 then select Bootstrap 3

3.8) Enable Font Awsame: If you template don’t have font awsame css then enable this otherwise icon don’t show.

3.9) Enable Social Share: Enable Social Share for detail page.

3.10) Link to detail: Set link to detail if Enable then next option work “Popup or normal link”



4. Main Settings: Style Settings

4.1) Primary Color: Set your main color based on your template color.

4.2) Overlay style: Set overlay color and overlay opacity.

4.3) Project Name Style: Set Project name font size, font color and text align.

4.4) Short Description Style: Set Short Description font size, Font color and Text Alignment.

4.5) Icon Style: Set icon font size and color


5. Main setting: Field control Show/ hide.

Which fields you want to display make it “Show” which field don’t want to display make it “Hide”.


Step 6: Add Category:- Go to TLP Portfolio PRO => Categories

Then add your own category.


Add Form: Enter Category name then Save.


Step 7: Add Tools:- Got to TLP Portfolio Pro=> Tools

Then add which Tools you want to add for your project.


Step 8: Add Portfolio Item Fill your designer fields then save.

8.1) Title: Enter Portfolio Title.

8.2) Category: Select category.

8.3) Short Description: Add short description.

8.4) Tools Used: Select Tools used in this project.

8.5) Project URL: Enter Project url it will be external url.

8.6) Client Name: Enter Client Name.

8.6) Add detail description of the project.

8.7) Portfolio image: Upload portfolio Main image.

8.8) Gallery: Add additional image for gallery.

8.9) Complete Date: Enter project complete date.

8.10) Related Project: Enter related project.


Portfolio List View Admin


Step 9. Make Menu link:

Go the Menu Manager where you want to add the portfolio menu then from the popup select TLP Portfolio PRO=> Portfolios


Menu Link General settings

Then from General setting you can set category, Layout , Grid type and others then the global settings will overwrite by this settings.


9.2) Menu link field selection:

You can select fields from here if set from here then global settings will overwrite.


10) How to set Masonry Grid

From Grid Type option select “Masonry” all layout has Masonry Grid option.


11) Isotope Layouts

Total 6 layouts for Isotope you can arrange different way.


12) Enable Module:

Go to Module Manager then search TLP Portfolio PRO now from Module settings you can select Category, Grid Type, Layout, Total Members, you can set menu id if want detail page link go other page and all others settings.


13) Module Style settings:

You can set primary color, overlay color, project name font style, short description font style and icon font size and color from here


14) Carousel Slider Module

Total 4 carousel layouts included select which layout you want then set the carousel slider settings Visible per slider, slider speed and others settings.


Slider Settings


15) Enable Search Plugin

Enable Search plugin if you want to show the portfolio item in Joomla core search.

16) Content Plugin

You can enable this plugin if want to call portfolio item into Joomla Article  with this syntax

{tlpportfolio id=1} or{tlpportfolio id=1,2,5}