WordPress.org

Forums

HMS Testimonials
[resolved] Problems with italics not being displayed in testimonial and website URL (19 posts)

  1. linbmcd
    Member
    Posted 1 year ago #

    Two issues:
    1. I have used the visual editor in each testimonial to set the testimonial font, color and style (Arial, rust and italics). None of these are showing up in the rotating widget.

    2. I have included one of the testimonial author's website URL but it doesn't show up as an active link in the widget.

    Thanks. Great plug in!

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

  2. Jeff K
    Member
    Plugin Author

    Posted 1 year ago #

    Hey linbmcd,

    1. With the rotating widget, are you shortening the text at all so that a read more link show up?

    2. One of the great powers of this plugin is you can control what fields are shown. Go into your WordPress -> Testimonials -> Templates. I am assuming you aren't changing the template so click the "Edit" link in the row with an ID of 1. You should see URL (System) in the Unused Items column. Click and drag it where you want in the Active Items column. Once done click "Save Template". In the widgets and shortcodes you can use any of the existing templates or even create your own.

    Jeff

  3. linbmcd
    Member
    Posted 1 year ago #

    Hi Jeff,

    1. Yes, I have set the word limit to 100, I believe. Are you asking because this affects how the text is displayed?

    2. No, I am not changing the template. And nope, "URL System" is in the Active column :(. The website URL is not a clickable link.

    http://www.awakenedlives.com

    Thanks.

  4. Jeff K
    Member
    Plugin Author

    Posted 1 year ago #

    1. When you limit words or characters it strips out all HTML. It does this so there isn't an open bold tag, div, etc. that messes up the rest of your site. If you want to change the text for ALL testimonials you can adjust the CSS in your themes stylesheet.

    2. In your WordPress dashboard go to Testimonials -> Settings and make sure the checkbox for 1. If a testimonial has a url, show it as an active link? is checked.

    Jeff

  5. linbmcd
    Member
    Posted 1 year ago #

    1. Well, Jeff, I appreciate your response. Unfortunately, I have no experience in CSS, so I wouldn't know how to do what you're suggesting.

    2. HOWEVER, I did follow your instructions in #2, and found that that particular checkbox had not been checked. I did check it, and the link is now a clickable link. Thank you.

  6. Jeff K
    Member
    Plugin Author

    Posted 1 year ago #

    Can you paste in the content of one of your testimonials (styling and all). You can of course change the text if need be.

    If you can get that to me, I can help with the CSS you need.

  7. chappie
    Member
    Posted 1 year ago #

    If your theme has a Custom Css feature you can just paste your CSS in there. This should make your rotating text italic:

    /* Testimonials widget default text style */
    .hms-testimonials-rotator {
    font-style: italic;
    }

    Ideally you should be working on a child theme so that your modifications don't get overwritten when an update for your theme is introduced. If you don't know how to create a child theme, ask in your theme forum.

  8. linbmcd
    Member
    Posted 1 year ago #

    Thank you Chappie and Jeff. I decided to be brave and paste the CSS into my theme's css stylesheet editor (I use Parabola theme), and it did italicize all my text - thanks. What I wanted to do, though, was only italicize the body of the testimonial. My goal is to pretty much match the widget text characteristics with the characteristics of my testimonial page, specifically:

    1. The actual testimonial is italicized, and the author's name is not.

    2. Also, the font color of the actual testimonial is #993300, the author's name (and url if applicable) is black.

    3. There is a space between the body of the testimonial and the author's name.

    Jeff, I am not sure exactly what you meant when you asked me to paste in the content of one of my testimonials, "styling and all". Do you mean the text version, which includes the html? Thanks for your generous offer - if only I could figure it out! :=)

  9. Jeff K
    Member
    Plugin Author

    Posted 1 year ago #

    Hey linbmcd,

    To target only the testimonial (not the author, etc), change

    .hms-testimonials-rotator {

    to

    .hms-testimonials-rotator .testimonial {

    Based on your last comment and looking at your testimonials page, here is what you should use:

    .hms-testimonials-rotator .testimonial {
    font-style: italic;
    color: #993300;
    font-family: arial, helvetica, sans-serif;
    }
    
    .hms-tesitmonials-rotator .author {
    /* Just in case your theme does not already set it. */
    color:#333333;
    /* Add spacing between testimonial and author */
    margin-top:15px;
    }
    .hms-tesitmonials-rotator .url a {
    /* Just in case your theme does not already set it. */
    color:#333333;
    }

    Yep that is what I meant. I believe the CSS above takes care of that.

  10. linbmcd
    Member
    Posted 1 year ago #

    Jeff, thanks so much! Unfortunately, the CSS above did not add the additional space between the testimonial and author (or between the "read more" text and the author).

    Also, is there a way to control the color of the "read more" text?

    I think that does it with my questions - thanks so much for such prompt help and education.

  11. Jeff K
    Member
    Plugin Author

    Posted 1 year ago #

    The "read more" links have a class readmore on them.

    I had a spelling mistake on the author and URL classes.

    .hms-testimonials-rotator .author {
    /* Just in case your theme does not already set it. */
    color:#333333;
    /* Add spacing between testimonial and author */
    margin-top:15px;
    }
    .hms-testimonials-rotator .url a {
    /* Just in case your theme does not already set it. */
    color:#333333;
    }

    So for the read more link, to set the color to red, use:

    .hms-testimonials-rotator .readmore {
    color:red;
    }
  12. linbmcd
    Member
    Posted 1 year ago #

    This worked wonderfully! I did notice that the red color is very close to the color of the body of the testimonial, so I tried to substitute another color in the CSS - black for red - but it didn't change anything. Then I tried to used the hex code, and that didn't work either. Am I missing something?

  13. Jeff K
    Member
    Plugin Author

    Posted 1 year ago #

    Right now the link is being set to #BF4D28 from your footer declaration which may be overriding what you set.

    For black try using:

    #footer a.readmore {
    color:#000;
    }
  14. linbmcd
    Member
    Posted 1 year ago #

    OK, Jeff, you are officially my hero! Aside from getting the look that I want, you are also helping educate me, which I really appreciate. A donation is on the way!

  15. Jeff K
    Member
    Plugin Author

    Posted 1 year ago #

    :)

    If you want to get all nerdy and dig into CSS, checkout this article on CSS specificity. It is why the read more link needed some different code.

  16. linbmcd
    Member
    Posted 1 year ago #

    I'm up for getting all nerdy - thanks!

  17. Jeff K
    Member
    Plugin Author

    Posted 1 year ago #

    Sweet! And thank you for the donation.

  18. linbmcd
    Member
    Posted 1 year ago #

    One more question. Should I move this CSS from my CSS Stylesheet Editor to my theme's Custom CSS field. Will it get overwritten either way when theme or WordPress is updated?

  19. Jeff K
    Member
    Plugin Author

    Posted 1 year ago #

    Yes, if your theme has a custom CSS field use that instead.

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • HMS Testimonials
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic

Tags

No tags yet.