What Is Divi and Why Use It?

Divi is one of the most popular WordPress page builders in the world, developed by Elegant Themes. It gives you a drag-and-drop visual editor that lets you design pages without writing a single line of code — while still being powerful enough for developers who want to go deeper.

Whether you're building a portfolio, a business website, or an online store, Divi provides the flexibility and control to bring your vision to life directly on the front end of your site.

Step 1: Installing Divi on WordPress

  1. Purchase and download Divi from ElegantThemes.com.
  2. In your WordPress dashboard, go to Appearance → Themes → Add New → Upload Theme.
  3. Upload the Divi.zip file and click Activate.
  4. Enter your Elegant Themes API key when prompted to enable automatic updates.

Step 2: Understanding the Core Structure

Before building your first page, it's essential to understand how Divi organizes content:

  • Sections: The outermost containers. Every page starts with at least one section. They can be full-width, specialty, or regular.
  • Rows: Sit inside sections and define column layouts (1 column, 2 columns, 3 columns, etc.).
  • Modules: The actual content blocks — text, images, buttons, sliders, contact forms, and more. Modules live inside rows.

Step 3: Creating Your First Page

  1. Go to Pages → Add New in your WordPress dashboard.
  2. Give your page a title, then click the "Use Divi Builder" button.
  3. Choose "Build From Scratch" or load a pre-made layout from the Divi Library.
  4. Click the blue "+" button to add a new section.
  5. Select a column structure for your row.
  6. Click the grey "+" button inside a column to add a module.

Step 4: Editing Module Settings

Every module in Divi has three settings tabs:

  • Content: Where you add your text, images, links, and media.
  • Design: Controls typography, colors, spacing, borders, and shadows.
  • Advanced: Custom CSS classes, IDs, visibility settings, and animation options.

Click the pencil icon on any module to open its settings panel. Changes are reflected live on the canvas.

Step 5: Saving and Publishing

Once you're happy with your layout, click the purple "Save" button in the bottom toolbar. You can save as a draft or publish immediately. You can also save your layout to the Divi Library to reuse it on other pages — a huge time-saver.

Key Tips for Beginners

  • Use Ctrl+Z (or Cmd+Z on Mac) to undo any change instantly.
  • Right-click any element to access quick options like duplicate, copy, and delete.
  • The Layers panel (bottom toolbar) gives you a bird's-eye view of your page structure.
  • Enable Responsive Mode to preview and adjust your design for tablets and mobile.

Next Steps

Once you're comfortable with the basics, explore the Divi Theme Customizer (Appearance → Customize) to set site-wide fonts, colors, and header/footer styles. The Divi Builder is incredibly deep — the more you explore, the more you'll discover.