Creating Divi Modules for Mobile/Responsive Web Pages

by | Oct 21, 2021 | Technical Help, WordPress

If you have built a page in Divi but it doesn’t look good on mobile, you can create a set of Mobile Only Modules that you can edit so you don’t change how the desktop version already looks.

1. Click on the gear icon for the module you want to change.

2. Click on the Advanced tab.

3. Click on Visibility.

Mobile_Divi_Modules_3

4. Make this the Desktop module by:
A) Click to disable on Phone and Tablet. Make sure Desktop is unchecked.
B) Click Content tab.

Mobile_Divi_Modules_4

5. A) Click on Admin label. Change admin label to indicate that this is the desktop version of your content for easier editing later.
B) Click green check mark to save. 

(Repeat steps 1-5 for all Modules you want to change)

6. Click the Duplicate button.

7. Click on the gear icon for the duplicated module.

Mobile_Divi_Modules_7

8. Click on the Advanced tab.

9. Click on Visibility.

Mobile_Divi_Modules_3

10. Make this the Mobile module by:
A) Click to disable on Desktop. Make sure Phone and Tablet are unchecked.
B) Click Content tab.

Mobile_Divi_Modules_8

11. A) Click on Admin label. Change admin label to indicate that this is the mobile version of your content for easier editing later.
B) Click green check mark to save.

(Repeat steps 6-11 for all Modules you want to change)

Mobile_Divi_Modules_9

12. Click the Green Plus icon to add a new row.

Mobile_Divi_Modules_11

13. Choose a layout. This can be changed later.

14. Click and hold the cross icon and drag the Mobile Modules into new row.

15. Click on the gear icon for the Mobile row.

16. Click on the Advanced tab.

17. Click on Visibility.

18. Make this the Mobile row by:
A) Click to disable on Desktop. Make sure Phone and Tablet are unchecked.
B) Click Content tab.

19. A) Click on Admin label. Change admin label to indicate that this is the mobile version of your row for easier editing later.
B) Click green check mark to save.

20. Click on the gear icon for the Desktop row.

21. Click on the Advanced tab.

22. Click on Visibility.

23. Make this the Desktop row by:
A) Click to disable on Phone and Tablet. Make sure Desktop is unchecked.
B) Click Content tab.

24. A) Click on Admin label. Change admin label to indicate that this is the desktop version of your row for easier editing later.
B) Click green check mark to save.

25. Click Save Draft.

Now you have Mobile version of your modules which you can change the layout, spacing, rearrange, etc., without changing the work you already did on the Desktop version.

CLICK HERE to find your domain name!   CLICK HERE to transfer your domain name!

Resource Categories

Archives

Tags

