Styling of MD slider in Product collections not OK

paradoxx's picture
paradoxx
Fri, 11/13/2015 - 12:58
#1
Styling of MD slider in Product collections not OK

Hi,

I have been experimenting with the MD slider options in the edit pane of Product collections taxonomy terms.

After simply cloning and enabling the Home slider as collection slider, the slider is not visible. 

I can only see the pager buttons to navigate the slides.

After inspecting elements in my browser, i can see several divs styled with zero height and/or width.

Is there some css file missing in my configuration ? Looks a bit like this...

Thanks upfront for your support!

phuonght's picture
phuonght
Fri, 11/13/2015 - 21:29

Hi,

Could send us your site url, admin account and FTP account? Tell us which page you have problem also, we would like to check it for you. Please remember to check "Private message" for security reason.

paradoxx's picture
paradoxx
Sat, 11/14/2015 - 02:10

Hi,

I've just checked my custom.css again and after removing this manually added styling to the .term-Listing-Heading And Block-Views-Collections-Block the Slider is showing up again :

div.taxonomy-term.vocabulary-product-collections {margin-top: 30px;}
div.taxonomy-term.vocabulary-product-collections > .content {display: table}
div.taxonomy-term.vocabulary-product-collections > .content > .field-type-image {display: table-cell;}
div.taxonomy-term.vocabulary-product-collections > .content > .taxonomy-term-description {
display: table-cell;
padding: 20px;
vertical-align: bottom;
}
body.page-taxonomy-term- #block-views-collections-block .collection-item {margin: 10px 0px;}
body.page-taxonomy-term- #block-views-collections-block > .container {padding: 0px;}
body.page-taxonomy-term- #block-views-collections-block > div:last-of-type {
margin-left: -10px;
margin-right: -10px;
}
body.page-taxonomy-term- #block-views-collections-block > div:last-of-type > div {padding: 0px 10px;}

Image title

http://couture1.artstanding.be/product-collections/2016-summer-collectio...

Beside applying a display: none css property on the thumbnail image shown above, is there a conditional hiding possible ?

I mean, in case there is no slider attached to the collection, i would like to show the thumbnail image. In case there is a slider the thumbnail should be hidden.

Thanks

phuonght's picture
phuonght
Sat, 11/14/2015 - 02:38

So the problem you had with MD Slider comes from your file custom.css, right?

And about 'show thumbnail" option: you can find in configuration of MD Slider.

paradoxx's picture
paradoxx
Sat, 11/14/2015 - 10:26

Yes, my custom.css caused the slider view problem.

If you mean this setting in the slider :

Image title

this thumbnail is used when slideshow cannot be loaded i presume..

What i meant was the thumbnail that is attached to the taxonomy collection term and is also used in this view :

Image title

It is set visible in the taxonomy term display like this :

Image title

So either the thumbnail or the collection-slider should be made visible based on existance of the slider in 1 specific collection term to show.
Maybe hook_taxonomy_term_view($term, $view_mode, $langcode) or hook_taxonomy_term_view_alter(&$build) can bring a solution... I'll give it a try

paradoxx's picture
paradoxx
Sun, 11/15/2015 - 08:09

It worked with this hook:

function hook_taxonomy_term_view($term, $view_mode, $langcode) {
    if(empty($term->content['field_collection_slider'])) {
        $term->content['description']['#prefix'] = '<div class="taxonomy-term-description align-right">';
    } else {
        $term->content['field_collections_image'] = array();   //clear the thumbnail image from the view
    }
}

Log in or register to post comments
Have More Idea?

We are here to build your website!

No Universal solution fits all special business requirements. Our experienced team is ready with ideas and state-of-the-art technical solutions to consult the best solution within your budget.