T3 Community Discussion & Support

Let's build the best free Joomla template framework, together!
  1. Zdeněk Štěpánek
  2. Sherlock Holmes
  3. General Discussion
  4. Thursday, 13 March 2014
  5.  Subscribe via email
Hello.
I have a menu on the left sidebar-1 position, but when you view the mobile version, the menu goes below the content . I need the left menu to be on top in mobile view.
I do not want to use subitems in horizontal menu, but on the sidebar-1 position. In mobile view below the main items and on top of the main content.

How can I achieve that.

I know how to code in CSS, but don't know the JavaScript

Here is my example:
http://hrotovice.enext.cz/zamek-valec
Comment
There are no comments made yet.
Accepted Answer Pending Moderation
0
Votes
Undo
For t3_bs3.

The controllers of the block are pull and push. I made this block for sidebar 1 and sidebar 2 above of content, being one beside the other on the tablets, but you can change this sidebar 1 ( leave with width 12) above sidebar and sidebar 2 (leave with width 12) above the content. I've ridden blocks mainbody of these two ways.

http://t3-framework.org/discussions/here-s-a-mainbody-block-with-sidebar-1-and-2-before-content-on-mobiles-and-tablets.html

Friend, could you tell me which componete you used in this page for customers do make reservations? I liked.

http://hrotovice.enext.cz/rezervace-sport-v-hotel-hrotovice
  Resende - Rio de Janeiro, Brazil
Visit 
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 1
Accepted Answer Pending Moderation
0
Votes
Undo
I dont understand what you mean. The component is RS form pro.
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 2
Accepted Answer Pending Moderation
0
Votes
Undo
Gift for you. I Created this mainbody block according to what you need, because it may be useful to me in future also.

Below is the code to the construction of block, be sure to create a proper name for the block. Ex: my-custom-block-mainbody

This is code for t3_blank to bootstrap 2


<?php
/**
* @package T3 Blank
* @copyright Copyright (C) 2005 - 2012 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

/**
* Mainbody 3 columns, content in right, mast-col on top of 2 sidebars: sidebar1 - sidebar2 - content
*/
defined('_JEXEC') or die;
?>

<?php

// Layout configuration
$layout_config = json_decode ('{
"two_sidebars": {"default" : [ "span6 " , "span3 " , "span3" , "span6" ],
"wide" : [],
"xtablet" : [ "span12 pull-right" , "span6 " , "span6" , "span12spanfirst " ],
"tablet" : [ "span12" , "span6 spanfirst" , "span6" , "span12" ]
},
"one_sidebar": {
"default" : [ "span3 pull-left" , "span3 " , "span9" ],
"wide" : [],
"xtablet" : [ "span4 " , "span4" , "span8" ],
"tablet" : [ "span12" , "span12 spanfirst" , "span12" ]
},
"no_sidebar": {
"default" : [ "span12" ]
}
}');

// positions configuration
$mastcol = 'mast-col';
$sidebar1 = 'sidebar-1';
$sidebar2 = 'sidebar-2';

// Detect layout
if ($this->countModules($mastcol) or $this->countModules("$sidebar1 and $sidebar2";)) {
$layout = "two_sidebars";
} elseif ($this->countModules("$sidebar1 or $sidebar2";)) {
$layout = "one_sidebar";
} else {
$layout = "no_sidebar";
}

$layout = $layout_config->$layout;

$col = 0;
?>

<div id="t3-mainbody" class="container t3-mainbody">
<div class="row">


<?php if ($this->countModules("$sidebar1 or $sidebar2 or $mastcol";)) : ?>
<div class="t3-sidebar <?php echo $this->getClass($layout, $col) ?>" <?php echo $this->getData ($layout, $col++) ?>>
<?php if ($this->countModules($mastcol)) : ?>
<!-- MASSCOL 1 -->
<div class="t3-mastcol t3-mastcol-1<?php $this->_c($mastcol)?>">
<jdoc:include type="modules" name="<?php $this->_p($mastcol) ?>" style="T3Xhtml" />
</div>
<!-- //MASSCOL 1 -->
<?php endif ?>

<?php if ($this->countModules("$sidebar1 or $sidebar2";)) : ?>
<div class="row">
<?php if ($this->countModules($sidebar1)) : ?>
<!-- SIDEBAR 1 -->
<div class="t3-sidebar t3-sidebar-1 <?php echo $this->getClass($layout, $col) ?><?php $this->_c($sidebar1)?>" <?php echo $this->getData ($layout, $col++) ?>>
<jdoc:include type="modules" name="<?php $this->_p($sidebar1) ?>" style="T3Xhtml" />
</div>
<!-- //SIDEBAR 1 -->
<?php endif ?>

<?php if ($this->countModules($sidebar2)) : ?>
<!-- SIDEBAR 2 -->
<div class="t3-sidebar t3-sidebar-2 <?php echo $this->getClass($layout, $col) ?><?php $this->_c($sidebar2)?>" <?php echo $this->getData ($layout, $col++) ?>>
<jdoc:include type="modules" name="<?php $this->_p($sidebar2) ?>" style="T3Xhtml" />
</div>
<!-- //SIDEBAR 2 -->
<?php endif ?>
</div>
<?php endif ?>
</div>
<?php endif ?>


<!-- MAIN CONTENT -->
<div id="t3-content" class="t3-content <?php echo $this->getClass($layout, $col) ?>" <?php echo $this->getData ($layout, $col++) ?>>
<jdoc:include type="message" ></jdoc:include>
<jdoc:include type="component" ></jdoc:include>
</div>
<!-- //MAIN CONTENT -->





</div>
</div>



---------------------------------------------------------

In t3-blank to bootstrap 2, the controllers of block are pull-right and pull- left, as you can see.


Enjoy friend.
  Resende - Rio de Janeiro, Brazil
Visit 
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 3
Accepted Answer Pending Moderation
0
Votes
Undo
Substitute ;) por " ) . But do not leave space between them, It's here is being interpreted as a face puppet.
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 4
Accepted Answer Pending Moderation
0
Votes
Undo
Thank you Igor
I wil test it. I own you a gift in return.;)
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 5
Accepted Answer Pending Moderation
0
Votes
Undo
I changed this excerpt. Xtablet got better now.


"one_sidebar": {
"default" : [ "span3 pull-left" , "span3 " , "span9" ],
"wide" : [],
"xtablet" : [ "span4 " , "span4" , "span8" ],
"tablet" : [ "span12" , "span12 spanfirst" , "span12" ]
},




"xtablet" : [ "span4 pull-left" , "span4" , "span4" ],


by

"xtablet" : [ "span4 " , "span4" , "span8" ],



Make a test :

http://mattkersley.com/responsive/


In the article I wrote for testing, I had to add a code snippet to maintain with equal side margins, added in custom.css.

@media(min-width:599px) and (max-width:767px){
.clearfix{
margin-left: -15px;
margin-right:15px;
}
}
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 6
  • Page :
  • 1


There are no replies made for this post yet.
However, you are not allowed to reply to this post.