Advanced Portfolio Plugin for wordpress. With B5 Portfolios you will be able to setup easily your projects for displaying in a creative way, with multiple configuration options for easy customization. Also features a Team Members and Clients Shortcodes. Display as a Grid, Carousel or as a Masonry, Choose the style for the thumbnails, and the sharing options for your projects. B5 Portfolio is the perfect partner for your theme.
Thank you for purchasing B5 Portfolio. If you have any questions that aren't covered in the documentation, then please feel free to email via our user page contact form here. Thanks again!
Also take note of our online documentation. It provides further information and video tutorials about the plugin:
Before beginning the installation of the plugin you need to have wordpress installed and configured in your server. please refer this guide http://codex.wordpress.org/Installing_WordPress.
Wordpress Upload
Step 1 – Navigate to Plugins Add New.
Step 2 – Click the Upload Plugin button.
Step 3 – Navigate to find the “b5_portfolio.zip” file on your computer and click “Install Now”.
Step 4 – Once uploaded, activate the plugin. Go to Plugins Installed Plugins and activate it.
Step 5 – Then you will see a notification message.
Once activated you will find plugin stuff on menu bar.
Creating a portfolio category
Step 1 – Navigate to Portfolios Portfolio Categories.
Step 2 – Write the name on the section Add new portfolio category.
Creating a new portfolio
Step 1 – Navigate to Portfolios Add New.
Enter a title for the project.
Upload a Feature Image for the project.
Thumbnail Size - Select the Size for your thumbnail for display on the grid.
Layout - Select the type of portfolio project for display your content (Image, Image Slider, Video, Gallery Grid).
Image - Upload Image or Images if type (Image, Slider or Gallery) is selected.
Video URL - In case of select type (Video) enter the URL of the video (only youtube or vimeo supported).
Client - Use this field place the CLients Name for this portfolio
External Link - in case your project is displayed in an external site, place the full URL in this field, it will show a button on the frontend (VIEW PROJECT).
Portfolio Tags - Place the tags for your portfolio, it will be displayed on the portfolio footer on the frontend
Description - Place the description for your portfolio, be creative. In case you have installed Visual Composer, you will be able to use for building your post.
Step 2 – Select/Create categories for this portfolio project. See Portfolio Categories for more information about categories.
Step 5 – Click Publish button to save the portfolio.
Once portfolio has been created you can see it in the list. Navigate to Portfolios All Portfolios.
! important - if for some reasons thumbnails look out of resolution we recommend use the Regenerate Thumbnails plugin and convert all images.
Portfolio Settings
Step 1 – Navigate to Portfolios Settings.
Portfolio back icon URL - Place the return to portfolio grid url page. This icon will be placed in the single portfolios below the title.
Masonry View - When this option is ON thumbnail size chosen during Portfolio post type creation will be effective in frontend to show portfolio preview shortcode. Masonry Style Grid will take effect.
Love Portfolios - Activate or Deactivate the option for love counter of the projects.
Share portfolios - Users can share portfolios in single view using social networks. By default it is ON, if sharing on the theme used is ON, you can disable and it will take the layout of the theme
Portfolio Accent Color - Define the accent color for the elements on the portfolio section, hover caption, icons, links, button of the portfolio will take the color defined in this section
Caption Background Opacity - Choose the opacity value for the caption background color. Value from 0 to 1
Icon Color - Choose the color for the View Project and lightbox icon on the portfolio thumbnails
Icon Background Color - Choose the background color for the View Project and lightbox icon on the portfolio thumbnails
Icon Border Color - Choose the border color for the View Project and lightbox icon on the portfolio thumbnails
Show Title - Show the title on the portfolio thumbnails, if is OFF, the title will appear on hover the thumbnail. By Default is OFF
Title Color - The title color on the Portfolios Boxes hover.
Title Below Color - The title color on the Portfolios caption title when selected style 4 - Caption Below the image.
Title Font - Specify the title font properties on the Portfolios Boxes hover.
Filter Text Color - The filter text color.
Portfolio Shortcode
Step 1 – Navigate to Page Add New Page.
Step 2 – Click on the portfolio icon on top of the description area
Step 3 – Select the portfolio section and define the type of portfolio that you want to include in your page
Include Filter - Show or hide the filter on the portfolio grid, filtering will be by category
Portfolio style - Select the style for the hover effect on the thumbnails hover on the frontend
Carousel Mode - If checked will display the portfolio as a carousel
Portfolios to show - define number of portfolios to show on the grid
Columns - Define the number of columns of your portfolio grid.
Order By - Select ordering mode (by date, Title or Random)
Sort - Sort the content ascending or descending
Author - Define your portfolio grid by author, select one or various
Categories - Displays portfolio for specific categories if selected, leave unselected for diplay portfolios of all categories
Step 4 – Once defined all sections above, press (Add Shortcode) to place the code in the page.
Creating a Team Member category
Step 1 – Navigate to Team Add Team Member Categories
Step 2 – Write the name on the section Add new Team Member category.
Creating a new Team Member
Step 1 – Navigate to Team Add New Team Member
Step 2 – Add Name of the team member on the title section
Step 3 – Upload an image for the team member trough the feature image section
Role – Add Role for the team member, this element will be displayed below the Name on the frontend.
Description - Write a brief description for the team member.
External Link - Place an URL if the team member drives to a specific page, this input will overwrite the lightbox functionality
Social - If you want to include social links for your team member check this box. Place the URLs below on the displayed social network inputs.
Tags - Add team member tags if desired.
Team Settings
Step 1 – Navigate to Portfolio Settings Team
Masonry View - When this option is ON thumbnail size chosen during Team Member post type creation will be effective in frontend to show team preview shortcode. By default it is ON
Text Align - Choose the alignment for the text on the Team Member Boxes
Title Color - The title color for the team member on below image and overlay mode.
Title Font - Specify the title font properties for the team member on below image and overlay mode, it will be also effective on the Team Member Boxes.
Role Color - The role color for the team member on below image and overlay mode.
Role Font - Specify the role font properties for the team member on below image and overlay mode, it will be also effective on the Team Member Boxes.
Description Color - The lightbox description color for the team member on below image and overlay mode.
Description Font - Specify the lightbox description font properties for the team member on below image and overlay mode.
Background Color - The background color for the team member on below image mode.
Social Icons Color - The social icons color.
Social Icons Hover Color - The social icons hover color.
Team Shortcode
Step 1 – Navigate to Page Add New Page.
Step 2 – Click on the portfolio icon on top of the description area
Step 3 – Select the team section and define the type of team display that you want to include in your page
Team members to show - Enter a number of team members to show on the grid.
Team style - Select style for display team members. Overlay or Below Image
Portfolios to show - define number of portfolios to show on the grid
Order By - Select ordering mode (by date, Title or Random)
Sort - Sort the content ascending or descending
Categories - Displays team member for specific categories if selected, leave unselected for display team members of all categories
Step 4 – Once defined all sections above, press (Add Shortcode) to place the code in the page.
Create a client category
Step 1 – Navigate to Clients Clients Categories.
Step 2 – Write the name on the section Add new Client category.
Create a Client
Step 1 – Navigate to Clients Add New Client
Step 2 – Add Name of the client on the title section
Step 3 – Add image of the client on the feature image section
Step 4 – Add tags for the client if desired
External Link - Enter an URL for the clients link.
Clients Settings
Step 1 – Navigate to Portfolio Settings Clients
Carousel Columns - Choose the number of columns for your clients carousel in every step..
Clients Shortcode
Step 1 – Navigate to Page Add New Page.
Step 2 – Click on the portfolio icon on top of the description area
Step 3 – Select the client section and define the type of client display that you want to include in your page
Carousel Mode - Check if you want to show clients on carousel mode. By default its ON. If unchecked the clients will be displayed in a four columns grid.
Clients to Show - Define number of clients to show
Order By - Select ordering mode (by date, Title or Random)
Sort - Sort the content ascending or descending
Categories - Displays clients for specific categories if selected, leave unselected for display clients of all categories
If you are not confortable with the RAW code from the shortcodes, B5 portfolio is made to be compatible with one of the most popular page builders - VISUAL COMPOSER. Having a customized section and icons for easy access. featuring the same fields than the regular shortcode. This feature will speed up your process of website creation by 200%
Displayed as VC items
Plugins & JS included
With the installation of the plugins comes also a few third party plugins that were imprescindible for achieving the amazing visual result.
1.0