24 hour (1) Accounting (1) Advertising (9) AdWare (1) Alex Johnson (2) Alignment (1) Android (2) Anti-Virus (1) Antivirus (1) Antrim Computer Repair and Service (3) APC Back-UPS (1) Appearance (2) Apple Mail (4) Apple Mobile Mail (2) Attachments (1) Audit (1) Authorized (1) Autoresponder (5) Availability (1) Backups (1) Badges (3) Bank Account (1) Bank Statement (1) Battery Backup (2) Bob Hill (1) Bookkeeper (1) Branding (5) Budget (2) Business (19) Business Management (1) Catalog (1) Charles Oropallo (1) CharlesWorks (37) Cherryl Jensen (1) Chrome (1) Cloud (1) Code (2) Communicating (1) Competition (1) Computer (2) Computer Cache (1) Computer Security (1) Constant Contact (1) Consultation (1) Contact Information (2) Content (1) Content Management (20) Content Management System (1) Copiers (1) Copy Machine (1) Coronavirus (2) Courteous (1) COVID-19 (2) Credibility (6) Credit Card (1) Credit Card Processing (1) CSS (8) Customer Service (2) Design (39) Design Expertise (1) Desktop (1) Dialup (1) DirectAdmin (1) Directions (1) DIVI (4) DNS (1) Do-it-Yourself (1) Documentation (1) Domains (17) Domain Transfers (5) E-Commerce (1) Email (62) Email Lists (4) Email Management (2) Email marketing (3) Etiquette (3) Eudora 6 (1) Exchange (1) Expanding (1) Facebook (1) Financial (1) Finish (1) Firefox (1) Fonts (1) Forms (2) Forms Protection (1) Fraud (2) Galaxy S4 (1) General Info (1) Gmail (1) GoDaddy (1) Google (1) Google Adwords Certified Partner (1) Google Chrome (2) Groups (1) Happy Holidays (1) Hardware Help (1) Hill Specialty Networks (1) Hosting (1) Images (1) IMAP (1) include (1) Infected (1) Information (22) insert pages (1) install (1) Internet Browsing Errors (1) Internet Consultant (1) Internet Explorer (1) Keywords (2) Laptop (1) Legibility (1) Linux (5) Logging on (1) Macintosh (1) Mail 6.0 (1) Mail 2011 (2) Make-Over (1) Malicious (1) Malware (1) Marketing (6) Matt Burke (3) MDaemon (3) MelbourneIT (2) menu (1) Merchant (1) meta (1) Microsoft (1) Microsoft Edge (1) Microsoft Hosted Exchange (5) Microsoft Live (2) Mobile Email Setup (1) Monadnock Region (1) Mozilla Firefox (2) MySQL (1) Nathan Wesley (1) Netscape (1) Netscape Messenger (1) Office Copiers (1) OfficeLive (1) Online (1) Outlook (9) Outlook 2010 (2) Outlook Express (1) PayPal (1) Pay Per Click (2) PC (1) Personal (1) Peter Harris (1) Peter Harris Creative (1) Phishing (2) PHP (2) pixel (1) plugins (1) Pop Email (1) Popularity (1) Portfolio (1) Power Grid Failure (1) PPC (1) Prevent Fraud (1) Privacy (1) Private (1) Product (6) Professional (4) Projects (2) Protect (1) Protection (1) Quality (2) QuickBooks (1) Reconciliation (1) Reduce Risk (1) Register (1) Reliability (2) Renew (1) Reseller (2) Resolution (1) Restrict User Access (1) Results (1) Review (2) Risk (1) Robin Snow (1) Roundcube (1) Safe (1) Samsung (2) Scam (10) Scammer (9) Search (1) Search and Replace (1) Search Engine Optimization (6) Search Engines (9) Security (15) Security Risk (1) Selling (1) SEO (1) Servers (2) Service (8) Shopping Cart (1) Site (1) SmarterMail (9) Social Engineering (1) Social Networking (1) Software (1) Solutions for Today (1) Spam (1) Spam Filtering (14) Spammer (1) Spyware (2) SquirrelMail (1) SSL (7) Statistics (2) Stats (2) Stone Pond Technology (1) Storage (1) Support (1) Tablet (1) Target Market (1) Technical Help (1) Testimonials (1) The CW Corner (1) Thom Little (1) Thom Little Associates (1) Thunderbird (3) Thunderbird 10 (2) TLD (1) Topic (1) Top Level Domains (3) Transaction (2) Transfer Data (1) Transfer Funds (1) Typography (1) Update (2) Uploading (1) UPS System (2) Up to Date (1) Virus (2) Viruses (1) Vista (1) Web (1) Web-Over (1) Web Development (79) Web Hoster (1) Web Hosting (2) Web Hosting Company (1) Webmail (8) Web Mail (1) Webmaster (10) Web Presence (23) Website (94) Website Development (1) Web Stats (1) Web terms (1) Web Writing (1) Windows 7 (2) Windows Mail (5) Windows XP (1) WooCommerce (2) WordPress (70) WordPress Updates (1) Working Remote (2) Writing (1) youtube (1)