WP Portfolio 文档

Change site loading message

Clicking on the Quick View button on the Website Portfolio shows a loading message. This message is displayed while the plugin fetches your website design from the respective URL.
This site loading message is displayed for a few seconds. You can alter this message text with the following filter. Add filter to your child theme』s functions.php file.
if( ! function_exists( 'prefix_chage_site_loading_message' ) ) ;
function prefix_chage_site_loading_message( $defaults ) {
$defaults['siteLoadingTitle' ] = __( 'My Title', 'astra-portfolio' );
$defaults['siteLoadingMessage' ] = __( 'My Loading Message.', 'astra-portfolio' );
return $defaults;
}
add_filter( 'astra_portfolio_shortcode_localize_vars', 'prefix_chage_site_loading_message' );

Update Navigation Link Strings on Single Portfolio Page

While using WP Portfolio with Astra theme you will see navigation links on a single portfolio page. These links will allow navigating to the next/previous single page portfolio.

In case you need to alter this navigation link text use the following filter. Paste the filter code into the child theme』s functions.php file.
function astra_child_change_nav_links( $defaults )
{
if( 'astra-portfolio' === get_post_type() ) {
$defaults['string-single-navigation-next'] = __( 'My Next Custom Text', 'astra' ) . ' →';
$defaults['string-single-navigation-previous'] = '← ' . __( 'My Previous Custom Text', 'astra' );
}
return $defaults;
}
add_filter( 'astra_default_strings', 'astra_child_change_nav_links' );

How to Reorder Portfolio Taxonomies?

Sometimes you might need to reorder categories and other categories that display in the filter bar. This can be done easily with Category Order and Taxonomy Terms Order plugin.

Install and activate Category Order and Taxonomy Terms Order plugin.
Go to Portfolio > Taxonomy Order
Choose taxonomy you wish to reorder and arrange them

Portfolio not Displaying with Page Builder Modules

WP Portfolio allows displaying 4 different types of portfolios –

Website
Image
Video
Single Page

Except for a Single Page type, all other portfolios do not have WordPress editor in the setting. They only have input fields for an image, required URL and a few related options. So if you view any of these portfolio types, you will get Page Not Found error. As these portfolios do not have WordPress editor/content that can be shown in the frontend, when viewed individually, the plugin unlists them.
Whenever you display these portfolios with Page Builder modules, you get blank results. As mentioned above, the reason is the WP Portfolio plugin unlists website, image, and video portfolios and restricts them to display in the frontend.
In order to display portfolios with any Page Builder module, you need to remove the restriction by the WP Portfolio plugin. You can do so with the following filter. Add a filter in the child theme』s functions.php file.
add_filter( 'astra_portfolio_exclude_portfolio_items', '__return_false' );
For Example – the following screenshot shows the portfolio added with Elementor Pro – Portfolio widget. It shows portfolios in the backend like –

But in the frontend, it shows empty results –
After adding above mentioned filter, portfolios will display in the frontend like –

How to Create Image Portfolio?

Want to showcase images in a nice gallery with sorting and searching options? This article will help you achieve it.
Have a look at the demo page for Image Gallery.
In order to create an image gallery follow the steps –
Step 1 – Add a new portfolio.
Step 2 – Add a Title and Set portfolio type as Image.
Step 3 – Set Thumbnail Image and Portfolio Image. Thumbnail image will be displayed in the Image Gallery, while the Portfolio image will be displayed when a user clicks on the thumbnail image within the gallery.
Step 4 – Set categories and other categories for the image.

If you have set a similar category for different portfolio types ( Website, Image, Video, Single Page ) you can add a tag to make the image more specific.

Step 5 – Repeat above 4 steps to add all your images to the portfolio.
Step 6 – Copy the IDs for all categories, other categories, and tags that are set for all images in the portfolio. See how to get the ID for categories, other categories, and tags? 
Step 7 – Go to a page where you wish to display Image Gallery. Use following shortcode with the IDs that you copied in step 6.
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" 
See more information about all shortcode attributes here.
Your Image Galley will display on the page. You can use the above shortcode in the post as well.
Note: After adding the shortcode to the page, if you are getting No Items Found message on the page in the front end, flush the permalinks once.

How to Create Websites Portfolio?

You can showcase all your websites in a nice portfolio easily with sorting and searching options. You can do this with the portfolio shortcode.
Have a look at the demo page of Website Portfolio. You』ll see how your portfolio will look when you add your own created websites in it.
In order to create a Website Portfolio, follow the steps mentioned below –
Step 1 – Add a new portfolio by clicking on the Add New link seen under Portfolio.
Step 2 – Add a Title and Set portfolio type as Website. Move to the next step by clicking on the Add Portfolio button.
Step 3 – Set Thumbnail Image and your website URL.

The thumbnail image is the image that will represent a website within a portfolio. When you click on the thumbnail image (within the portfolio), the respective website will be previewed on the same page.
Check option 「Open in New Tab」 if you want to open a website in a new tab.
「Add Call-to-action」 allows adding text/HTML on the preview bar. Preview bar displays when you preview website on the same page. (screenshot)

Step 4 – Set categories and other categories for the websites.

If you have set a similar category for different portfolio types (Website, Image, Video, Single Page) you can add a tag to make the website portfolio more specific.

