SqueezeBox Big

This huge stack is for those wanting much bigger accordions in your Stacks pages. We have had to move the titles to HTML inputs in the edit screen as opposed to making the longest Stack HUD in history! Text input will work fine, any more 'creative' choices you can try, but at your own risk.

Checking the HUD you will see options to hide 4 choices of 'layers' (or Squeezes).

Hide Layer 7

Hide Layers 8-9 (2 layers at once)

Hide Layers 10-13 (4 layers at once)

Hide Layers 14-21 (8 layers at once)

Using combinations of these you can have anywhere from 6 to 21 layers in use. Please remember to check which layers you are hiding and which layers you are entering content into, we don't want your content ending up hidden!!

Title 1 (about SqueezeBox Big)

A quick demo of all 21 layers in action. To reduce to the correct number, you hide combinations of 1, 2, 4 and 8 layers, just be careful to populate the correct ones so you don't hide your content. We also recommend turning off the rendering of the html in edit mode.

Title 2 (info about titles)

We have had to change how the titles are input in this stack. SqueezeBox Big would have had the most enormous HUD had we kept the title dialogues in there. We had to switch to using HTML inputs in the edit screen. Keeping it to text is very safe, experiment at your own risk!

Title 3

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet.

Title 4

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet.

Title 5

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet.

Title 6

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet.

Title 7

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet.

Title 8

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet.

Title 9

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet.

Title 10

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet.

Title 11

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet.

Title 12

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet.

Title 13

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet.

Title 14

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet.

Title 15

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet.

Title 16

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet.

Title 17

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet.

Title 18

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet.

Title 19

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet.

Title 20

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet.

Title 21

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet.

Any minor updates to these Stacks will not be chargeable updates. We will be uploading some supporting screencasts soon, when we are sure they won't get quick changes. TheTabStacks are FREE Stacks. If you are feeling particularly generous, I won't say no to a donation, but perhaps just buy the Squeezebox to go with it them?!! Please enjoy these Stacks, and let us know how we can make them better.

DOWNLOAD THE TAB STACKS HERE!
Place these in the folder
Home/Library/Application Support/RapidWeaver/Stacks/

Buy SqueezeBox for $5US by clicking the add to cart button below!
Add to Cart



Buy SpaceGallery for $5US by clicking the add to cart button below!
Add to Cart



Buy both the above Stacks for $8US by clicking the add to cart button below!

Using jQuery Theme Roller

TabStacks and SqueezeBox use jQuery's Theme Roller styling files, but to use your own, you will need to get your hands dirty! A little time on their site and download your theme. Then copy the contents of the folder inside the CSS folder and place them inside one of the tabstack-theme or accstack-theme folders inside the Resources folder in the Stacks to replace what was there to begin with. You can also go into the images folder you just copied and remove the icon images if you wish, they aren't needed. There will be a screencast soon to detail the use of Theme Roller with the TabStack and Squezzebox Stacks. I will also be putting up a list of CSS selectors for any extra styling requirements.

Not getting what you need?

TabLoom has a lot of flexibility and supports Theme Roller settings to change the styling of the tabs and text. It also has many options with regards to things like how the content transitions between tabs. This is beyond our humble Stacks, so if you aren't getting all the power you need, why not try TabLoom and use Pluskit to import it?

Accordion from Yourhead can also be used with Pluskit, and being from a different javascript library, will work/clash with different things than Squeezebox. It is also fully fluid, where Squeezebox stays at the height of the largest content inserted in a sector.