[Support request] Content Blue Boxes

Home Forums Support Content Blue Boxes

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #944388
    Mike

    Hello
    Could you guys point me in the right direction on how to make these blue “pro tip” boxes?

    Thank you

    #944688
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    That page is using a shortcode to output those, but you don’t have to. We can do it with some HTML and CSS.

    For example, here’s your pro tip:

    <div class="pro-tip">Your text in here</div>

    And here’s your CSS:

    .pro-tip {
        background-color: #e4ecf3;
        border: 1px solid #428bca;
        padding: 20px;
    }

    Let me know if you need more info 🙂

    #946433
    Mike

    Thanks that is exactly what I wanted!

    If I wanted to add another box in the same post, using a different yellow, what would be the code to add that as well?

    So in the same post, a box with yellow and blue

    Thank you

    #946490
    David
    Staff
    Customer Support

    Hi there,

    if its just a yellow one then add a different custom class to your markup eg.

    <div class="yellow-tip">Your text in here</div>

    and add this CSS:

    .yellow-tip {
        background-color: #fcffd9;
        border: 1px solid #dbe198;
        padding: 20px;
    }
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.