Add icons before Label

  • Resolved Deepak A. Gupta

    (@deepakrise)


    7 years, 10 months ago

    Hi Team

    Can we add icons like before “Your Name”, I want to add person icon. Before “Your Email”. I want to add mail icon etc.

    Can you please help me regarding this?

    Thanks in advance
    Deepak

Viewing 1 replies (of 1 total)
  • Plugin Author GusRuss89

    (@gusruss89)

    Hi @deepakrise,

    Unfortunately there’s no built-in way to do this yet. It has been on my list of potential additional features for a while so at some point in the future it should be possible out of the box, but I don’t have a timeline for it at this point.

    If you are ok with HTML and CSS you might be able to do it yourself, here’s what you’d need to do:

    1. Add the material icons font to your theme’s header.php

    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

    2. Add the icon to your label like so:

    [md-text label="<i class='material-icons'>email</i> Your email"]
[email* your-email]
[/md-text]

    (note the single-quotes around material-icons)

    3. Add some CSS to your theme to make the icons the right size and position. Something like:

    label .material-icons {
    position: relative;
    top: 0.3em;
    margin-right: 0.2em;
}

    Thanks,
    Angus

Viewing 1 replies (of 1 total)
  • The topic ‘Add icons before Label’ is closed to new replies.