Modern Portfolio Pro Theme

Thank you for using the Genesis Framework by StudioPress and selecting the Modern Portfolio Pro theme. Following are the instructions for setting up your site to resemble the Modern Portfolio Pro theme demo.


If you have any trouble, please fill out the contact form for assistance.

You may wish to have the Modern Portfolio Pro theme demo open for reference while setting up your theme. The setup documentation for this theme has been broken down into the following sections:

Pre-Installation Setup

Compatibility

Make sure you have the following installed:

  • WordPress version 3.6+
  • Genesis Framework version 2.0+

Plugins

Before you begin, you will need to install and activate the following plugins. Of course, you may substitute your favorite plugin, but this is the one used in the Modern Portfolio Pro theme demo:

Back to Top

How to Import Demo Content

For your convenience, an export file of the Modern Portfolio Pro theme demo site is available to assist in the setup of your Modern Portfolio Pro theme. You’ll find more information about this in the Importing Demo Content tutorial.

Back to Top

Theme Installation

Once you have completed the pre-installation steps and you have the Genesis Framework installed, you may install the Modern Portfolio Pro theme. You will find theme installation instructions here.

Back to Top

How to Configure the Genesis Theme Settings

In your WordPress admin, navigate to Genesis > Theme Settings. Configure the Theme Settings as follows:

Back to Top

Color Style

  • Click on the Color Style Drop down to select an alternative color scheme for your site.
mpp-color-style.png

Back to Top

Default Layout

  • Click a thumbnail to select the Default Layout. The Modern Portfolio Pro theme uses the Content > Sidebar option.
mpp-default-layout.png

Back to Top

Content Archives

  • For Content Archives, the default setting of “Display post content” is used by the demo.
  • Leave the “Limit content to __ characters” option blank or set to 0.
  • Leave “Include the Featured Image?” checkbox unchecked.
  • Using the drop down box, select “Numeric” for the “Post Navigation Technique.”

Be sure to click the “Save Settings” button to preserve your changes.

mpp-content-archives.png

Back to Top

How to Set the Site Title

The site title and description for your site can be set by navigating to Settings > General.

  1. The Site Title will display in the upper left corner of your site.
  2. The Tagline Setting will not displayed when using the Modern Portfolio Pro Theme.
  3. Be sure to click the “Save Settings” button to preserve your changes.
mpp-general-settings.png

Back to Top

Site Initial

To change the Initial that is displayed to the left of the Site Title visit the Genesis Theme Settings and Enter a One Character Initial to be displayed.

Note: Only the first character entered in the setting field will be saved. Be sure to click the Save Settings button to preserve your changes.

mpp-site-initial.png

Back to Top

How to Use a Custom Header Image

For those that prefer a Logo Image rather than a text based Site Title and Initial it is also possible to use a small logo style image that will display in the upper left corner of the site.

To upload your header image, navigate to Appearance > Header menu. Images of exactly 300 × 90 pixels will give the best results. Other sizes will be cropped in the upload process to create an image of the correct size.

Be sure to click the “Save Changes” button to preserve your settings.

mpp-custom-header.png

Back to Top

How to Configure the Navigation Menus

In the Modern Portfolio Pro theme, the Primary Navigation menu area and a Menu Widget placed in the Header Right Widget area are used in the demo. The default navigation areas can be set by navigating to Appearance > Menus > Manage Locations. Set the Primary and navigation to the previously created menu from the drop down to set a menu to use the Primary Navigation Menu location. Set the Secondary Navigation Menu to the “Select a Menu” option in the drop down to disable the Secondary Navigation Menu location.

A Menu set in the Primary or Secondary Navigation Menu locations will display below the header area on all pages except the home page and pages using the Landing Page Template.

A Menu set using a Custom Menu Widget in the Header Right Widget area will display on all pages except pages using the Landing Page Template.

Be sure to click the “Save Settings” button to preserve your changes.

mpp-nav-locations.png

Back to Top

The main navigation used in the demo of the Modern Portfolio Pro theme is a custom Menu widget placed in the header right widget area.

Go to Appearance > Menus and create a new menu. Add your menu items.

Navigate to Appearance > Widgets. Choose the Custom menu widget and drag it to Header Right. In the widget settings, choose the navigation menu you created.

Be sure to click the “Save” button to preserve your changes.

mpp-header-right.png

Back to Top

How to Configure the Home Page

The Modern Portfolio Pro Home Page consists of Three Featured Areas as Follows:

  • Home – About
  • Home – Portfolio
  • Home – Services
  • Home – Blog

Back to Top

How to Configure the Home -About Widget Area

The Modern Portfolio Pro theme demo Home Page displays A welcome message with a short biographical introduction. The Modern Portfolio Pro theme demo uses a Text Widget in this area.

 

Be sure to click the Save button to preserve your changes

mpp-home-about.png

Back to Top

How to Configure the Home – Portfolio Widget Area

  1. Use a Title of your choice to describe the types of posts being featured in this area
  2. Select the category you wish to have displayed in this area
  3. The Modern Portfolio Pro theme demo is designed to show 6 featured posts in this widget area
  4. Check the box to display Featured Images
  5. Select the portfolio Image Size
  6. Select the Image Alignment option of “Left”
  7. Check the box to display Post Title
  8. Select the Content Type of “No Content”
  9. Limit Content to 0 Characters
  10. Use the text “[Read More...]” in the More Text field
  11. Be sure to click the “Save” button to preserve your changes.
mpp-home-portfolio.png

Back to Top

How to Configure the Home – Services Widget Area

The Home – Services widget area of the Modern Portfolio Pro theme demo is used to display a call to action with a button.

mpp-home-services.png

Back to Top

How to Configure the Home – Portfolio Widget Area

  1. Use a Title of your choice to describe the types of posts being featured in this area
  2. Select the category you wish to have displayed in this area
  3. The Modern Portfolio Pro theme demo is designed to show 3 featured posts in this widget area
  4. Check the box to display Featured Images
  5. Select the blog Image Size
  6. Select the Image Alignment option of “None”
  7. Check the box to display Post Title
  8. Select the Content Type of “Show Content Limit”
  9. Limit Content to 130 Characters
  10. Use the text “[Read More]” in the More Text field
  11. Be sure to click the “Save” button to preserve your changes.
mpp-home-portfolio_1.png

Back to Top

How to Configure the Primary Sidebar Area

The following widgets are used in the Primary Sidebar area that displays to the right side of the content area.

Be sure to click the “Save” button to preserve your changes.

mpp-primary-sidebar.png

Back to Top

Genesis eNews Extended Widget Settings:

mpp-enews.png

Back to Top

Recent Posts Widget Settings:

mpp-recent-posts.png

Back to Top

How to Configure the Footer Widget Areas

The Modern Portfolio Pro theme includes three (3) widget areas that will display in the footer area of the site when widgets are added to the individual Footer Widget Areas.

Back to Top

Footer 1 (Use Widget of your choice)

mpp-footer-1.png

Back to Top

Footer 2 (Use Widget of your choice)

mpp-footer-2.png

Back to Top

Footer 3 (Use Widgets of your choice)

mpp-footer-3.png

Back to Top

Special Widget areas Included in the Beautiful Pro Theme

The Modern Portfolio Pro theme includes the following special widget area(s) designed to display additional content on your site:

  • After Entry Widget Area – Displays after the content on single posts

Back to Top

Congratulations! You are now ready to begin adding content and personal touches to your new Modern Portfolio Pro and Genesis powered website. If you run into any problems along the way or have questions, please fill out the contact form and let us know how we can help.

Back to Top