Take your website
To the next level
Discover our newly launched customization services and elevate your web projects to new heights.
Delegate tasks, save time, and unlock the power of professional WordPress outsourcing.
Hire Us

Okay
  Public Ticket #864439
Numbered Icons
Closed

Comments

  •  2
    Eric started the conversation
    August 17, 2016 at 9:29pm

    Hello,

    I need help setting up numbered icons with text, similar to the one used in your "About Us Full Width- Mission" section. I'v tried all of the icon sets and can't seem to achieve the same effect. Any help with this would be appreciated. Thank you.

  •  7,092
    Oliver replied
    August 18, 2016 at 12:26pm

    HI!

    pls. use shortocde Dropcap.

    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver

  •  2
    Burkhard replied
    August 22, 2016 at 7:28pm

    Dear Gregor,

    thanks for your reply but your solution doesn't really work, if you include a headline. Please take a look on the attached file.

    So, what can I do that it looks like "icon with text" AND with the numbers?

    Thanks!
    Best Regards
    Burkhard

  •  7,092
    Oliver replied
    August 23, 2016 at 1:04pm

    HI!

    1.  Add  text to the separate column.

    2. Add offset in the column settings. 

    3. Add negative margin in the column.

    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver

  •  2
    Burkhard replied
    August 23, 2016 at 4:46pm

    Dear Gregor,

    thanks for your reply.

    Now, it works. But if I do this often (and I do), it is a little bit laborious.
    It would be better, if numbers (1 - 9) are available in the "icon with text" feature...

    Thank you
    Burkhard

  •  7,092
    Oliver replied
    August 23, 2016 at 5:34pm

    Sorry, it's not possible.

    OK.  

    another way:

    1. Add icon with text and set in the column settings class, for example: custom-icon-1

    2. Add this code.

    .custom-icon-1 .sc-icon:after {
    content: "1";
    display: block;
    position: absolute;
    left: 17px;
    top: 1px;
    font-size: 26px;
    color: #ccc;
    font-family: 'Roboto Condensed';
}
.custom-icon-1 .sc-icon .sc-icon-half-1,
.custom-icon-1 .sc-icon .sc-icon-half-2 {
        display: none;
}

     You can set any number in content

    content: "1";

    For another column on use another class for example:

    custom-icon-2


    .custom-icon-2 .sc-icon:after {
    content: "2";
    display: block;
    position: absolute;
    left: 17px;
    top: 1px;
    font-size: 26px;
    color: #ccc;
    font-family: 'Roboto Condensed';
}
.custom-icon-2 .sc-icon .sc-icon-half-1,
.custom-icon-2 .sc-icon .sc-icon-half-2 {
        display: none;
}

    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver