Introduction
Use the icon list shortcode to add extra style to your lists. Control the color and size of the icon for each item.
Basic Example
The icon list shortcode allows you to control the color and icon per item in the list. You can set the size of the icon to make bigger icon lists.
- Nam in est in tortor pretium posuere. Aliquam in augue
- Mauris sed dolor viverra, accumsan nisl ac, interdum metus. Praesent.
- Phasellus commodo dolor a mi condimentum tristique. Ut eu velit.
- Nulla egestas ipsum nec turpis auctor, id suscipit nulla tempor.
- Maecenas quis lorem hendrerit, vulputate nulla et, mollis risus. Suspendisse.
Within Paragraphs
This example shows the icon list shortcode within paragraphs. This gives you an idea of how it will look if added to your pages and posts.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam tristique leo at arcu tempus, in dapibus dui tempor. Aliquam pharetra ligula vel lacus euismod lacinia. Cras fringilla enim sed ante laoreet, eu dapibus mauris iaculis. Duis et dui ac orci dapibus imperdiet. Nam ac dolor et lorem euismod aliquet. Pellentesque elementum erat sed justo rhoncus eleifend. Pellentesque id dolor interdum, fermentum ligula id, pretium urna. Cras scelerisque odio non vehicula porta.
- Ut nec massa a nulla tempor volutpat sed et purus..
- Mauris sed dolor viverra, accumsan nisl ac, interdum metus. Praesent.
- Phasellus commodo dolor a mi condimentum tristique. Ut eu velit.
- Nulla egestas ipsum nec turpis auctor, id suscipit nulla tempor.
- Maecenas quis lorem hendrerit, vulputate nulla et, mollis risus. Suspendisse.
Sed interdum magna a nibh lacinia, in rhoncus ipsum porttitor. Duis ornare sem nec mi euismod posuere. Duis accumsan risus quis metus dapibus bibendum.
Sizes
The icon list shortcode has five different predefined sizes.
- Size 1
- Size 2
- Size 3
- Size 4
- Size 5
Explore More Shortcodes
- Alert
- Animated Popular
- Animated Image
- Animated Scroll New
- Audio
- Badge
- Blockquote
- Blog
- Blur New
- Books
- Button
- Chart
- Clients
- Code
- Collapsibles
- Content Box
- Content Section Popular
- Counter
- Coupons
- Custom Post Type
- Definitions
- Device Mockups
- Divider Popular
- Dropcap
- Emphasis
- Events
- FAQ
- Filler
- Flip Box Popular
- Fullscreen Video
- Gallery Popular
- Google Docs Viewer
- Guests
- Heading
- Highlight
- Hover Box
- Horizontal Ruler
- Icon Popular
- Icon List
- If New
- Image
- Image Compare
- Jobs
- Label
- Lead
- Lightbox
- Locations
- Map
- Masonry
- Members
- Menu
- Post Meta Data
- Movies
- Music
- News
- Overlay Popular
- Panel New
- Parallax Scene Popular
- Permalink
- Person
- Popover
- Portfolio
- Post Fields
- Post Media
- Pricing Table
- Progress
- Project
- Promotional Box
- QR Code
- Quotes
- Recent Books
- Recent Clients
- Recent Coupons
- Recent Events
- Recent Jobs
- Recent Locations
- Recent Movies
- Recent Music
- Recent News
- Recent Portfolios
- Recent Posts
- Recent Projects
- Recent Quotes
- Recent Recipes
[intense_content_section]
<h2>Introduction</h2>
Use the icon list shortcode to add extra style to your lists. Control the color and size of the icon for each item.
[/intense_content_section]
[intense_content_section background_type="color" background_color="#f9f9f9" border_top="1px solid #ededed" border_bottom="1px solid #ededed"]
<h2>Basic Example</h2>
The icon list shortcode allows you to control the color and icon per item in the list. You can set the size of the icon to make bigger icon lists.
[intense_icon_list]
[intense_icon_list_item type="certificate" color="primary"]Nam in est in tortor pretium posuere. Aliquam in augue[/intense_icon_list_item]
[intense_icon_list_item type="circle" color="success"]Mauris sed dolor viverra, accumsan nisl ac, interdum metus. Praesent.[/intense_icon_list_item]
[intense_icon_list_item type="heart" color="error"]Phasellus commodo dolor a mi condimentum tristique. Ut eu velit.[/intense_icon_list_item]
[intense_icon_list_item type="star" color="gold"]Nulla egestas ipsum nec turpis auctor, id suscipit nulla tempor.[/intense_icon_list_item]
[intense_icon_list_item type="stop" color="warning"]Maecenas quis lorem hendrerit, vulputate nulla et, mollis risus. Suspendisse.[/intense_icon_list_item]
[/intense_icon_list]
[/intense_content_section]
[intense_content_section]
<h2>Within Paragraphs</h2>
This example shows the icon list shortcode within paragraphs. This gives you an idea of how it will look if added to your pages and posts.
[intense_filler paragraphs="1"]
[intense_icon_list]
[intense_icon_list_item type="star" color="primary"][intense_filler words="10" paragraph_separator="span" start_with_lorem="0"][/intense_icon_list_item]
[intense_icon_list_item type="star" color="primary"]
Mauris sed dolor viverra, accumsan nisl ac, interdum metus. Praesent.[/intense_icon_list_item]
[intense_icon_list_item type="star" color="primary"]
Phasellus commodo dolor a mi condimentum tristique. Ut eu velit.[/intense_icon_list_item]
[intense_icon_list_item type="star" color="primary"]Nulla egestas ipsum nec turpis auctor, id suscipit nulla tempor.[/intense_icon_list_item]
[intense_icon_list_item type="star" color="primary"]
Maecenas quis lorem hendrerit, vulputate nulla et, mollis risus. Suspendisse.[/intense_icon_list_item]
[/intense_icon_list]
[intense_filler paragraphs="1" start_with_lorem="0"]
[/intense_content_section]
[intense_content_section background_type="color" background_color="#f9f9f9" border_top="1px solid #ededed" border_bottom="1px solid #ededed"]
<h2>Sizes</h2>
The icon list shortcode has five different predefined sizes.
[intense_icon_list]
[intense_icon_list_item type="star"]Size 1[/intense_icon_list_item]
[intense_icon_list_item type="star" size="2"]Size 2[/intense_icon_list_item]
[intense_icon_list_item type="star" size="3"]Size 3[/intense_icon_list_item]
[intense_icon_list_item type="star" size="4"]Size 4[/intense_icon_list_item]
[intense_icon_list_item type="star" size="5"]Size 5[/intense_icon_list_item]
[/intense_icon_list]
[/intense_content_section]
[intense_snippet snippet_id="Child Theme | Shortcodes/footer" snippet_title="Shortcode Page Footer"]