Viewing 16 posts - 1 through 16 (of 16 total)
  • Author
    Posts
  • #452162

    1. Is there a way to make the compact version have the back and forward arrows the large version has?
    2. Also, is there a way to make it so it’s not dynamic but has a fixed height and the text just adjusts to fit the dimension it doesn’t keep making content underneath it on the page change vertical location?

    #452323

    Hi,

    Can you post the link to the page where you have this?

    Regards,
    Josue

    #452331
    #452346

    Hi,

    1. Open /enfold/config-templatebuilder/avia-shortcodes/testimonials.php and look for line 289:

    $controls = false;
    

    Replace it by this:

    $controls = true;
    

    2. Add this to Quick CSS / child style.css:

    .avia-testimonial {
        min-height: 300px !important;
    }

    Regarding 1, you can have this mod on your child theme by copying the testimonials.php file to your child theme directory and applying this:
    http://kriesi.at/documentation/enfold/add-new-or-replace-advanced-layout-builder-elements-from-child-theme/

    Regards,
    Josue

    #452611

    1. Done, piece of cake, but is there a way to…
    A. Make those arrows only show up on roll over and mobile?
    B. Make them always at the middle or top of the box
    C. Make them skinnier so they don’t obstruct the content

    2. I see what that does. I don’t like it because of all the extra empty space on the page. I’ll just leave it the way it was.

    #452811

    Hey!

    A. Use the following to make them appear on hover (what did you mean only in mobile? you should know that there is no ‘hover’ in mobile):

    .avia-slideshow-arrows {
        display: none;
    }
    
    .avia-testimonial-wrapper:hover .avia-slideshow-arrows{
        display: block;
    }

    B. They are always in the middle from what i see.

    C. Use the following to make them skinnier (adjust as needed):

    #top .avia-slideshow-arrows a{
        height: 30px;
        width: 30px;
        line-height: 32px;
        font-size: 12px;
    }
    
    .avia-slideshow-arrows a:before{
        line-height: 32px;
    }

    Cheers!
    Josue

    • This reply was modified 9 years, 5 months ago by Josue.
    #452817

    A. Perfect

    B. ok

    C. I’ve done this adjustment to get them close to the shape I want but now they aren’t centered and I don’t know how to fix it. Also, is there a way for them to be both be farther to the outside or no? Still covers words when you roll over and if I can avoid that I’d like to.

    #top .avia-slideshow-arrows a{
        height: 80px;
        width: 15px;
        line-height: 32px;
        font-size: 12px;
    }
    
    .avia-slideshow-arrows a:before{
        line-height: 80px;
    }
    #452827

    Sure, modify the first part of that code to:

    #top .avia-slideshow-arrows a{
        height: 80;
        width: 15px;
        line-height: 32px;
        margin: -30px -30px 0; /* Added this */
    }

    Regards,
    Josue

    #452834

    1. ok that helps with them being farther to the sides
    2… but it doesn’t recenter them vertically. How do I get them recentered vertically?
    3. Is there a way to add code to make them hidden on mobile? There appears to be a swipe function so I’ll just leave that instead of the arrows for mobile.

    #452839

    Change margin to:

    margin: -60px -10px 0; 
    
    #452840

    Thanks. I was just editing my last post when you wrote this. Please see above.

    #452845

    3. They should be automatically hidden on mobile, if they aren’t change the :hover code to:

    @media only screen and (min-width: 767px) {
    .avia-testimonial-wrapper:hover .avia-slideshow-arrows{
        display: block;
    }
    }

    4. Testimonials sliders doesn’t support this yet, however i believe LayersSlider does, maybe you can re-build the testimonials slider with that.

    Regards,
    Josue

    #452852

    3. Do you mean add this? I don’t have this in there at all yet.

    4. Well it works :) I deleted #4 because I swiped and they work!

    #452855

    I added that code and it didn’t change anything. They don’t show up initially. If you touch the testimonial or swipe it they show up and then don’t go away. I don’t want them to show at all on mobile.

    #452857

    Ok add this:

    .avia_mobile .avia-slideshow-arrows{ display: none !important; }
    

    Regards,
    Josue

    #452864

    Great! All set.

Viewing 16 posts - 1 through 16 (of 16 total)
  • The topic ‘Testimonial Slider Tweak’ is closed to new replies.