Portfolio/Posts

Open up Elementor Editor and create a new section. Go to Elements panel, find crumble widgets and you will see Portfolio, just drag-n-drop it to a newly created section. You'll get a basic layout which you can make full of the images that you want to showcase in your portfolio.

Content

Layout

  1. Layout: Change Layout if you want to leave Grid or Carousel

  2. Skin: Set the skin of portfolio Meta Outside or Inside

  3. Columns: Set the number of columns displayed in the widget

  4. Stretch: Set if you want to Stretch portfolio widget

  5. Masonry: Decide if you want to have Masonry portfolio

  6. Metro Grid: Decide if you want to have Metro portfolio

  7. Image size: Set the size of the images

  8. Item ratio: Set the ratio of the items

  9. Show title: Choose whether to show or hide the title. The title will display while hovering over the images

  10. Title HTML tag: Wrap the title with a tag, either H1...H6, span, div or paragraph

  11. Like Button: Set if you want to Show or Hide Like button

  12. Hover Icon: Choose to Show or Hide hover

Carousel

  • Items: Enter the number of the portfolio items you want to see on the screen on a slide.

  • Margin: Enter the margin space, the number will be represented in pixels.

  • Height: Select if you want to use auto height from images or set them custom.

  • RTL (Right To Left): Set On or Off Right to the Left Carousel

  • Center: Turn On if you want to set Center Item

  • Loop: Infinity loop. Duplicate last and first items to get loop illusion.

  • Mouse Drag: It enables the drag with the mouse.

  • Touch Drag: It enabled the touch drag.

  • Navigation: Shows the prev and next buttons on the carousel.

  • Dots: Shows the dots.

  • Autoplay: It plays by itself.

  • Pause on mover house: You will stop the play on mouseover.

  • Stage Padding: Padding-left and right on stage (can see neighbors).

  • Start Position: Enter from which element you want to start the position of the carousel.

  • AutoPlay Timeout: Autoplay interval timeout, the number is represented in seconds.

  • Smart Speed: Speed Calculate, the number is represented in seconds.

Query

Source: Select the source from which the widget will display the content. Options include posts, pages, custom post types if available, manual selection, current query, and related. Depending upon which source you’ve chosen for the query, you’ll be given options which allow you to filter the results.

Options

  1. Portfolio Categories: You can choose which categories you want to be seen in your portfolio

  2. Order By: Set the order in which the posts will be displayed. Options include: Date, Title, Menu Order, or Random

  3. Order: DESC (descending) or ASC (ascending)

  4. Posts Per Page: Set the exact amount of posts to be displayed in the widget

  5. Offset: Use this setting to skip over posts (e.g. '2' to skip over 2 posts)

  6. Custom Query: Select the posts you want to show

Filter Bar

  1. Show: Set whether to show or hide the filter bar above the portfolio

  2. Counter Tooltip: Choose if you want to Show or Hide Tooltip

  3. Show All: You can display or hide the button, you can also change the text of this button

  4. Categories To Show: You can choose which categories you want to be seen in your filter bar

Style

Items

  1. Item Gap: Set the exact gap between the items

  2. Rows Gap: Set the exact gap between rows of items

  3. Border Radius: Set the border radius for the images to control corner roundness

Items overlay

  1. Visibility: Display or Hide item overlay

  2. Active: Set if you want to leave Active Overlay

  3. Opacity: Set the overlay opacity

  4. Spacing: Set the space in Overlay

  5. Background Color: Set the background color of the overlay when you hover over the image

  6. Dominant Background Color: Use image dominant color as Background color

  7. Color: Set the post’s Title color. The title appears within the overlay when you hover over the image

  8. Typography: Customize the typography of the Title

Like Button

  1. Background Color: Set the background color of the Like Button

  2. Dominant Background Color: Use image dominant color as Background color

  3. Color: Set the color of the Icon

  4. Custom Icon: Change the Icon

  5. Icon Size: Set the size of Icon

Filter bar

  1. Color: Set the color of the Filter Bar text

  2. Active Color: Set the color for the Filter Bar’s active text

  3. Typography: Customize the typography of the Filter Bar text

  4. Space Between Items: Set the space between the items in the Filter Bar

  5. Filter Spacing: Set the spacing between the Filter Bar and the images

Pagination

  1. Color: Set the color of the Pagination text

  2. Text Color: Set the color for the Pagination text

  3. Typography: Customize the typography of the Filter Bar text

  4. Space: Set the space of the Pagination

Single Post with Content Absolute

If you want to make single Portfolio Post v5 first you need to make a section and put carousel inside of this section with full width and height. After that you need to create new section and put inside title and content. To make this section with position absolute click to edit this section and Go to Advanced > CSS Classes and put this .c-position--absolute-right-bottom to CSS Classes and click Update

Last updated