WordPress with Divi powers more than 2.5 million websites worldwide. Divi stands out as the most popular WordPress theme and visual page builder. Anyone can create stunning websites without writing code using this impressive solution.
Divi on WordPress gives you amazing flexibility through its visual drag-and-drop builder, regardless of your experience level. The platform comes as both a theme and a plugin, adapting to different project requirements. Its advanced visual builder technology takes WordPress to new heights while staying available to users of all skill levels.
Let me show you how to create your first WordPress website with Divi. You’ll learn everything from setting up hosting and installing WordPress to customizing your site design. This straightforward guide will help you launch a professional-looking website quickly and easily.
Set up WordPress and Hosting
A properly set up WordPress installation on reliable hosting lays the groundwork before you start with the Divi theme. Let’s break this significant first step into manageable pieces.
Choose a hosting provider
The right hosting provider sets the foundation for your WordPress website. Here are the factors that matter most:
- Reliability: Look for providers with strong uptime records and responsive customer support
- Scalability: Make sure they support easy upgrades as your site grows
- Security: Check for essential security features like SSL certificates and regular backups
- User-friendly interface: A clean, simple control panel simplifies management
- Affordability: Pick a plan that fits your budget without compromising features
Bluehost, SiteGround, and HostGator come highly recommended for beginners. These providers offer WordPress-optimized hosting with one-click installation that makes setup simple. WordPress.org’s endorsement of Bluehost since 2005 speaks volumes about their WordPress hosting reliability.
Register a domain name
Think of your domain name as your website’s street address in the digital world. People type this address into their browsers to find your WordPress site with Divi.
Many hosting companies let you buy domains directly through their platform. They often include a free domain for the first year with annual hosting plans. You can also register domains separately through Namecheap or GoDaddy.
The best domains are:
- Connected to your business or purpose
- Simple to spell and pronounce
- Distinctive and memorable
Install WordPress on your domain
WordPress installation comes next after securing your hosting and domain. Modern hosting providers make this step straightforward with automatic or one-click installation options.
Hosts with one-click installers (like Softaculous or QuickInstall in cPanel) guide you through a simple setup process. You’ll need to provide basic details like your site title, admin username, and password.
Manual installation requires downloading WordPress from WordPress.org, creating a database through your hosting panel, uploading files via FTP, and running the installation script at yourdomain.com/wp-admin/install.php.
The installation gives you access to your WordPress dashboard – your future Divi website’s control center.
Install and Activate Divi on WordPress
Your WordPress installation is ready, and now it’s time to add the powerful Divi theme that will revolutionize your site into a visual design powerhouse. Let’s break down the process step by step.
Download Divi from Elegant Themes
You’ll need to get the Divi theme files from Elegant Themes:
- Log into your Elegant Themes account through their website
- Go to the Members Area in your account dashboard
- Locate and click the “Download The Divi Theme” button
- Save the zip file (approximately 17 MB) to your computer
Note: Safari browsers on Mac automatically unzip files. You can change this behavior in your Safari Preferences.
Upload and activate the Divi theme
Once you have Divi downloaded, here’s how to install it on your WordPress site:
- Log into your WordPress dashboard with admin privileges
- Go to Appearance > Themes in the left sidebar
- Click the “Add New” button at the top of the page
- Select “Upload Theme”
- Either drag and drop the divi.zip file or click “Choose File” to locate it
- Click “Install Now” and wait for the upload to complete
- Once installed, click “Activate” to make Divi your active theme
The upload method works best, but you can also install Divi through FTP. Just extract the zip file and upload the files to your wp-content/themes folder.
Enter your API key for updates
Your Elegant Themes membership needs authentication to get theme updates and access premium layouts:
- Log into your Elegant Themes account
- Go to Account > API Keys
- Copy your API Key (or generate a new one if needed)
- Return to your WordPress dashboard
- Go to Divi > Theme Options > Updates
- Enter your Elegant Themes username and paste your API key
- Click “Save Changes”
A green check icon will appear to confirm authentication. This connection lets you receive all future Divi updates and gives you access to the extensive library of pre-made layouts.
Your API key works like a secure password that links your Elegant Themes account to WordPress, which gives you seamless access to all premium features.
Create Your First Page with Divi Builder
The Divi Builder lets you create stunning pages after activation. Your journey starts when you add a new page and click the purple “Use The Divi Builder” button. The Visual Builder opens up three options: Build From Scratch, Choose A Premade Layout, or Clone An Existing Page.
Use a pre-made layout or start from scratch
You’ll find over 250+ professionally designed layout packs that come with Divi. These designs help you save time and effort significantly. Click “Choose A Premade Layout” to browse categories and pick a design that fits your vision. The “Build From Scratch” option gives you full creative control.
Understand sections, rows, and modules
Divi Builder’s structure has three tiers:
- Sections: The largest containers (blue) that form horizontal stacking blocks
- Rows: Subdivisions within sections (green) that create column structures
- Modules: Individual content elements (gray) such as text, images, and buttons
Customize text, images, and buttons
You can edit any element with a double-click. Type your content directly into text modules. Upload new visuals through the module settings for images. The buttons can have custom colors, borders, and shadows. The gear icon next to any element gives you access to advanced design settings.
Preview and publish your page
Switch between desktop, tablet, and mobile views to check responsiveness. The green checkmark or keyboard shortcut (CMD+SAVE) helps you save your work often. Your page goes live when you click “Publish” from the bottom menu.
Customize Your Site Design and Settings
Your brand identity shines through your site’s overall appearance after you design your pages. Divi on WordPress offers customization options that help you build a cohesive design system throughout your website.
Add your logo and favicon
The logo upload process starts at WordPress Dashboard > Divi > Theme Options. The General tab contains an “Upload” button next to the logo option – simply select your file from the media library and save your changes. Your site icon (favicon) settings live in Divi > Theme Customizer > General Settings > Site Identity. A favicon size of 512×512 pixels works best to display properly on browsers and devices.
Set up your main menu
Your navigation structure comes together in Appearance > Menus. Give your menu a name (most people use “Primary Menu”), add your pages, and arrange everything with simple drag-and-drop actions. The menu styling options await in Divi > Theme Customizer > Header & Navigation > Primary Menu Bar where you’ll find settings for menu height, logo size, text styling, and dropdown animations.
Adjust global fonts and colors
Divi’s color system puts your website’s entire appearance at your fingertips. The “Global” tab in the color palette lets you create and manage global colors while editing any element. These dynamic values update automatically everywhere they’re used, unlike static saved colors. Your typography settings reside under General Settings > Typography where you can set consistent fonts for your whole site.
Set homepage and blog page
A dedicated homepage and blog page beats showing latest posts by default. Your visitors deserve a consistent first impression. Head to Settings > Reading, pick “A Static Page,” and select your preferred pages from the dropdowns. This approach keeps your blog section separate while maintaining a professional front page.
Conclusion of WordPress with Divi
Your first WordPress with Divi might look challenging, but the process follows a logical path that anyone can learn. Each step naturally flows into the next – from choosing the right hosting provider to customizing your site design. You can create a professional website without any coding knowledge.
Divi’s visual builder takes WordPress beyond a simple blogging platform and turns it into a complete website design system. By doing this, you’ll create not just a working website but one with custom design elements that match your brand perfectly.
Note that Divi gets easier with practice. Initial pages might take time, but you’ll soon develop efficient ways to work faster. Divi shows changes live, which speeds up your design process considerably.
Divi’s value comes from its adaptability. The same simple principles work whether you’re building a personal blog, business site, or e-commerce platform. You can create almost any layout once you understand sections, rows, and modules.
Divi has changed how we approach web design. Custom websites used to need deep technical knowledge or big budgets. Now, anyone with a vision can bring their ideas to life through WordPress and Divi.
Keep your initial projects simple and experiment regularly. Pre-made layouts can help while you learn. Soon you’ll create custom websites that showcase your style or meet business needs – without writing code.
