Product Tabs In Small Screens - How To Disable Accordion View?

General General Questions
1

Hello,

Product tabs (like description, features... etc.) change to accordion style in small screens. I want to disable this feature. I am good in CSS but couldn't find any media queries or related code. Seems that it is a javascript code. How can I disable this without changing core files?

I am writing to you after 2 hours of trials!

Any help please?

2

Yes, tabs are generated by js (js/tygh/responsive.js). To disable it, try to add the cm-j-tabs-disable-convertation class to all elements with the cm-j-tabs class

3

Yes, tabs are generated by js (js/tygh/responsive.js). To disable it, try to add the cm-j-tabs-disable-convertation class to all elements with the cm-j-tabs class

It is working perfectly. As always, you are very helpful e-ComLabs.

Thank you!

4

You are welcome! :)

5

Hello!

I want to add the cm-j-tabs-disable-convertation class to all elements with the cm-j-tabs

What file should I edit?

This one? /design/themes/my_theme/templates/common/tabsbox.tpl

Microformats cs-cart manual said that I also should add cm-j-content-disable-convertation to tab content. Where it is located?

6

It seems I figure it out. :-)

I should edit js/tygh/responsive.js

I made this way -> http://prntscr.com/oy4rjt

Right?

7

It seems I figure it out. :-)

I should edit js/tygh/responsive.js

I made this way -> http://prntscr.com/oy4rjt

Right?

responsiveTabs: function() {
if (this.winWidth() <= 480) {
// conver tabs to accordion
//$('.cm-j-tabs:not(.cm-j-tabs-disable-convertation)').each(function(index) {
$('.cm-j-tabs.cm-j-tabs-disable-convertation').each(function(index) {
var accordion = $('
'">');
var tabsContent = $('.cm-tabs-content:not(.cm-j-content-disable-convertation)');
var self = this;
8

Can you post a screenshot so that we can see how product page looks now with this change.

Thanks!

9

KirillLB,

It worked for me

Thanks for posting the fix and eComLabs for guiding in the right direction

10

Can you post a screenshot so that we can see how product page looks now with this change.
Thanks!

yep http://prntscr.com/q1a29n