Source: https://divicake.com/blog/divi-horizontal-vertical-scroll/ [Blog](https://divicake.com/blog/)/[Blogging](https://divicake.com/category/blogging/) # Make a Horizontal or Vertical Scroll Section/Page in Divi By Divi Cake·25 September 2024·Updated 19 August 2026·3 min read Make a Horizontal or Vertical Scroll Section/Page in Divi We may earn a commission from affiliate links in this post. [Disclosure policy](https://divicake.com/affiliate-disclosure-policy/) On this page - [Applying Horizontal Scroll Effects to Your Divi Global Body](https://divicake.com#applying-horizontal-scroll-effects-to-your-divi-global-body) - [Setting a Horizontal Scroll Effect in Divi for Row Sections](https://divicake.com#setting-a-horizontal-scroll-effect-in-divi-for-row-sections) - [Applying Vertical Scroll Effects in Divi](https://divicake.com#applying-vertical-scroll-effects-in-divi) - [Conclusion](https://divicake.com#conclusion) Creating horizontal and vertical scroll effects in [Divi](https://divicake.com/go/digital-agency-divi-child-theme/) is a simple yet effective way to add a dynamic and visually appealing touch to your website. These [scroll effects](https://divicake.com/blog/a-look-at-the-divi-animation-builder/#Divi_Scroll_Effects) not only enhance the overall design but also boost user engagement by introducing interactive elements that captivate visitors. Divi comes with built-in options for horizontal scrolling, allowing you to create sleek, sliding sections that give your website a modern and polished look. In addition to horizontal scrolling, Divi also enables you to apply vertical scroll effects, further expanding the interactive possibilities and giving your site a more engaging and immersive experience. In this tutorial, we will guide you through the process of applying both horizontal and vertical scroll effects to your Divi pages, rows, and modules. By following these easy, step-by-step instructions, you can elevate your web design, making it more dynamic and attractive to your audience. Whether you’re looking to enhance your global body section or specific rows and modules, the options for creating stunning scroll effects in Divi are at your fingertips. ## Applying Horizontal Scroll Effects to Your Divi Global Body To create a Horizontal Scroll Effect, first navigate to the specific page or section where you want the effect applied. If you’re looking to add this effect to your Global Body, start by clicking on Divi from your WordPress dashboard, then click on Theme Builder. From there, select the Body Edit option to begin customizing the horizontal scroll effect for your Global Body section. Navigating Divi Theme Builder to apply horizontal scroll effects to the Global Body. ### Setting a Horizontal Scroll Effect in Divi for Row Sections In this step, we’ll add a horizontal scroll effect to a specific section that we want to scroll. Whether you’re editing a complete row section or an individual module, click on the settings icon for that section, as shown in the screenshot below. Since we want to apply the scroll effect to the entire row section, we’ll click the settings icon for the row. Then, navigate to the Advanced tab and scroll down to find [Scroll Effects](https://divicake.com/blog/divi-scroll-effects/). Select Scroll Transform Effects, and under this, click the Horizontal Icon Button. Once clicked, you’ll see the Enable Horizontal Motion toggle enable this option. You can then set the Horizontal Motion and Motion Effect Trigger. Don’t forget to click the green button to save your changes. Applying a horizontal scroll effect to a row section in Divi using advanced scroll transform effects settings. ## Applying Vertical Scroll Effects in Divi In the Scroll Transform Effect, you have a variety of scroll effect options to choose from. To find the best one, try them out one by one. In this instance, we also applied the effect to a [Text module](https://divicake.com/blog/divi-modules/#44_Text) vertically, which is another easy option provided by the [Divi Page Builder](https://divicake.com/blog/what-is-divi-wordpress/). Click on the settings of the module you want to add the scroll effect to—just like we selected a Heading. Follow the same steps and this time, click on the Vertical Icon Button and enable the toggle button under this option. Selecting and enabling vertical scroll effects for a text module in Divi through the scroll transform effects settings. Read More: [How to Design Scroll Animated Bar Counters with Divi](https://divicake.com/go/how-to-design-scroll-animated-bar-counters-with-divi/) ## Conclusion Access [Divi](https://divicake.com/go/divi/) Theme Builder by navigating to the specific page or section where you want to apply horizontal or vertical scroll effects. For the Global Body, use Divi’s Theme Builder and click on the Body Edit option. Next, customize the scroll effects by selecting the section or module where you want to add the effect. Whether horizontal or vertical, go to the Advanced tab and locate Scroll Effects. To apply a horizontal scroll effect, choose the Scroll Transform Effects and enable the Horizontal Motion option. Adjust the settings as needed, including the motion trigger for a more customized look For vertical scroll effects, follow similar steps, but this time click on the Vertical Icon Button. Enable the vertical scroll and configure the motion effect to suit your design. Once you’ve applied the scroll effects, remember to save your work by clicking the green save button in Divi. By following these steps, you can successfully create both horizontal and vertical scroll effects, adding interactivity and enhancing the overall design of your website. Read More: [How to Create Scroll Animated Number Counters with Divi.](https://divicake.com/go/how-to-create-scroll-animated-number-counters-with-divi/) ## Written by Divi Cake Divi 5 tutorials, layouts and fixes from the team that builds Divi sites every week. - [About Divi Cake](https://divicake.com/about/) ## Get the Divi Cake newsletter New Divi tutorials and Divi Cake product news, by email. First name (optional)Email Company website SubscribeSubscribeSubscribe Unsubscribe any time. [Privacy policy](https://divicake.com/privacy/) The sign-up form needs JavaScript for its spam check. Almost done. Click the link in the email we just sent to confirm your subscription. If you are already subscribed, there is nothing more to do. ## Submit a comment Comments are read before they appear. Your email is not published. Comment NameEmail Company website Submit commentSubmit commentSubmit comment The comment form needs JavaScript for its spam check. Thanks. Your comment is waiting for review and will appear here once it is approved. ## Do you need help with … - [Divi 5 migration](https://divicake.com/divi-4-to-divi-5-migration/) - [Divi websites](https://divicake.com/divi-website-development/) - [Divi plugins](https://divicake.com/divi-plugin-development/) - [Fix a site](https://divicake.com/fix-existing-site/) - [Beyond Divi](https://divicake.com/beyond-divi/) - [Technical SEO](https://divicake.com/technical-seo/) - [SEO content](https://divicake.com/seo-content/) ## Newsletter New Divi tutorials and Divi Cake product news, by email. First name (optional)Email Company website SubscribeSubscribeSubscribe Unsubscribe any time. [Privacy policy](https://divicake.com/privacy/) The sign-up form needs JavaScript for its spam check. Almost done. Click the link in the email we just sent to confirm your subscription. If you are already subscribed, there is nothing more to do. ## Save Annually on Divi [Save 69% on Divi VIP](https://divicake.com/go/divi-vip/)[Save 69% on Divi Cloud](https://divicake.com/go/divi-cloud/)[Save 69%, Divi Team](https://divicake.com/go/divi-teams/) ## WordPress Hosting & Tools [100% off on Kinsta for 1 Month](https://divicake.com/go/kinsta/)[Get up to 62% off Bluehost hosting.](https://divicake.com/go/wordpress-hosting-blue-host/)[Save Up to 15% on Rank Math](https://divicake.com/go/rank-math/)[Get 50% OFF on all WPForms plans](https://divicake.com/go/wpforms/) ## More in Blogging [ How to make money with Divi Blogging10 min read ### How to Make Money with Divi Nine ways to earn an income with Divi — affiliate marketing, services, digital products, courses, memberships, sponsored posts and ads — and what your site needs before any of them work. 15 October 2026](https://divicake.com/blog/make-money-with-divi/) [ Customizing Divi for advanced WordPress development projects Blogging4 min read ### Customizing Divi for Advanced WordPress Development Projects Seven ways to take Divi past its stock settings on an advanced build: custom CSS and JavaScript, child themes, integrations, hooks and filters, and performance work. 11 October 2026](https://divicake.com/blog/customizing-divi/) [ Selling Divi websites and child themes Blogging10 min read ### How to Make Money Selling Divi Websites and Child Themes How to earn from Divi three ways: building sites for clients, selling finished websites through a brokerage or marketplace, and packaging child themes for sale. 29 September 2026](https://divicake.com/blog/selling-divi-websites-and-child-themes/)