The DP Horizontal Scrolling Portfolio module for Divi 5 locks vertical page scroll to translate portfolio project cards horizontally across the screen, creating an immersive showcase.

How to add module on page

To integrate this scroll-bound horizontal layout, follow these steps:

1. Create/Edit a Page/Post with the Divi builder.
2. Create/Edit a row.
3. Click on Add New Module; choose the DP Horizontal Scrolling Portfolio module.

Content settings

Portfolio query

Configure which projects to fetch. Select maximum post limits, specify project categories, and set sort orders (ASC, DESC, or Date).

Card elements

Toggle display parameters for portfolio card details, including Featured Image, Project Title, Short Description Excerpt, Categories, and Action Buttons.

Design settings

Scroll track height

Adjust the track height setting to control the speed and length of the horizontal sliding effect. A larger track height locks the vertical screen longer, creating a slower horizontal slide.

Card dimensions and gaps

Control the width of individual portfolio cards, space gaps between slides, card aspect ratios, and padding/margin properties.

Action buttons

Customize the Call-to-Action buttons on your project cards with custom colors, typography, hover transitions, and borders.

Frequently Asked Questions

How does the horizontal scrolling effect trigger?

When the user scrolls vertically past the module, the layout locks in place. Further scrolling slides the project cards horizontally. Standard vertical page scroll resumes once the final card is shown.

Can I control how long the horizontal section stays locked?

Yes. You can adjust the Scroll Track Height in the design settings. Increasing the track height slows down the horizontal movement, keeping the cards on screen longer.

Can I display description excerpts on the cards?

Yes, you can toggle the Excerpt visibility toggle in the Content elements tab and define custom excerpt lengths.