WP Portfolio 文檔

WP Portfolio ShortCode and Attributes

wp_portfolio
Above is the default WP Portfolio shortcode that is used to display the portfolio on the page/post.
You can customize the shortcode to display/hide some sections of the portfolio using attributes. Related attributes and their usage are listed below –

Shortcode Attribute
Value
Use

show-categories
yes/no
Display categories names in the top bar of the portfolio.

categories
category id number
Accepts category IDs separated by comma. Portfolio assigned with these categories will display.

show-other-categories
yes/no
Display other categories names in the top bar of the portfolio.

other-categories
other category id number
Accepts category IDs separated by comma. Portfolio assigned with these categories will display.

tags
tag id number
Accepts tag IDs separated by comma. Portfolio assigned with these tags will display.

show-search
yes/no
Show search box in the top bar of the portfolio.

columns
number of columns
Number of columns to display portfolio.

show-portfolio-on
scroll/click
Decide load more portfolio items on a scroll or on click of the button. By default it』s scroll.

per-page
number of portfolios
Decide number of portfolios that will display on each scroll or on button click.

show-quick-view
yes/no
Decide whether to display Quick View button on portfolio. Button will be visible on hovering the portfolio.

quick-view-text
Custom Text
Enter a custom text for the Quick View button

other-category-show-all
yes/no
Decide to display 「All」 tab for Other Categories.

category-show-all
yes/no
Decide to display 「All」 tab for Categories.

Below is the example of shortcode with all attributes –
wp_portfolio show-categories="yes"categories="1,2,3,4" show-other-categories="yes" other-categories="5,6" tags="10" columns="2" show-search="no" show-portfolio-on="click" per-page="4" show-quick-view="yes" quick-view-text="My Quick View Text" other-category-show-all="yes" category-show-all="yes"
Note: If default shortcode wp_portfoliois not displaying all menu sections then check Display settings. Read How to Hide Portfolio Menu Panel?
Related Documents –
How to Get the ID for Categories, Other Categories, and Tags?

How To Resolve 『No Items Found』 Error?

Are you seeing the 『No Items Found』 error after adding the WP Portfolio shortcode to the page? If yes, this article will help you to understand the reason for this error and how to fix it.

There are various cases when you can see such notice and it mostly appears on the front end.

1. Shortcode

WP Portfolio shortcode helps you to display required portfolios on page/post. If you add this shortcode without a shortcode block or widget, you might see a 『No Items Found』 error. 

Solution – 

Always use a dedicated shortcode block/widget/module to add the WP Portfolio shortcode. This way shortcode will work perfectly and give you the desired output. 

2. iThemes Security Plugin 

WP Portfolio uses a grid structure to display portfolios. Grid structure means a row-column layout. 

When you add WP Portfolio shortcode on page/post it is expected to display portfolios in row-column layout.

This grid structure is generated by the WP Portfolio plugin using the REST API call. 

If you are using the iThemes Security plugin, it is most likely to block REST API calls. 

If REST API calls are disabled, WP Portfolio can not generate a grid structure and displays an error 『No Items Found』. 

Solution – 

To fix this issue, you need to enable REST API access from the iThemes Security plugin. 

You can do so by following easy steps – 

Step 1: From your WordPress dashboard, visit  Security menu item > Settings > WordPress Tweaks > Configure Settings 

Step 2:  Set REST API to Default Access and click on Save Settings

3. SG Optimizer Plugin

If you are using the SG Optimizer plugin and have enabled its lazy loading feature, you might see a 『No Items Found』 error. The lazy loading option can create conflicts with the WP Portfolio plugin. 

Solution –  

You can easily fix this issue by disabling the Lazy Load option from the SG Optimizer plugin.

To do so, from your WordPress dashboard, visit SG Optimizer >  and turn off Fix for Lazy Loading Short Codes. 

After trying all the above suggestions, if you are still facing the issue, contact our support team for further guidance.

How to Install WP Portfolio?

