Horje
Insert Material Design Icons into your WordPress post and pages. Wordpress Tutorial

Noted That:

  • To install correctly this material-design-icons.zip .
  • Fisrt Download the material-design-icons.zip to your computer
  • Extract/Open material-design-icons.zip to Your Computer.
  • Then, Find readme.txt file inside material-design-icons.zip and Open readme.txt .
  • Now, Read the Requirements of this plugin. Which Wordpress Version and PHP Version are required to run this Plugin in Your Wordpress Site.
  • Then, Follow the Tips Below.

Start the Tips:

1. First Download " material-design-icons.zip " Plugin to your Local Computer. (Click Download)

2. Then, Login to your " yourdomain.com/wp-admin " Dashboard.

/stack/wp/e1593231376d7d849d2-4597-4fa3-a6ff-1eca18f72aab.png

3. Then, Click on " Plugins " + " Add New " from left sidemenu of Dashboard.

/stack/wp/e1593231378Screenshot20.png

4. Now, Click on "Upload Plugin" button.

/stack/wp/e1593231380Screenshot-2019-4-2AddPluginsHorjeWordPress.png

 

5. Now, Browse " material-design-icons.zip "  Downloaded plugin from your computer, Where you downloaded material-design-icons.zip According to Step – 1 Above then, click on " Install Now"

/stack/wp/e15931461531577025694plugin.png

6. Now, Click on " Active Plugin"

/stack/wp/e15932313830ca45529-bf73-4101-8178-53ae60ce549f.png

7. Then, See left sidemenu. " Material Design Icons " folder is added on left sidemenu. Now, Click on " Material Design Icons " folder.

   Noted that: If you do not see " Material Design Icons " folder on left sidemenu then, see at left sidemenu " Settings " or " Tools ".

8. Now you configure yourself oR Watch video tutorial below about  Material Design Icons Configurtions and Settings or How to work " Material Design Icons " in your WordPress site.

 

oR

After Activated Plugin According to Step-6 then,

  1. Go to " Plugins " + " Installed Plugin " from Wordpress Admin Panel Leftside Menu.
  2. or Direct go to: https://yourdomain/wp-admin/plugins.php
  3. Then, Find " Material Design Icons " Activated Plugin from Plugin List.
  4. Then, Click on " Settings " from Plugin that is Material Design Icons
  5. Now, Edit/Add/Config the setting and Click on " Save Changes " button,
WP Plugin Setting



Guide

To use any of the Material Design icons on your WordPress site follow the steps below:

  1. Upload material-design-icons to the /wp-content/plugins/ directory
  2. Activate the plugin through the ‘Plugins’ menu in WordPress
  3. Add the HTML markup or shortcode to your WordPress post or page.

A full list of the 1000+ Material Design icons is available: materialdesignicons.com/

To use any of the Material Design icons on your WordPress site you have two options:

HTML

Examples

Bell icon

Shortcode

Don’t want to worry about HTML tags? You can use a shortcode in your posts, pages and even widgets to display a Material Design icon.

The shortcode to use is [mdi-icon name=X] , where name=X is the class of the icon you would like to use.

Examples

Amazon icon


[mdi-icon name="amazon"]

Since v0.0.3 you can now add size and color.


[mdi-icon name="amazon" color="red" size="2x"]

Hex values will work for the color option and the include size values are: lg, 2x, 3x, 4x, 5x, 6x, 7x, 8x, 9x, 10x

Author


insert , material , design , icons , into , post , pages , tutorial ,

Name
   How to add Woo Show Single Variations Shop Category in Wordpress
   How to add Firmasite Theme Enhancer in Wordpress
   How to add Flexia Core in Wordpress
   How to add Easy Seo Friendly Images in Wordpress
   How to add Developer Mode in Wordpress 

Read Article
https://develop.horje.com/learn/1434/reference

 

Horje