Step 5 – Repeat above 4 steps to add all your websites to the portfolio.
Step 6 – Copy the IDs for all categories, other categories, and tags that are set for all websites in the portfolio. See how to get the ID for categories, other categories, and tags? 
Step 7 – Go to a page where you wish to display the Website Portfolio. Use following shortcode with the IDs that you copied in step 6.
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" 
See more information about all shortcode attributes here.
Your Website Portfolio will be displayed on the page. You can use the above shortcode in posts as well.
Note: In case you get a No Items Found error after adding the shortcode to a page, try flushing the permalinks once. If this does not work, please get in touch with us.

Related Documents –
How to Show Specific Portfolio Items?
How to Hide Portfolio Menu Panel?
How to Create Video Gallery?
How to Create Image Gallery?

How to add ACF into the WP Portfolio markup?

Sometimes you may need to create Advanced Custom Fields (ACF) for custom requirements. These fields can be added to portfolio edit pages. Once added, ACF will appear on all portfolio types [Website, Video, Image, Single Page].
Here are the steps to add ACF to WP Portfolio markup –
Step 1 – Add required ACF to your site: You can do it with the external plugin or custom code. Save the meta key for ACF.
Step 2 – Add below code snippet into the child theme』s functions.php file. Note: Replace field-1 with your own field name.
/**
* Add Extra rest field
*
* @todo Change the `prefix_` and with your own unique prefix.
*
* @since 1.0.0
*/
if( ! function_exists( 'prefix_add_post_meta' ) ) :

// Add `field-1` for post type `astra-portfolio`.
function prefix_add_post_meta() {
register_rest_field(
'astra-portfolio', // Post type.
'field-1', // Post meta key.
array(
'get_callback' => 'prefix_rest_field_1',
'schema' => null,
)
);
}
add_action( 'rest_api_init', 'prefix_add_post_meta' );
endif;

// Callback of `field-1` for post type `astra-portfolio`.
if( ! function_exists( 'prefix_rest_field_1' ) ) :
/**
* Return meta value
*
* @since 1.0.0
* @param string $object Rest Object.
* @param string $field_name Rest Field.
* @param array $request Rest Request.
* @return mixed Null or Site Featured Image.
*/
function prefix_rest_field_1( $object, $field_name, $request ) {
return get_post_meta( $object['id'], $field_name, 1 );
}

endif;
Step 3 – Add ACF to the portfolio edit page: First copy the portfolio page template /includes/tmpl-responsive-view.php into the child theme. Then override it to add ACF at the position you want. You can access the ACF like –
data.items[ key ]['']
Use the above code to access and use ACF filed.

No Items Found message – flush the permalinks.

After adding WP Portfolio shortcode to the page or post, sometimes you might see No Items Found message in the front end. In this case, try to flush the permalinks once.
Below are the steps to follow –
Step 1: In the WordPress admin area, go to 「Settings > Permalinks」.
Step 2: Click 「Save Changes」.
Step 3: Permalinks and rewrite rules are flushed.

How to Create Single Page Portfolio?

Want to showcase single pages in a gallery with sorting and searching options? This article will help you achieve it.
Have a look at the demo page for Single Page.
In order to create Single Page portfolio follow the steps –
Step 1 – Add a new portfolio.
Step 2 – Add a Title and Set portfolio type as Single Page. Click on Add Portfolio button. 
Step 3 – Single Page Portfolio offers a WordPress default editor as well as Page Builder editor to design your page. You can add your content with default WP editor or use page builder template. If you are not able to see the option to edit page with page builder you are using, refer next step.
Step 4 –  To create a Single Page Portfolio with page builder, first you need to allow portfolio – post type to be edited with page builder. For example – with Elementor, navigate to Elementor > Settings. Tick the checkbox for  Portfolio in Post Types. Save Changes. This will allow Portfolio to be edited with Elementor page builder. Refer screenshot here.
You can follow the similar process for other page builders.
Step 5 – After adding content to the page, set the thumbnail image and select Open Portfolio Item in. If you are not able to see portfolio settings, make sure they are enabled from screen options.

Step 6 – Set categories and other categories for the single page.

If you have set a similar category for different portfolio types ( Website, Image, Video ) you can add a tag to make the page more specific.

Step 7 – Repeat above steps to add all your single page to the portfolio.
Step 8 – Copy the IDs for all categories, other categories, and tags that are set for all single pages in the portfolio. See how to get the ID for categories, other categories, and tags? 
Step 9 – Go to a page where you wish to display a single page portfolio. Use following shortcode with the IDs that you copied in step 8.
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" 
See more information about all shortcode attributes here.
Your Single Page Portfolio will display on the page. You can use the above shortcode in the post as well.
Note: After adding the shortcode to the page, if you are getting No Items Found message on the page in the front end, flush the permalinks once.

How to activate WP Portfolio license?

After installing WP Portfolio plugin on the site, you need to activate its license key. License activation registers the product to receive free updates, you can log in to our support center to request support and more.

See how to get license key here. Copy the license key.
From the WordPress dashboard, visit to Plugins.
Click on the Activate License tab under plugin WP Portfolio.
Enter license key you copied in above step.
Click on Activate License. That』s it!