Before we begin with the installation, we extend a warm welcome and wish you a wonderful experience with the WP Portfolio.

In order to install the WP Portfolio on your WordPress Website, you will have to follow the steps mentioned below.

Log in to our store.Go to My Accounts -> DownloadsDownload the plugin. You』ll get a zip file on your computer.On your WordPress website, install the zip file like you install any other plugin.Activate the plugin.

You are all set to create an attractive showcase that will complete website demos and shows them off to your clients.

Getting Started with WP Portfolio

The WP Portfolio allows showcasing beautiful websites, images, videos, and single pages to attract your clients and customers. The plugin helps you to display them together and create a good impression on clients. This article will help you to get started with the plugin –

– Install the Plugin

In order to install the WP Portfolio on your WordPress Website, follow the steps mentioned here.

– Activate the license 

Activating your license or purchase key is very important. This way, you are registering the purchase you』ve made and therefore will receive free updates from us. You can find the key on the license page when you log in to our store. See more information here.

Once you get a license key from the store account, see how to activate it from the WordPress dashboard here.

– Portfolio Types

WP Portfolio allows creating four different types of portfolios –

Type 1: Website

This type allows showcasing beautifully designed websites. Let』s consider you are a web designer and want to showcase stunning websites you designed for a client or have some demo sites. This type will suit you better.Website portfolio can have a thumbnail image that will give a quick design overview of the website. Then a URL can be set to this image so when a visitor clicks on the thumbnail image, he/she can see the entire website.Explore the detailed steps to create a website portfolio.

Type 2: Image 

This is quite similar to the Image Gallery. Images can be showcased with filters.This type allows adding two images – Thumbnail and Portfolio. A thumbnail image can show a quick overview of the image. Clicking on it will open a full image.Take a look at how this portfolio can be created.

Type 3: Video 

This type will allow showcasing a video gallery with sorting and searching options.A thumbnail image will display in front. Clicking on the image will open a video in the iFrame.See how to create a video portfolio.

Type 4: Single Page

With this type, you can design a single page and showcase them with filterable tabs.Single page can be designed with WordPress default editor or with any page builder.A thumbnail image will show an overview and clicking on it will open a full page.Refer detailed steps for creating a Single Page Portfolio.

– Ready to Import Website Portfolios

The plugin offers ready-made website portfolios built with popular Astra WordPress theme.  Astra has a library for ready-made websites, built with famous page builders like Elementor, Beaver Builder, Brizy and WordPress default editor – Gutenberg.

You can import these websites as portfolios and showcase them as your own sites. It will create a nice collection of websites that you can offer your clients to choose from. Here are the detailed steps to import Astra website portfolios.

– How Portfolio can be Displayed on a Page?

WP Portfolio plugin provides an easy shortcode to display portfolios anywhere on the website.

wp_portfolio is a default shortcode that will display all available portfolios. You can specify portfolio display using various attributes for this shortcode.

Here is a complete list of all available shortcode attributes.

An overview of the process that needs to be followed –

Create required type of portfolio (website/ image/video/single page)Assign appropriate category/other category/tag for portfoliosDisplay portfolios with shortcode and its required attributes.

How to replicate Starter Templates library?

Starter Templates built with Astra are showcased with the WP Portfolio plugin on the library page.  Once you have WP Portfolio plugin installed and activated, you can replicate this page on your site with the following steps –
Step 1 – From the dashboard navigate to Portfolio > Settings
Step 2 – Click on Import Starter Templates. This will import all ready-made website portfolios.

Step 3 – Once the above process is completed, imported portfolios are added as a draft under the All Portfolios list. You would need to publish all/required portfolios from this list.
Step 4 – Now go to the page where you wish to showcase portfolios and paste the portfolio shortcode 

Elementor

Beaver Builder

Gutenberg

Brizy

All

Blog

Business

eCommerce

Free

Other

Animals

Leaves

Food

Rocks

Nature/Landscapes

Garden

Wines

Student

Kids

Single Page

Search

