Can’t style some elements

  • jlgarnier

    (@jlgarnier)


    7 years ago

    Hi Dev!

    I’m tinkering with the plugin but I’m unable to style some elements, and in particular to get rid of these rounded image below the quote.

    I’ve tried to catch the proper selector with Chrome’s dev tools and put my own settings in the child theme’s style.css but to no avail.

    Example here: #testimonial_rotator_634 div.testimonial_rotator_author_info.cf-tr p { font-family: “Racing Sans One”, Helvetica, sans-serif !important; font-size: 50px !important; } properly changes the font but instead of enlarging the text, it just changes the line height!

    For the image: #testimonial_rotator_634 .testimonial_rotator_img { width: 300px; height: 200px; margin: 0 auto; display: block; overflow: hidden; } just displays a larger image but in an ellipse.

    Can you please help me fixing this?

    Thanks in advance for any help!

Viewing 4 replies - 1 through 4 (of 4 total)

  • To kill the rounded image you can just disable it in the rotator options. There’s a check box to hide the image. If you’re rather keep it and just change the roundness of the image you can do that in the parent div @

    .testimonial_rotator.template-longform .testimonial_rotator_img {-webkit-border-radius: 8px; -moz-border-radius: 8px; border-raadius: 8px}

    The font size thing is weird. I didn’t look at it too closely but I see what you’re talking about.

    Thread Starter jlgarnier

    (@jlgarnier)

    Thanks for the answer Jon! I’ve indeed disabled the image and added it to the testimonial itself. Right before the name of the author would be a better place but there’s no way to insert any media there… ??

    By the way, I’d now like to change the size of the image and not the radius: any clue on this?

    What if I also want to change the author font? Where should I tweak the CSS?

    Thanks in advance for any help!

    Hi @jlgarnier

    You can change the testimonial text itself at:
    .testimonial_rotator.template-longform .testimonial_rotator_quote
    You can set the font size, family, etc.

    The class you need to change the font, size, etc. for the author name is:
    .testimonial_rotator.template-longform .testimonial_rotator_author_info

    The title is here:
    .testimonial_rotator.template-longform .testimonial_rotator_slide_title

    On the image, if you’ve placed the image into the review itself you’ll just want to add ‘img’ to quote class…
    .testimonial_rotator.template-longform .testimonial_rotator_quote img
    Then you’ll be able to change the image any way you like:
    width: 140px; height: auto; -border-radius: 12.5%, opacity: .8, box-shadow: 0px 3px 18px rgba(0,0,0,.4);

    Hope this helps. ??

    Thread Starter jlgarnier

    (@jlgarnier)

    Yes, it really helps! Thanks a lot Jon!

    By the way, I tried to change the size of the font in “

    .testimonial_rotator.template-longform .testimonial_rotator_author_info

    ” but to avail: only line height seems to change when setting different font-size values… Strange! Is this tag overwritten anywhere?

    “.testimonial_rotator.template-longform .testimonial_rotator_quote img” seems also to be overwritten or skipped, as no change in the CSS goes through to the site…

    Any clue on this?

    Thanks again for your help!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Can’t style some elements’ is closed to new replies.

Tags