Layout Panel

After going into the Layout module, you will see a Layout panel at the top of the page. This panel follows you around until you close it. The Layout panel lets you control the type and position of the boxes in your theme. It also lets you control which theme your site uses.

If you don't like the position of a box on your page, you can change it by click the On link. After you do this, you will see a series of arrows on the top left corner and bottom right corner of each box. These are what you will click to move the boxes.

Before trying this however, lets talk about the structure of your page. Theme layouts are arranged in quadrants. The quadrants are (usually) in a ticktacktoe pattern. Each quadrant is a theme variable.

Now if you look next to the arrows you will see a series of numbers separated with colons, like so: 2:1:2. The first number in our code is the column. The second number is the row. The third number is the queue order.

We will get to the third number in a moment, but first lets look at the first two numbers. Here are out quadrant codes with the default theme variables in parenthesises:

So if we look at our example above (2:1:2) we can see that a box with this number is in the second column, first row.

Now lets look at the third number. That is the box queue. Each quadrant can hold several boxes. These boxes need to be ordered as well. So using the code, we would know that the box is in the second (2) queue position. This means there is one box above the 2:1:2 box. This does not mean you will always see that box however. The visibility of a box depends upon what module is running, what page is being visited and other factors.

Now back to box moving. Let's look at the top left series of arrows. The first one is a single up arrow. If I click it, that box will move up in the queue. Our 2:1:2 box would then be 2:1:1. Since our box would be at the top the queue, clicking the single arrow again would send it to the next row. Since 2:1:1 is the top row, this would actually wrap the box to the bottom row. So 2:1:1 would now be 2:3:5. Why is the last number five? Because there are already four other boxes in that quadrant. The single down arrow in the lower right corner of the box does exactly the opposite.

The next arrow at the top left is a single arrow pointing to the left. This sends the box to the left. So our 2:3:5 box would then be in quadrant 1:3:7. Anytime a box is sent to a new quadrant, it is placed at the end of the box queue. The single right arrow in the lower right corner moves the box to the right.

Finally you will notice the double arrow pointing up or down. Clicking this tells Layout to send the box to the front or bottom of the queue line. So if our box is in the 1:3:7 position and I click the double up arrow, it will be transferred to the 1:3:1 position. Clicking the double down arrow would send it where? That is correct! To the 1:1:5 position. Why? Because the 1:3:7 is the end of the queue. Remember when we moved it from the right? Since it is at the end of the queue it would wrap from the bottom back to the top quadrant. Since it is in a new quadrant, it is put at the bottom of the queue.

Confused yet? It will make more sense when you start clicking on the arrows. Click on the Off link when you are done.