, with a shortcode block/module in the editor.

How to Import Ready Portfolio Items?

WP Portfolio allows you to import ready website demos that can be added to your portfolio.
Let us take a look at how you can import these demos on your website.
1. Click on Settings under WP Portfolio in your WordPress backend.

2. Select your favorite page builder from the list. Portfolios built with the chosen page builder will only be imported. Choose 「All」 to import all available portfolios with different page builders. You can see all the available portfolios here in the library.
After selecting a page builder, click on the 「Sync」 button. This will start the import process.

3. The import process might take a few minutes to complete, but you may resume your work as this happens in the background.
You will see another notice as soon as all the portfolios are imported.
Note: Portfolio items will be imported as a draft. You can find all imported items under  「All Portfolio Items」

4. You can choose particular portfolios and publish them manually. In case you need to publish a number of portfolios at a time you can bulk edit portfolios.
Select Portfolios -> Click on Edit -> Click on Apply as shown in screenshot.

5. Select it to 「Published」 and update the changes.

6. To display portfolios on a page, use the portfolio shortcode

Elementor

Beaver Builder

Gutenberg

Brizy

All

Blog

Business

eCommerce

Free

Other

Animals

Leaves

Food

Rocks

Nature/Landscapes

Garden

Wines

Student

Kids

Single Page

Search

. Add it with a shortcode block/module in the editor.
Need help? Get in touch.

How to Override Portfolio Templates?

Sometimes you may need to customize the portfolio design or markup. It might be a default Quick View button or a preview bar or anything else. And so we have added a customization support for the portfolio templates. With this feature, the markup of the portfolio can be customized. You can override a portfolio template and add your custom code.
Below are some portfolio templates that are available for the customization –

includes/shortcode.php
includes/tmpl-responsive-view.php
includes/tmpl-portfolio-filters.php
includes/tmpl-no-items-found.php
includes/tmpl-portfolio-list.php

How to override a portfolio template?
You can override portfolio templates with a child theme. It is recommended to add all your custom code to child theme so that you won』t lose any modification even after updating the theme. Below are the steps to follow –
Step 1: Open file structure of your WordPress website. You can open it with FTP or any other preferred way.
Step 2: From the plugins area visit –  /astra-portfolio/includes/ and copy the template which you want to override.
Step 3: Go to your child theme and create a directory /astra-portfolio/ in your child theme.
Step 4: Now paste the code you copied in step 2.
Step 5: You can now customize this code as per need.
For Example – If you wish to override includes/tmpl-responsive-view.php template, then from the plugins area visit /astra-portfolio/includes/tmpl-responsive-view.php and copy the file. Create directory astra-portfolio in the child theme and paste code into the child theme directory /astra-portfolio/

How to Change 「Quick View」 String?

Hovering over the portfolio item shows the Quick View button. If you need to change the text on this button, you can tweak a shortcode as shown below. 「quick-view-text」 attribute allows adding custom text for a quick view button.

wp_portfolio quick-view-text="Show Portfolio"

Note: Replace 「Show Portfolio」 with your custom text.

View the complete list for shortcode attributes here.

Re-import Starter Templates in Portfolio

You might have imported all starter sites while getting started with the WP Portfolio plugin. In case you deleted some of the previously imported starter sites, you can re-import them with the Sync option.
You can also fetch newly added starter sites with the Sync option.
Find this setting under WP Portfolio > Settings > General > Import Starter Sites > Sync. Also, make sure to choose preferred Page Builder.

Once Sync is completed, you will see previously deleted and newly added portfolios under WP Portfolio > All Portfolio Items in a draft.

How to Change the Default Custom Post Type Slug in WP Portfolio?

Have you ever wanted to add a custom slug that gets displayed when a user opens a portfolio item?
The image below will give you a clear picture of what we are talking about.

In order to set up a slug like this, you will have to go to the Settings page of WP Portfolio. Visit Advanced tab, you』ll find an option where you can rewrite the slug.

 
Save the changes and go ahead!