Divi 5 makes it simple to show data in some way this is blank, scannable, and simple to check. On this unfastened pack, you are going to to find 7 Styled Massive Checklist Sections, designed for products and services, characteristic breakdowns, step by step processes, schedules, specifications, and different data-heavy content material. Drop one onto any web page, switch the textual content, and you’re ready to move. No additional setup required.
Preview
Right here’s a handy guide a rough have a look at all 7 Styled Massive Checklist Sections integrated within the pack. The obtain is additional down the publish.
Obtain 7 Styled Massive Checklist Sections For Divi 5
Get all 7 sections without cost. Import them into your Divi Library and upload them to any web page within the Visible Builder.
@media handiest display screen and ( max-width: 767px ) {.et_bloom .et_bloom_optin_1 .carrot_edge.et_bloom_form_right .et_bloom_form_content:earlier than { border-top-color: #ffffff !necessary; border-left-color: clear !necessary; }.et_bloom .et_bloom_optin_1 .carrot_edge.et_bloom_form_left .et_bloom_form_content:after { border-bottom-color: #ffffff !necessary; border-left-color: clear !necessary; }
}.et_bloom .et_bloom_optin_1 .et_bloom_form_content button { background-color: #f92c8b !necessary; } .et_bloom .et_bloom_optin_1 .et_bloom_form_content .et_bloom_fields i { shade: #f92c8b !necessary; } .et_bloom .et_bloom_optin_1 .et_bloom_form_content .et_bloom_custom_field_radio i:earlier than { background: #f92c8b !necessary; } .et_bloom .et_bloom_optin_1 .et_bloom_border_solid { border-color: #f7f9fb !necessary } .et_bloom .et_bloom_optin_1 .et_bloom_form_content button { background-color: #f92c8b !necessary; } .et_bloom .et_bloom_optin_1 .et_bloom_form_container h2, .et_bloom .et_bloom_optin_1 .et_bloom_form_container h2 span, .et_bloom .et_bloom_optin_1 .et_bloom_form_container h2 sturdy { font-family: “Open Sans”, Helvetica, Arial, Lucida, sans-serif; }.et_bloom .et_bloom_optin_1 .et_bloom_form_container p, .et_bloom .et_bloom_optin_1 .et_bloom_form_container p span, .et_bloom .et_bloom_optin_1 .et_bloom_form_container p sturdy, .et_bloom .et_bloom_optin_1 .et_bloom_form_container shape enter, .et_bloom .et_bloom_optin_1 .et_bloom_form_container shape button span { font-family: “Open Sans”, Helvetica, Arial, Lucida, sans-serif; } p.et_bloom_popup_input { padding-bottom: 0 !necessary;}
Obtain For Unfastened
Sign up for the Divi Publication and we can e-mail you a replica of without equal Divi Touchdown Web page Structure Pack, plus lots of different wonderful and unfastened Divi sources, pointers and tips. Apply alongside and you are going to be a Divi grasp very quickly. If you’re already subscribed merely sort on your e-mail deal with beneath and click on obtain to get entry to the format pack.
You’ve got effectively subscribed. Please test your e-mail deal with to substantiate your subscription and get get entry to to unfastened weekly Divi format packs!
What’s Incorporated (8 Exports)
After you obtain and unzip the record, you’ll to find 7 Styled Massive Checklist Phase exports, plus 1 record containing all designs.
Styled – Massive Checklist Phase 1 to 7 (7) → Seven huge record segment layouts for products and services, options, steps, and comparisons, that includes fashionable typography, transparent row construction, and polished “be told extra” styling.
Styled – Massive Checklist Sections (All) → Imports all designs in your Divi Library immediately.
How To Use The Styled Massive Checklist Sections
Stay your obtain folder to hand. We’ll import, then upload a bit to a web page.
1. Import Sections Into The Divi Library
Cross to Divi → Divi Library. Click on Import & Export on the height of your display screen.
Within the Import & Export Layouts modal, transfer to the Import tab, then click on Select Record and make a choice your JSON.
Select any Styled Massive Checklist Phase JSON you wish to have to make use of, then click on Import Divi Builder Layouts.
2. Upload A Styled Massive Checklist Phase To Any Web page
Open a web page within the Visible Builder and upload a brand new Phase.
Within the Insert Phase modal, click on Upload From Library and make a choice a Styled Massive Checklist Phase format.
In spite of everything, click on Use This Phase.
3. Switch The Content material
As soon as the segment is at the web page, changing the placeholder content material takes only a few clicks. Get started through updating the identify and supporting textual content so guests perceive what the record covers.
Subsequent, click on every record merchandise and exchange the placeholder labels, descriptions, or metadata (corresponding to dates or occasions). Replace the thing titles first, then the supporting textual content to stay the hierarchy constant.
If you wish to upload or take away record pieces, reproduction an merchandise module (or the row workforce used for every merchandise), then replace the textual content. Stay spacing and alignment constant so scanning remains easy.
4. Regulate Kinds (Not obligatory)
You’ll be able to simply fit those huge lists in your emblem through updating typography, colours, borders, spacing, and background remedies.
To switch typography, open any Textual content or Heading Module and pass to the Design tab. Increase the Textual content dropdown menu to regulate Font, Font Weight, Textual content Alignment, and Textual content Colour. In case your format features a segment identify, replace the Heading Module to stay hierarchy transparent.
To refine the record merchandise glance, modify dividers, borders, and merchandise spacing. Open the module controlling the thing container (or the dad or mum row) and use the Design tab to tweak Border Width, Border Colour, Border Radius, and Padding.
For zebra striping or highlighted pieces, replace the background colours of alternating rows. This improves clarity and makes lengthy lists more straightforward to scan.
In case your record contains buttons or “be told extra” hyperlinks, taste them within the Design tab so number one movements stand out whilst secondary movements keep visual however quieter.
Use Divi’s format settings to regulate Flex homes, corresponding to alignment and spacing, specifically when refining how numbers, titles, and right-aligned movements behave on smaller monitors.
Guidelines For Efficient Massive Lists
Massive lists paintings absolute best when they’re simple to scan and simple to grasp. Use those fast wins to stay your sections transparent and helpful.
Get started With Transparent Labels
Every merchandise identify must briefly be in contact what it’s. Stay labels quick and constant so guests can scan the record with out effort.
Use Visible Hierarchy
Emphasize what issues maximum—numbers, merchandise titles, or a featured line—the use of font weight, spacing, and refined distinction. This guides consideration with out making the segment really feel busy.
Stay Alignment Constant
Align an identical content material the similar means. For instance, left-align titles and outlines, and right-align movements like “Be told Extra.” Constant alignment improves scanning.
Plan For Cell
On smaller monitors, lengthy strains and multi-column layouts can really feel cramped. Believe stacking secondary main points beneath every identify, shortening labels, or decreasing the selection of right-side movements so the whole lot remains readable.
Prioritize Clarity
Use beneficiant padding, transparent dividers, and a line peak that’s top sufficient so record pieces don’t blur in combination. If guests must paintings to learn it, they are going to skip it.
Get started Development In Divi 5 As of late!
Those 7 Styled Massive Checklist Sections come up with a quick means so as to add polished, scannable content material blocks to carrier pages, characteristic breakdowns, pricing pages, schedules, and extra. Switch the content material, modify the styling, and also you’ll have a blank segment format that matches your web page in mins with Divi 5‘s Visible Builder.
The publish 7 Large List Sections For Divi 5 (Free Download!) gave the impression first on Elegant Themes Blog.
0 Comments