Bootstrap Glpyhicons are the 12×12 icons you can use for your business projects, inside your blog posts, you can use them as visuals for your website’s sidebar navigation, on a purely icon-driven navigation, they fits better next to h2 headings tags, with links etc. Essentially, anywhere you can put current <i> tag icons. Bootstrap Glyphicons uses the same Bootstrap structure (<i> tag for all icons), for using larger Glyphicons you can use an additional icon-large: <i class=”icon-large icon-search”></i>.
In this tutorial we will show you a very easy way to insert Bootstrap Glpyhicons inside your posts, pages and other custom post types using a TinyMCE button in WordPress visual editor.
Simply install and activate RAphicon plugin. Upon activation the plugin adds its dropdown button in WordPress visual editor. For inserting a glpyhicon, visit add new post page or open any old post for editing. Place the cursor wherever you like displaying the glpyhicon then click RAphicon’s dropdown button to select and insert the icon. As soon you click any icon, it inserts that glpyhicon’s shortcode inside your post content.
You can manually add parameter to inserted shortcode for customizing its size and color:
Default glyphicon shortcode looks something like this: [dashicons type="icon_name"]
You can manually add size and color parameters like this: [glyphicon type="icon_name" size="size_with_units" color="color_with_hashtag"]
And then it should look something like this: [glyphicon type="asterisk" size="20em" color="#999999"]
You can manually use these icons inside your theme too. For Example:
<span class="glyphicon glyphicon-icon_name"></span>OR<span class="dashicons dashicons-icon_name"></span>