<style><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->/* STYLE 1 */<!-- [et_pb_line_break_holder] -->.contentIntenseStyleOne .content_n10s .ci-style-1 h2:after {<!-- [et_pb_line_break_holder] --> transition: all .3s ease-in-out;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.contentIntenseStyleOne .content_n10s:hover .ci-style-1 h2:after {<!-- [et_pb_line_break_holder] --> width: 100%;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.contentIntenseStyleOne .content_n10s {<!-- [et_pb_line_break_holder] --> box-shadow: 0 0 50px rgba(0,0,0,.1);<!-- [et_pb_line_break_holder] --> transition: all .3s ease-in-out;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.contentIntenseStyleOne .content_n10s:hover {<!-- [et_pb_line_break_holder] --> box-shadow: 0 25px 50px rgba(0,0,0,.2);<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.et_pb_content_n10s_4 .more-link.et_pb_button.ci_more_button, .et_pb_content_n10s_4 .more-link.et_pb_button.ci_more_button:hover {<!-- [et_pb_line_break_holder] --> padding: 10px 30px !important;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->/* STYLE 2 */<!-- [et_pb_line_break_holder] -->.contentIntenseStyleTwo .content_n10s {<!-- [et_pb_line_break_holder] --> border-radius: 8px;<!-- [et_pb_line_break_holder] --> overflow: hidden;<!-- [et_pb_line_break_holder] --> box-shadow: 0 0 50px rgba(0,0,0,.1);<!-- [et_pb_line_break_holder] --> transition: all .3s ease-in-out;<!-- [et_pb_line_break_holder] --> position: relative;<!-- [et_pb_line_break_holder] --> top: 0;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.contentIntenseStyleTwo .content_n10s:hover {<!-- [et_pb_line_break_holder] --> box-shadow: 0 25px 50px rgba(0,0,0,.2);<!-- [et_pb_line_break_holder] --> top: -5px;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->/* STYLE 3 */<!-- [et_pb_line_break_holder] -->.contentIntenseStyleThree .et_pb_post .ci-textcontent-wrap {<!-- [et_pb_line_break_holder] --> transition: all .3s ease-in-out;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.contentIntenseStyleThree .et_pb_post .ci-textcontent-wrap:hover {<!-- [et_pb_line_break_holder] --> background-color: rgba(34, 34, 35, 0.9) !important;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.contentIntenseStyleThree .ci-all-content-wrap.ci-style-3 {<!-- [et_pb_line_break_holder] --> padding: 0;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.contentIntenseStyleThree .ci-all-content-wrap.ci-style-3 p {<!-- [et_pb_line_break_holder] --> text-align: center;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->.contentIntenseStyleThreeStyleTwo .ci-all-content-wrap.ci-style-3 {<!-- [et_pb_line_break_holder] --> padding: 0;<!-- [et_pb_line_break_holder] --> box-shadow: 0 0 20px rgba(0,0,0,.1);<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.contentIntenseStyleThreeStyleTwo .et_pb_post .ci-textcontent-wrap {<!-- [et_pb_line_break_holder] --> top: 15px;<!-- [et_pb_line_break_holder] --> left: 15px;<!-- [et_pb_line_break_holder] --> position: relative;<!-- [et_pb_line_break_holder] --> transition: all .3s ease-in-out;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->@media screen and (min-width : 600px) {<!-- [et_pb_line_break_holder] --> .contentIntenseStyleThreeStyleTwo .et_pb_post .ci-textcontent-wrap:hover {<!-- [et_pb_line_break_holder] --> top: 30px;<!-- [et_pb_line_break_holder] --> left: 30px;<!-- [et_pb_line_break_holder] --> }<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->/* STYLE 4 */<!-- [et_pb_line_break_holder] -->.contentIntenseStyleFour {<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --></style>

Content Intense Demonstration

You can think of Content Intense as an enhanced Blog module. It displays your posts and pages excerpts in a variety of available new ways. Plus, you get lots of customization options!

Content Intense is designed to work in a single row/one column format. Using “Specialty Sections” in Divi is not recommended with this module.

With that in mind, let’s say that Content Intense is both simple to use for beginners, yet very powerful for designers who learn how to use the full potential of all the settings. Like a game of chess, if you will.

To get you started, the demos in the first section on this page are styled using Content Intense’s native module settings. Most of them are the default settings, but some of the demos in the first section take advantage of basic adjustments.

In the second section, you’ll see a few examples of what you can do with just a bit of custom CSS beyond what Content Intense already provides! The second section also has a link to a free download of the custom layouts. For more info, please visit the Content Intense documentation page.

 

Explore Content Intense Possibilities

Native examples using module settings: Atlas | Alps | Himalayas | Rockies | Andes | Everest

Design concepts using custom CSS: Atlas | Alps Light | Alps Dark | Himalayas Dark | Himalayas Light

You’ll also want to visit the Content Intense plugin highlight from the Elegant Themes blog.

Atlas

The Atlas style for Content Intense features a vertical, 3-column layout. Atlas starts with the featured image (thumbnail) at top, the author’s avatar, meta data, content and then the “Read More” button.

Meta data content and styling are fully adjustable.

This example has “Show Comments” turned off, along with a custom meta data separator. The “Read More” button has custom text (“View More”), and is positioned in the center. The date is shown as “time ago” instead of an actual date.

[et_pb_content_n10s admin_label=”Content Intense 1 – Atlas” _builder_version=”3.0.89″ post_type=”post” show_thumbnail=”on” show_author=”off” show_date=”on” show_time_ago=”on” show_categories=”on” show_comments=”off” read_more=”on” read_more_style=”on” read_more_position=”center” show_pagination=”on” pagination_style=”on” pagination_prev=”Next” pagination_next=”Previous” feed_style=”ci-style-1″ use_dropshadow=”off” use_overlay=”on” background_layout=”light” header_font_size_tablet=”51″ header_line_height_tablet=”2″ body_font_size_tablet=”51″ body_line_height_tablet=”2″ meta_font_size_tablet=”51″ meta_line_height_tablet=”2″ border_style=”solid” custom_button=”on” button_letter_spacing=”3″ button_icon_placement=”right” button_letter_spacing_hover=”3″ overlay_icon_color=”#ffffff” hover_overlay_color=”rgba(0,0,0,0.6)” hover_icon=”%%43%%” header_font=”Raleway|on||on|” header_font_size=”18″ header_letter_spacing=”3px” header_line_height=”1.1″ body_font=”Merriweather||||” body_font_size=”13″ body_line_height=”1.8″ meta_font=”Merriweather||on||” meta_font_size=”12″ meta_text_color=”#9b9b9b” button_text_size=”12″ button_text_color=”#ffffff” button_bg_color=”#000000″ button_border_color=”#000000″ button_font=”Raleway|on||on|” button_text_color_hover=”#000000″ button_bg_color_hover=”#ffffff” button_border_color_hover=”#000000″ button_use_icon=”off” meta_separator=”-” show_avatar=”on” thumbnail_effect=”on” show_ellipsis=”on” read_more_text=”View More” feed_order_type=”default” feed_order=”default” /]

Alps

The Alps style for Content Intense features a horizontal, 1-column layout. Alps starts with the featured image (thumbnail) at left, then meta data, content and Read More button. This layout alternates with each row on desktop. The featured image is always on top when viewing on mobile devices.

Meta data content and styling are fully adjustable. The “Read More” button is positioned to the right in this case. The “Advanced” tab in the module will allow you to further style that text.

[et_pb_content_n10s admin_label=”Content Intense 2 – Alps” _builder_version=”3.0.89″ post_type=”post” show_thumbnail=”on” show_author=”on” show_date=”on” show_time_ago=”off” show_categories=”on” show_comments=”on” read_more=”on” read_more_style=”on” read_more_position=”flex-end” show_pagination=”on” pagination_style=”on” pagination_prev=”Next” pagination_next=”Previous” feed_style=”ci-style-2″ use_dropshadow=”off” use_overlay=”on” background_layout=”light” header_font_size_tablet=”51″ header_line_height_tablet=”2″ body_font_size_tablet=”51″ body_line_height_tablet=”2″ meta_font_size_tablet=”51″ meta_line_height_tablet=”2″ border_style=”solid” custom_button=”on” button_icon_placement=”right” overlay_icon_color=”#ffffff” hover_overlay_color=”rgba(52,82,255,0.85)” hover_icon=”%%43%%” header_font=”Roboto Light||||” header_font_size=”40″ header_line_height=”1.1″ body_font=”Roboto||||” body_font_size=”16″ body_text_color=”#414141″ body_line_height=”1.7″ meta_font=”Roboto||on||” meta_font_size=”15″ meta_text_color=”#989898″ meta_line_height=”1.4″ button_text_color=”#ffffff” button_bg_color=”#3452ff” button_border_color=”#3452ff” button_border_radius=”100″ button_font=”Roboto||||” button_text_color_hover=”#3452ff” button_bg_color_hover=”#ffffff” button_border_color_hover=”#3452ff” button_border_radius_hover=”100″ button_use_icon=”off” custom_css_grid_item=”background: #fff;” show_avatar=”on” thumbnail_effect=”on” show_ellipsis=”on” /]

Himalayas

The Himalayas style for Content Intense features a 3-column layout. Himalayas starts with the featured image as the background, then the title, meta data, content and Read More button as a padded overlay on top of that.

Meta data content and styling are fully adjustable. This example has “Show Comments” turned off. The date is shown as “time ago” instead of an actual date. In this example, the “Read More” button is positioned in the center.

[et_pb_content_n10s admin_label=”Content Intense 3 – Himalayas” _builder_version=”3.0.76″ post_type=”post” offset_number=”0″ show_thumbnail=”on” show_author=”off” show_date=”on” show_time_ago=”on” show_categories=”off” show_comments=”off” read_more=”on” read_more_style=”on” read_more_text=”Read More” read_more_position=”center” show_pagination=”on” pagination_style=”on” pagination_prev=”Next” pagination_next=”Previous” feed_style=”ci-style-3″ use_dropshadow=”off” use_overlay=”off” background_layout=”dark” header_font_size_tablet=”51″ header_line_height_tablet=”2″ body_font_size_tablet=”51″ body_line_height_tablet=”2″ meta_font_size_tablet=”51″ meta_line_height_tablet=”2″ border_style=”solid” custom_button=”on” button_letter_spacing=”2″ button_icon_placement=”right” button_letter_spacing_hover=”2″ header_font=”Playfair Display|||on|” header_font_size=”20″ header_text_color=”#000000″ header_letter_spacing=”1px” header_line_height=”1.1″ body_font=”Playfair Display||||” body_font_size=”15″ body_text_color=”#696969″ body_line_height=”1.8″ meta_font=”Playfair Display||on||” meta_font_size=”14″ meta_text_color=”#696969″ meta_line_height=”1.1″ button_text_size=”16″ button_text_color=”#ffffff” button_bg_color=”#000000″ button_border_color=”#000000″ button_border_radius=”0″ button_font=”Playfair Display|on||on|” button_use_icon=”off” button_text_color_hover=”#000000″ button_bg_color_hover=”#ffffff” button_border_color_hover=”#000000″ button_border_radius_hover=”0″ grid_tile_bg_color=”#ffffff” /]

Rockies

The Rockies style for Content Intense features a vertical, 3-column layout. Similar to Atlas, but with a more modern design.

Rockies starts with the featured image (thumbnail) as the background. The date is in the top left corner. The rest of the meta data, title, content and Read More button live within a container that moves up as you hover. Here, we use the word “in” as the meta data separator instead of the default “/” separator. With this layout, it works really well. The comments count is in a speech bubble, which actually links to the comments section of your post.

As always, meta data content and styling are fully adjustable here.

[et_pb_content_n10s admin_label=”Content Intense 4 – Rockies” _builder_version=”3.0.76″ post_type=”post” offset_number=”0″ show_thumbnail=”on” show_author=”off” show_date=”on” show_time_ago=”off” show_categories=”on” show_comments=”on” read_more=”on” read_more_style=”on” read_more_text=”Read More” read_more_position=”flex-start” show_pagination=”on” pagination_style=”on” pagination_prev=”Next” pagination_next=”Previous” feed_style=”ci-style-4″ use_dropshadow=”off” use_overlay=”off” background_layout=”light” header_font_size_tablet=”51″ header_line_height_tablet=”2″ body_font_size_tablet=”51″ body_line_height_tablet=”2″ border_style=”solid” custom_button=”on” button_letter_spacing=”0″ button_icon_placement=”right” button_letter_spacing_hover=”0″ grid_tile_bg_color=”rgba(255,255,255,0.95)” overlay_icon_color=”#ffffff” hover_overlay_color=”#000000″ header_font=”Oswald|||on|” header_font_size=”24″ header_text_color=”#000000″ header_line_height=”1.1″ body_font=”Lato||||” body_font_size=”16″ body_text_color=”#000000″ body_line_height=”1.8″ meta_text_color=”#bf9e77″ button_text_color=”#ffffff” button_bg_color=”#bf9e77″ button_border_width=”6″ button_border_color=”rgba(0,0,0,0)” button_border_radius=”0″ button_font=”Oswald|||on|” button_use_icon=”off” button_text_color_hover=”#ffffff” button_bg_color_hover=”#000000″ button_border_color_hover=”rgba(0,0,0,0)” button_border_radius_hover=”0″ meta_date=”d F” meta_font_size_tablet=”51″ meta_line_height_tablet=”2″ meta_font=”||on||” excerpt_count=”180″ meta_separator=”in” thumbnail_effect=”on” show_avatar=”on” show_ellipsis=”on” /]

Andes

The Andes style for Content Intense features a vertical, 1-column centered layout with a max width of 800px. Andes starts with the featured image (thumbnail) at top with the author’s avatar and name. It has a bottom-cropped featured image to give the experpt a panoramic feel. Categories and post date are highlighted with borders under the content using the color you set for the meta text in the module. The design finishes with the post date on the bottom-left and comment count on the bottom-right.

[et_pb_content_n10s admin_label=”Content Intense 5 – Andes” _builder_version=”3.0.76″ post_type=”post” offset_number=”0″ show_thumbnail=”on” show_author=”on” show_date=”on” show_time_ago=”off” show_categories=”on” show_comments=”on” read_more=”on” read_more_style=”on” read_more_text=”Read More” read_more_position=”flex-start” show_pagination=”on” pagination_style=”on” pagination_prev=”Next” pagination_next=”Previous” feed_style=”ci-style-5″ use_dropshadow=”off” use_overlay=”on” background_layout=”light” border_style=”solid” custom_button=”on” button_icon_placement=”right” grid_tile_bg_color=”rgba(255,255,255,0.95)” overlay_icon_color=”#ffffff” hover_overlay_color=”rgba(52,82,255,0.85)” button_border_radius=”5″ button_font=”Raleway|on|||” button_border_radius_hover=”5″ meta_date=”d F” meta_font_size_tablet=”51″ meta_line_height_tablet=”2″ excerpt_count=”180″ show_avatar=”on” header_font=”Raleway Light||||” header_font_size_tablet=”51″ header_line_height_tablet=”2″ body_font_size_tablet=”51″ body_line_height_tablet=”2″ header_font_size=”30″ button_text_size=”14″ hover_icon=”%%43%%” header_text_color=”#3452ff” meta_text_color=”#b5b5b5″ button_text_color=”#ffffff” button_bg_color=”#3452ff” button_border_width=”2″ button_border_color=”#3452ff” button_icon_color=”#96c346″ button_text_color_hover=”#3452ff” button_bg_color_hover=”rgba(150,195,70,0)” button_border_color_hover=”#3452ff” button_use_icon=”off” button_letter_spacing=”3″ button_letter_spacing_hover=”3″ /]

Everest

The Everest style for Content Intense features a vertical, 3-column card layout similar to Atlas and Rockies.

Everest uses the featured image as a background that slowly slides left on hover. The meta date and comment bubble have transparent backgrounds, with a comment count above the speech bubble on hover. The excerpt area features the author avatar and an ellipsis indicator at bottom to signal interaction, and has a  slightly reduced opacity that expands upwards on hover.

[et_pb_content_n10s admin_label=”Content Intense 6 – Everest” _builder_version=”3.0.89″ post_type=”post” show_thumbnail=”on” show_author=”on” show_date=”on” show_time_ago=”off” show_categories=”on” show_comments=”on” read_more=”on” read_more_style=”on” read_more_text=”Read More” read_more_position=”flex-start” show_pagination=”on” pagination_style=”on” pagination_prev=”Next” pagination_next=”Previous” feed_style=”ci-style-6″ use_dropshadow=”off” use_overlay=”on” background_layout=”light” border_style=”solid” custom_button=”on” button_icon_placement=”right” grid_tile_bg_color=”rgba(255,255,255,0.95)” overlay_icon_color=”#ffffff” hover_overlay_color=”rgba(52,82,255,0.85)” button_border_radius=”5″ button_font=”Raleway|on|||” button_border_radius_hover=”5″ meta_date=”d F” meta_font_size_tablet=”51″ meta_line_height_tablet=”2″ excerpt_count=”180″ show_avatar=”on” header_font=”Raleway Light||||” header_font_size_tablet=”51″ header_line_height_tablet=”2″ body_font_size_tablet=”51″ body_line_height_tablet=”2″ header_font_size=”30″ button_text_size=”14″ hover_icon=”%%43%%” header_text_color=”#3452ff” meta_text_color=”#b5b5b5″ button_text_color=”#ffffff” button_bg_color=”#3452ff” button_border_width=”2″ button_border_color=”#3452ff” button_icon_color=”#96c346″ button_text_color_hover=”#3452ff” button_bg_color_hover=”rgba(150,195,70,0)” button_border_color_hover=”#3452ff” button_use_icon=”off” button_letter_spacing=”3″ button_letter_spacing_hover=”3″ thumbnail_effect=”on” show_ellipsis=”on” /]
We’re sure that Content Intense will provide fresh-looking, modern layouts for you.

Using Module Styling

Adding Custom CSS

The stylists at Superfly have been hard at work coming up with custom styling for Content Intense that top-notch website designers can truly appreciate.

The Content Intense demos in this section have additional custom CSS applied to them to enhance effects that are outside the native settings.

 

This time, Atlas comes with the border under its title that expands on hover.
[et_pb_content_n10s admin_label=”Content Intense 1 extended – Atlas” _builder_version=”3.0.89″ post_type=”post” show_thumbnail=”on” show_author=”on” show_date=”on” show_time_ago=”on” show_categories=”on” show_comments=”off” read_more=”on” read_more_style=”on” read_more_text=”Read More” read_more_position=”flex-start” show_pagination=”on” pagination_style=”on” pagination_prev=”Next” pagination_next=”Previous” feed_style=”ci-style-1″ use_dropshadow=”off” use_overlay=”on” background_layout=”light” header_font_size_tablet=”51″ header_line_height_tablet=”2″ body_font_size_tablet=”51″ body_line_height_tablet=”2″ meta_font_size_tablet=”51″ meta_line_height_tablet=”2″ border_style=”solid” custom_button=”on” button_letter_spacing=”3″ button_icon_placement=”right” button_letter_spacing_hover=”3″ module_class=”contentIntenseStyleOne” overlay_icon_color=”#ffffff” hover_overlay_color=”rgba(0,0,0,0.6)” hover_icon=”%%43%%” header_font=”Raleway|on||on|” header_font_size=”18″ header_letter_spacing=”3px” header_line_height=”1.1″ body_font=”Merriweather||||” body_font_size=”13″ body_line_height=”1.8″ meta_font=”Merriweather||on||” meta_font_size=”12″ meta_text_color=”#9b9b9b” button_text_size=”12″ button_text_color=”#ffffff” button_bg_color=”#000000″ button_border_color=”#000000″ button_font=”Raleway|on||on|” button_text_color_hover=”#000000″ button_bg_color_hover=”#ffffff” button_border_color_hover=”#000000″ button_use_icon=”off” feed_order_type=”rand” feed_order=”ASC” thumbnail_effect=”on” show_avatar=”on” show_ellipsis=”on” /]
In this case, we have Alps rising up and throwing a bit more of a shadow on hover. Subtle, but potent. The kind of micro-interaction effects that modern sites are looking for.
[et_pb_content_n10s admin_label=”Content Intense 2 extended – Alps” _builder_version=”3.0.76″ post_type=”post” offset_number=”0″ show_thumbnail=”on” show_author=”on” show_date=”on” show_time_ago=”on” show_categories=”on” show_comments=”on” read_more=”on” read_more_style=”on” read_more_text=”Read More” read_more_position=”flex-start” show_pagination=”on” pagination_style=”on” pagination_prev=”Next” pagination_next=”Previous” feed_style=”ci-style-2″ use_dropshadow=”off” use_overlay=”off” background_layout=”light” header_font_size_tablet=”51″ header_line_height_tablet=”2″ body_font_size_tablet=”51″ body_line_height_tablet=”2″ meta_font_size_tablet=”51″ meta_line_height_tablet=”2″ border_style=”solid” custom_button=”on” button_icon_placement=”right” module_class=”contentIntenseStyleTwo” overlay_icon_color=”#ffffff” hover_overlay_color=”rgba(52,82,255,0.85)” hover_icon=”%%43%%” header_font=”Roboto Light||||” header_font_size=”40″ header_line_height=”1.1″ body_font=”Roboto||||” body_font_size=”16″ body_text_color=”#414141″ body_line_height=”1.7″ meta_font=”Roboto||on||” meta_font_size=”15″ meta_text_color=”#989898″ meta_line_height=”1.4″ button_text_color=”#ffffff” button_bg_color=”#3452ff” button_border_color=”#3452ff” button_border_radius=”100″ button_font=”Roboto||||” button_text_color_hover=”#3452ff” button_bg_color_hover=”#ffffff” button_border_color_hover=”#3452ff” button_border_radius_hover=”100″ custom_css_grid_item=”background: #fff;” button_use_icon=”off” /]

Alps – Dark

The second iteration of custom Alps give us a deep blue (yet pleasant) background.

[et_pb_content_n10s admin_label=”Content Intense 2 extended – Alps dark” _builder_version=”3.0.64″ post_type=”post” offset_number=”0″ show_thumbnail=”on” show_author=”on” show_date=”on” show_time_ago=”on” show_categories=”on” show_comments=”on” read_more=”on” read_more_style=”on” read_more_text=”Read More” read_more_position=”flex-start” show_pagination=”on” pagination_style=”on” pagination_prev=”Next” pagination_next=”Previous” feed_style=”ci-style-2″ use_dropshadow=”off” use_overlay=”on” background_layout=”dark” header_font_size_tablet=”51″ header_line_height_tablet=”2″ body_font_size_tablet=”51″ body_line_height_tablet=”2″ meta_font_size_tablet=”51″ meta_line_height_tablet=”2″ border_style=”solid” custom_button=”on” button_icon_placement=”right” overlay_icon_color=”#ffffff” hover_overlay_color=”rgba(52,82,255,0.85)” hover_icon=”%%43%%” header_font=”Roboto Light||||” header_font_size=”40″ header_line_height=”1.1″ body_font=”Roboto||||” body_font_size=”16″ body_line_height=”1.7″ meta_font=”Roboto||on||” meta_font_size=”15″ meta_line_height=”1.4″ button_text_color=”#3452ff” button_bg_color=”#ffffff” button_border_color=”#ffffff” button_border_radius=”100″ button_font=”Roboto||||” button_text_color_hover=”#3452ff” button_bg_color_hover=”#ffffff” button_border_color_hover=”#3452ff” button_border_radius_hover=”100″ button_use_icon=”off” grid_tile_bg_color=”#3452ff” custom_css_grid_item=”box-shadow: 0 0 100px rgba(0,0,0,.2);” /]
This concept of Himalayas gives us a darkening of the background on hover, while still allowing the text to keep the brightness it deserves.
[et_pb_content_n10s admin_label=”Content Intense 3 extended – Himalayas” _builder_version=”3.0.76″ post_type=”post” offset_number=”0″ show_thumbnail=”on” show_author=”off” show_date=”on” show_time_ago=”off” show_categories=”off” show_comments=”off” read_more=”on” read_more_style=”on” read_more_text=”Read More” read_more_position=”center” show_pagination=”on” pagination_style=”on” pagination_prev=”Next” pagination_next=”Previous” feed_style=”ci-style-3″ use_dropshadow=”off” use_overlay=”off” background_layout=”dark” header_font_size_tablet=”51″ header_line_height_tablet=”2″ body_font_size_tablet=”51″ body_line_height_tablet=”2″ meta_font_size_tablet=”51″ meta_line_height_tablet=”2″ border_style=”solid” custom_button=”on” button_letter_spacing=”2″ button_icon_placement=”right” button_letter_spacing_hover=”2″ module_class=”contentIntenseStyleThree” header_font=”Playfair Display|||on|” header_font_size=”20″ header_text_color=”#ffffff” header_letter_spacing=”1px” header_line_height=”1.1″ body_font=”Playfair Display||||” body_font_size=”15″ body_text_color=”#ffffff” body_line_height=”1.8″ meta_font=”Playfair Display||on||” meta_font_size=”14″ meta_text_color=”#ffffff” meta_line_height=”1.1″ button_text_size=”16″ button_text_color=”#ffffff” button_bg_color=”#000000″ button_border_color=”#000000″ button_border_radius=”0″ button_font=”Playfair Display|on||on|” button_use_icon=”off” button_text_color_hover=”#ffffff” button_bg_color_hover=”rgba(0,0,0,0)” button_border_color_hover=”#ffffff” button_border_radius_hover=”0″ grid_tile_bg_color=”rgba(64,69,76,0.4)” /]
Here’s another Himalayas idea. We’ve added a really cool offset effect that takes the text content a bit to the right and down some. This in itself is great on mobile devices, but on hover you get even more of the offset effect.
[et_pb_content_n10s admin_label=”Content Intense 3 extended – Himalayas concept 2″ _builder_version=”3.0.64″ post_type=”post” offset_number=”0″ show_thumbnail=”on” show_author=”off” show_date=”on” show_time_ago=”off” show_categories=”off” show_comments=”off” read_more=”on” read_more_style=”on” read_more_text=”Read More” read_more_position=”center” show_pagination=”on” pagination_style=”on” pagination_prev=”Next” pagination_next=”Previous” feed_style=”ci-style-3″ use_dropshadow=”off” use_overlay=”off” background_layout=”dark” header_font_size_tablet=”51″ header_line_height_tablet=”2″ body_font_size_tablet=”51″ body_line_height_tablet=”2″ meta_font_size_tablet=”51″ meta_line_height_tablet=”2″ border_style=”solid” custom_button=”on” button_letter_spacing=”2″ button_icon_placement=”right” button_letter_spacing_hover=”2″ module_class=”contentIntenseStyleThreeStyleTwo” header_font=”Playfair Display|||on|” header_font_size=”20″ header_text_color=”#000000″ header_letter_spacing=”1px” header_line_height=”1.1″ body_font=”Playfair Display||||” body_font_size=”15″ body_text_color=”#696969″ body_line_height=”1.8″ meta_font=”Playfair Display||on||” meta_font_size=”14″ meta_text_color=”#696969″ meta_line_height=”1.1″ button_text_size=”16″ button_text_color=”#ffffff” button_bg_color=”#000000″ button_border_color=”#000000″ button_border_radius=”0″ button_font=”Playfair Display|on||on|” button_use_icon=”off” button_text_color_hover=”#000000″ button_bg_color_hover=”#ffffff” button_border_color_hover=”#000000″ button_border_radius_hover=”0″ grid_tile_bg_color=”#ffffff” /]

Even More Styles and Layouts Coming Soon!

Like what you see so far? We’re only getting started! Content Intense is sure to be an awesome tool in your Divi arsenal!

If you’re interested in the custom effects in this second section, you can download our custom JSON layout file and import it into your pages or posts.

First, download the ContentIntense.json file by right-clicking on the “Download Styles” button below, then choose “Save Link As…”. Note that this is a layout file to be imported into a page or post, not a library item.

To load the layout: Create a new page or post, then enable the Divi Builder. Then click on the Import & Export button in the Divi Builder header (the up/down arrows icon), click on the “Import” tab, locate your ContentIntense.json file and click “Import Divi Builder Layout”.

You can then choose to “Save to Library” to create a library item so that you can make changes and/or have this layout available across your site without needing to import the JSON file.

Our website is no longer supported by Internet Explorer due to Microsoft changes with the browser. If you continue to use Internet Explorer to access our website some of the features will not function properly. Click here to download a browser that is compatible with our website.
Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×