[Resolved] Blank thumbnail slider with thumbs

[Author]

Posts

[pedro.S]

Imported the thumbnail slider with thumbs module.
Placed the view according to the instructions in the page.
A blank space appears instead of the slider, but in the html i see that the content is there... It just does not appear visually.

I provided the site url on the field above, but for you to access it you have to change the hosts file to point (DO NOT ADD www previous to the domain) to the ip:

185.63.180.28

After that please visit the domain/#thumb-slider to see it for yourself.

hidden link

Edit: I managed to make a change and it appears fine now EXCEPT the fact that it's height is not beeing correcly interpreted. It's like the content slide had height:0. If i set to auto, it does not nothing when it should just addapt the slider height to it's content... any tip to accomplish this?

.carousel-inner > .active { height:auto !important} doesn't work.

thanks

[Shane Supporter Languages: English (English ) Timezone: America/Jamaica (GMT-05:00)]

Hi Pedro,

Thank you for getting in touch.

I'm assuming you've provided the IP for the site and gave the credentials previously, however i'm not able to find or see this.

Could you resend them so that I can check on the issue for you ?

Thanks,
Shane

[pedro.S]

Thanks Shane for your time.

Add the following line to your HOSTS file

You will see a white area with only the thumbs part (grey little thumbs). With the inspector you will be able to see that the testimonials are there in the html and everything is fine, it has some part of the css that is wrong.
If i set a custom height to the class carousel-inner (ex: 360px) i can visualize the content but this should be with auto height to adapt, because some testimonials can be bigger then others in terms of text.

Thanks

[pedro.S]

Although i ended up solving this issue i would like to get feedback about if this is indeed a good solution.
The only way it worked was adding this CSS:

.carousel-inner {
position: inherit !important;
overflow: -webkit-paged-x !important;
overflow-x: hidden !important; /* the scroll was showing when testimonial slider had slides with different height */
}

[Shane Supporter Languages: English (English ) Timezone: America/Jamaica (GMT-05:00)]

Hi Pedro,

This seems fine to me. It could've been a positioning issue as you've used the position css to adjust it.

Assuming this is the slider. See Screenshot.

Thanks,
Shane

[pedro.S]

Shane,

Actually it's this part of the page: hidden link

I used no css styling for bootstrap, so it should come outside the box.
Another thing i've tried was to include 2 sliders on the same page, and failed.

Your documentation regarding the thumbail slider is poor.. you don't put the code on the page, you take screenshots of it. That leads the user to install it using the module.

The problem here (Which happened to me) is that the module creates the custom post type "Portolios" which the theme already had, so it ended up beeing mixed up, if you know what i mean.
With a detailed how-to-page with all the code copy-friendly, it's easier to avoid this issue because we could create ourselfs.

I ended up installing a post slider for the second slider and did the trick.

[Shane Supporter Languages: English (English ) Timezone: America/Jamaica (GMT-05:00)]

Hi Pedro,

Thank you.

Yes I understand that we are lacking in the documentation department and we are constantly working to improve this.

However everything seems to be working fine now. I understand the issue with the Portfolio naming which may not be the best since alot of themes come with build in portfolio CPT's

Thanks,
Shane