-
AuthorPosts
-
May 31, 2015 at 6:12 am #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?June 1, 2015 at 5:09 am #452323Hi,
Can you post the link to the page where you have this?
Regards,
JosueJune 1, 2015 at 5:43 am #452331June 1, 2015 at 7:08 am #452346Hi,
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,
JosueJune 1, 2015 at 4:24 pm #4526111. 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 content2. 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.
June 1, 2015 at 10:36 pm #452811Hey!
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, 6 months ago by Josue.
June 1, 2015 at 10:47 pm #452817A. 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; }
- This reply was modified 9 years, 6 months ago by strengthcoaching.
June 1, 2015 at 11:22 pm #452827Sure, 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,
JosueJune 1, 2015 at 11:37 pm #4528341. 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.June 1, 2015 at 11:51 pm #452839Change margin to:
margin: -60px -10px 0;
June 1, 2015 at 11:52 pm #452840Thanks. I was just editing my last post when you wrote this. Please see above.
June 2, 2015 at 12:02 am #4528453. 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,
JosueJune 2, 2015 at 12:18 am #4528523. 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!
June 2, 2015 at 12:27 am #452855I 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.
June 2, 2015 at 12:39 am #452857Ok add this:
.avia_mobile .avia-slideshow-arrows{ display: none !important; }
Regards,
JosueJune 2, 2015 at 1:04 am #452864Great! All set.
-
AuthorPosts
- The topic ‘Testimonial Slider Tweak’ is closed to new replies.