Support » Plugin: Advanced Custom Fields: Font Awesome Field » adding Classes advanced-custom-fields-font-awesome

  • Resolved tinhop

    (@tinhop)


    hello good morning, I am setting up a page with html and custom fields within wordpress so that my client can change some things and others not, I have some lines of code in my html that are the following

    <span class="fa-stack fa-4x">
                <i class="fas fa-circle fa-stack-2x text-primary"></i>
                <i class="fas fa-shopping-cart fa-stack-1x fa-inverse"></i>
              </span>

    When I finish configuring and assembling the custom fields necessary so that the client can change the icon but not the classes, I have something like that

              <span class="fa-stack fa-4x">
                <i class="fa fa-circle fa-stack-2x text-primary"><i class="fa fa-stack-1x fa-inverse"><?php echo $services['icono3'];?></i></i>
                
              </span>

    The problem I have is that I don’t get the Icon to look the right size, and I can’t hit it, that is to say, I take good the icon that I choose and the colors, but the size is not correct

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author Matt Keys

    (@mattkeys)

    If I am understand what you are doing I think you are putting the PHP echo in the wrong spot, and possibly returning the wrong value from the ACF field.

    I think what you want is something like:

              <span class="fa-stack fa-4x">
                <i class="fas fa-circle fa-stack-2x text-primary"></i>
                <i class="fas <?php echo $services['icono3'];?> fa-stack-1x fa-inverse"></i>
              </span>

    Note that the echo is now inside of the class for the second icon. Also note that the $services[‘icono3’] would be returning just the chosen icon class (not the icon element which is the default).

    Hope this helps.

    • This reply was modified 1 week, 5 days ago by  Matt Keys.

    good, thank you very much for taking the time to review my code and answer me, I wanted to comment that when I put the code as you mentioned it ends up visualizing in this way.
    front end caption
    on the other hand I have this is how I have ACF configured
    ACF config
    as seen in the first capture is how it is coming out now, and it is what I do not want.
    How I want it to look like this
    i whish to achive this

    Plugin Author Matt Keys

    (@mattkeys)

    It looks like your ACF configuration is incorrect for what you are trying to do. The return value should be “Icon Class”.

    thank you very much, there I am perfect, sorry for bothering you so much, I am getting acquainted with ACF, wordpress and php in general

Viewing 4 replies - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.