Creating a single Portfolio

To create a new single portfolio(project), go to Portfolio > Add New from the admin panel(Please make sure that the BM Content Builder plugin is activated).

Step by Step

  1. Portfolio > Add new
  2. Enter the title
  3. Please select one category(or more categories).
  4. Set the Featured image, the Featured image will be shown as the thumb in the portfolio list
  5. Set the “Layout Template”. If you want to create a normal layout, please select the “No Template“. If you want to create a “Text column + Images column” layout, please select the “Gallery on Left” or “Gallery on Right“.
  6. Click Publish(Update)

You could check the video guide also.

Category

Each portfolio must be set a category. The Category is for organizing the Portfolios.

There would be not categories if you start from a new website. Please create the category firstly.

Go to “Portfolio > Categories”, please create one category at least, all portfolios would be set within this category. You could name it as “Works” or others. If you have several sub-categories, please set “Works” as parent category of these categories.

Please go back the single Portfolio editing page, select category(ies):

You will use the category when you create the portfolio list page. You need to select the “Works” category for the portfolio list page(the portfolio list page is created by the “Grid” or “Masonry Grid” module normally). The sub-categories are for the filter (sorta) of the portfolio list page.

You could set “Featured Image” for a single portfolio, the featured image could be shown in portfolio list(“Grid” or “Masonry Grid” module):

The “Second Featured Image” is for showing-2nd-image-mouseover effect of the portfolio list(“Grid” or “Masonry Grid” module).

No Template

It has no specific layout restrictions. You could use the BM Content Builder editor with this template. You could create portfolio quickly by placeholder layout (click insert template in BM Content builder, check video guide), it looks like:

The portfolio could be set with or without “Title”, “Header”, “Footer”. Please enable the “Content From Page Top” and “Transparent Header Background” if you want to show the header above the hero section. You could set the logo and menu color scheme.

Check how to set the video thumbnail.

The “Gallery on Left/Right” is “Text column + Images column” layout(check video guide), it looks like: 

If the template set as “Gallery on Left” or “Gallery on Right”, the options would be shown:

Upload the image or pick up the existed image in media library:

Create the Gallery layout(Gallery column): 
Please set the “1-4” grid(s) or the Text for each line.
It supports simple HTML code in the “Text”. Please don’t add HTML code into the <a> tag, or the <a> tag will not work.

Turn on “Show Video”, you can enter the embed code to show video above/below gallery.

  • If it is a Youtube video, please enter the video URL like: https://vimeo.com/xxxxx
  • If it is a Vimeo video, please enter the video URL like: https://www.youtube.com/watch?v=xxxx
  • Please enter the complete embedded code for other media website like: <iframe>...</iframe>
  • If it is hosted video, please enter the codes like: <video controls="controls"><source src="the-video-file-URL.mp4" type="video/mp4"></video>

Enable Title Masking option, the title looks like:

Title

The main title of the page. It could be hidden by the “Show Title” option.

  • Show head – Show or hide the header bar
  • Show footer – Show or hide the footer bar
  • Show Header when Scrolling – the header bar will hide when open the page. It will show when page is scrolled
  • The scrolled distance to Activate Header – enter a number for the scrolled distance
  • Transparent Header Background – The header background will be transparent
  • Content From Page Top – the content area will start from the page top edge instead of the header bar.

If there is a hero section on the top of the page, please enable the 2 options.

  • Logo and Menu Color – set the logo and menu color. If the default logo/menu color is dark, you could set the light(alternative) color with a dark color background. You should set the default and alternative color scheme(uploaded logo file or color value) in the Theme Option.

Background

Set a background color for the page, you could set the font color also, all text content on the page will be forced to show as the color.

  • Enable All Images of The Page Navigated in The Same Lightbox – The option is disabled by default. Normally, if you enable Lightbox in a module of the BM Content builder, the images can only be navigated(Next/Pre) in the same module. The images in the different modules(Single Image, Grid, Masonry Modules) would be navigated in the same Lightbox if enable this option.

Video Tutorial

Please check the video tutorial for how to create a single portfolio:

Content:
00:18 – set the category
00:25 – set the Featured image
00:38 – set the No template, insert the placeholder layout in BM Content Builder
01:57 – set the Mask text
03:24 – set the Gallery on Left template
06:10 – set the Gallery on Right template

Was this article helpful?

Related Articles