Responsive Layout on/off

**GK User** Mon Apr 08, 2013 7:14 pm Reply with quote Report this post

The template's admin section that allows for the responsive layout to be turned off doesn't work. No matter the setting it still stays responsive.

On a side note: Was there a plan for a social section? Because the module is there but there is not a social section in the template's module positions layout.

**GK User** Tue Apr 09, 2013 7:46 am Reply with quote Report this post

Please open file template/lib/framework/helper.layout.php and find this code in lines 70 - 89 :

Code: Select all: // set media query for small desktops echo '<link rel="stylesheet" href="'.($this->API->URLtemplate()).'/css/small.desktop.css" media="(max-width: '.$template_width.'px)" />' . "\n"; // set media query for the tablet.css echo '<link rel="stylesheet" href="'.($this->API->URLtemplate()).'/css/tablet.css" media="(max-width: '.$tablet_width.'px)" />' . "\n"; // set media query for the small tablets echo '<link rel="stylesheet" href="'.($this->API->URLtemplate()).'/css/small.tablet.css" media="(max-width: '.$tablet_small_width.'px)" />' . "\n"; // set media query for the mobile.css echo '<link rel="stylesheet" href="'.($this->API->URLtemplate()).'/css/mobile.css" media="(max-width: '.$mobile_width.'px)" />' . "\n"; // CSS to avoid problems with the K2/com_content columns on the smaller screens $this->API->addCSSRule('@media screen and (max-width: '.($tablet_width * 0.75).'px) { #k2Container .itemsContainer { width: 100%!important; } .cols-2 .column-1, .cols-2 .column-2, .cols-3 .column-1, .cols-3 .column-2, .cols-3 .column-3, .demo-typo-col2, .demo-typo-col3, .demo-typo-col4 {width: 100%; } }');

and replace it with :

Code: Select all: if($this->API->get('rwd', 1)) { // set media query for small desktops echo '<link rel="stylesheet" href="'.($this->API->URLtemplate()).'/css/small.desktop.css" media="(max-width: '.$template_width.'px)" />' . "\n"; // set media query for the tablet.css echo '<link rel="stylesheet" href="'.($this->API->URLtemplate()).'/css/tablet.css" media="(max-width: '.$tablet_width.'px)" />' . "\n"; // set media query for the small tablets echo '<link rel="stylesheet" href="'.($this->API->URLtemplate()).'/css/small.tablet.css" media="(max-width: '.$tablet_small_width.'px)" />' . "\n"; // set media query for the mobile.css echo '<link rel="stylesheet" href="'.($this->API->URLtemplate()).'/css/mobile.css" media="(max-width: '.$mobile_width.'px)" />' . "\n"; // CSS to avoid problems with the K2/com_content columns on the smaller screens $this->API->addCSSRule('@media screen and (max-width: '.($tablet_width * 0.75).'px) { #k2Container .itemsContainer { width: 100%!important; } .cols-2 .column-1, .cols-2 .column-2, .cols-3 .column-1, .cols-3 .column-2, .cols-3 .column-3, .demo-typo-col2, .demo-typo-col3, .demo-typo-col4 {width: 100%; } }'); }