Home>Support>How do I Pair Icons With Custom Text

How do I Pair Icons With Custom Text

I really like the icons in “circle icon,” but the text area in that widget does not appear customizable. It’s smaller than I would prefer and I’m not seeing how to make the text larger or add hyperlinks to words, etc. Is there a way to have both have an icon in the same column as customized text? I want to create three columns of custom text (that’s hyperlinked, and 14 or 16 pt font) beneath icons.

Or, is there a way in visual editor to include, for example, the circle check icon centered above the custom text?

Thanks!

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 9 years, 3 months ago Srikanth Kamath

    you could use “circle icon” widget.. and then customise to your heart’s content Image

  2. 9 years, 3 months ago todd91712000

    That's the problem.  I have the "circle icon" widget open right now, and while text may be added to that widget area, there is no option to customize the text in circle widget.  I'm not looking to customize the icon, i'm looking to customize the text.  

  3. 9 years, 3 months ago Srikanth Kamath

    Bro, I am not sure of your Question.. ? do you want to have the style of the text.. if yes then you will have to use Custom CSS which the Vantage theme allows.

    First in Widget Style ( right side) of Circle Widget “Attribute” Widget Class give a name “my-circle-1” and style your text in the custom CSS

    .my-circle-1 p {
        font-family: "Times New Roman"!important;
        font-size: 20px!important;
    }
    

    for more on CSS click here for css and for a video tut Greg Narayan

  4. 9 years, 3 months ago Srikanth Kamath

    if you want to change the “Title” then target the h4

    /* not tested the CSS but this the way to do it */
    .my-circle-1 h4 {
        font-family: "Times New Roman"!important;
        font-size: 20px!important;
        color: #00ff00;
       /* you may or may not require the !important */
    }
    
  5. 9 years, 3 months ago todd91712000

    Perfect!  Thank you.  

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More