runcoders

<h4>MATERIAL DESIGN</h4>
Material is an adaptable system of guidelines, components, and tools that support the best practices of user interface design. Backed by open-source code, Material streamlines collaboration between designers and developers, and helps teams quickly build beautiful products.
<h4>MATERIAL DESIGN ICONS</h4>
They are simple, modern, friendly, and sometimes quirky icons. Each icon is created using our Material Design guidelines to depict in simple and minimal forms the universal concepts used commonly throughout a UI. 
Materializor integrates v7.0.96 (7134 icons) with Elementor icon library.
<h4>WIDGETS AVAILABLE</h4>
<ul>
<li><a href="https://runcoders.net/materializor/button/" rel="nofollow ugc">Button</a>. Buttons allow users to take actions, and make choices, with a single tap.</li>
<li><a href="https://runcoders.net/materializor/card/" rel="nofollow ugc">Card</a>. Cards contain content and actions about a single subject.</li>
<li><a href="https://runcoders.net/materializor/chip/" rel="nofollow ugc">Chip</a>. Chips are compact elements that represent an input, attribute, or action.</li>
<li><a href="https://runcoders.net/materializor/collapsible/" rel="nofollow ugc">Collapsible</a>. Collapsibles are accordion elements that expand when clicked on.</li>
<li><a href="https://runcoders.net/materializor/fixed-action-button/" rel="nofollow ugc">Fixed Action Button</a>. A fixed floating action button that allows multiple actions for a screen.</li>
<li><a href="https://runcoders.net/materializor/heading/" rel="nofollow ugc">Heading</a>. Headings have predetermined typography and style.</li>
<li><a href="https://runcoders.net/materializor/progress/" rel="nofollow ugc">Progress</a>. Progress express an unspecified wait time or display the length of a process.</li>
<li><a href="https://runcoders.net/materializor/spinner/" rel="nofollow ugc">Spinner</a>. Spinner express an unspecified wait time of a process.</li>
<li><a href="https://runcoders.net/materializor/tabs/" rel="nofollow ugc">Tabs</a>. Tabs organize content across different screens, data sets, and other interactions.</li>
</ul>

Materializor

Is a WordPress plugin and Elementor page builder extension with Material Design widgets and icons.

Manny Costales

This plugin just add a simple shortcode to the functions.php file, which embed the latest version of the MD Iconic Font css (v 2.2). 
Once installed, you can go to http://zavoloklom.github.io/material-design-iconic-font/cheatsheet.html and check the code of the icon you want to use. Just click on the icon and copy and paste de code wherever you want to use it.
You can also add an icon using the shortcode [mdiconic]. This shortcode has four attributes:
<ul>
<li>aclass -> classes to use in the ‘a’ tag</li>
<li>target -> target of the ‘a’ tag (_blank, _self, _parent, _top)</li>
<li>href -> link to use in the ‘a’ tag</li>
<li>iclass -> classes to use in the ‘i’ tag</li>
</ul>
** Examples **
[mdiconic aclass=”” target=”” href=”” iclass=””]
[mdiconic iclass=”zmdi-compass zmdi-hc-3x zmdi-hc-spin”]
[mdiconic iclass=”zmdi-facebook-box” href=”http://www.fb.com/jumptoweb” target=”_blank”]
NOTE: To see more examples you can use in the iclass parameter, check this page http://zavoloklom.github.io/material-design-iconic-font/examples.html
NOTE: To add any shortcode or tag you should use the text editor (not the tinymce)

Material Design Iconic Font Integration

This plugin integrate the Material Design Iconic Font library with your wordpress installation. You can use the shortcode generated with this plugin t …

Materializor vs Material Design Iconic Font Integration