Support » Plugin: HMS Testimonials » Rotator Control Buttons

  • Resolved chappie

    (@chappie)


    Just popping in to say how pleased I am with HMS Testimonials – and to share my simple Rotator control player buttons (easy as pie but little things delight us newbies):

    …and the CSS code is (adjust to suit):

    /*  testimonials widget buttons */
    .hms-testimonials-rotator .controls {
    text-align: center;
    font-weight: normal;
    font-size: xx-small;
    margin-left: 20%;
    margin-right: 20%;
    border-style: solid;
    border-width: medium;
    border-color: rgba(143, 72, 226, 0.5);
    border-radius: 25px;
    background-color: #fafafa;
    }

    How easy was that?! To get the vertical separators, I simply used the keyboard vertical stroke “|” in the button name fields, ie: “PREV |” and “| NEXT”.

    Anyone else got something to share?

    http://wordpress.org/plugins/hms-testimonials/

Viewing 1 replies (of 1 total)
  • Modified margins to prevent overcrowding in responsive themes:

    /*  testimonials widget buttons */
    .hms-testimonials-rotator .controls {
    text-align: center;
    font-weight: normal;
    font-style: normal;
    font-size: xx-small;
    margin-left: 12%;
    margin-right: 12%;
    border-style: solid;
    border-width: medium;
    border-color: rgba(143, 72, 226, 0.5);
    border-radius: 25px;
    background-color: #fafafa;
    }

    Additional CSS to prevent button line-wrap in small viewports:

    @media (max-width: 979px) {
    /* testimonial widget buttons - add margin to stop wrap in small screens */
    .hms-testimonials-rotator .controls {
    margin-left: 1px;
    margin-right: 1px;
      }
    }

    Merry Xmas.

Viewing 1 replies (of 1 total)
  • The topic ‘Rotator Control Buttons’ is closed to new replies.