Discover how idsign stacks
makes web designing easier

Just visit our stacks page on this site.You’ll get a brief description of what each stack can do. Click on „Stacks Manuals” - choose a stack and you’ll see a detailed manual (examples included). If a problem occurs while designing your website, please first visit our support page for the answer.

iDSIGN Box Toggler stack: makes webdeveloping easier

Stacks Image 1162

You can use this stack to toggle between Box blocks. For example when you have a large page with different items/blocks you can just click on a button to sellect all blocks with the same id. Or just use it to give more information about a product. It's a very flexible stack - once you understand how it works you can create beautiful Box Toggler pages on your site in no time. How does it work: Just drop the Box Toggler stack and some box blocks on a page -> insert the box navigator or make your own navigation buttons/text/image links. Make your design inside the Box Blocks stack

Hover this screenshots and click on the items you would like more information about
BoxToggler View:
No blocks
Choose this feature if you don't want to see any blocks apearing on page enter.
First blocks
This feature will show you the first blocks (blocks you append to button 1)
All blocks
Can be used in order to see all the blocks (on page visit)
First button:
Active / Not Active
This feature only works if you use the standard "Box Toggler Navigator" or the "Navigator" stack. It sets the first button into an active state (on page visit)
Radius Bottom
Defines the radius (round corners) from the content block (on the bottom)
Radius TitleBlock
Defines the radius (round corners) from the Title block (on the top)
Title Radius
If you want to use a radius around the Title Block, you can choose to do it on 2 (top) corners or all 4.
Border Width
Defines the tickness from your border (set to 0 if you don't want to see any border)
Border Color
Define the color from your border.
Border
All Sides
= border on all sides
Bottom
= border only at the bottom from your content block
Block Shadow
Show or hide the small drop shadow around your blocks.
Title Block
Show or Hide the complete Title Block (text and gradient colors)
Other settings
just try these featues and see what has changed on your web page
Scroll to position
Enable and set the position to scroll to if you click on your link to open your Box Toggler Blocks
Buttons
Choose the amount of buttons. Each button needs at least 1 box toggler block assigned to this button
Button Height
Define the height from your buttons
Vertical Menu
Choose vertical menu if you want your buttons beneath each other
Color settings
Define the color settings from your button and text (normal and current state)
Text settings
Choose capitals or not and define if you want the font to be bold.
Other settings
just try these featues and see what has changed on your web page
Append to button
You can link each block to a button. If you use the "Box Toggler navigator "or "navigator" stack the counting start at 1 (so 1= button1)
ATTENTION!
If you use a homemade button the counting start at 0 (so in this case 0 = the first button). This is important if you make your settings inside the RW linkpanel. More information see: "Trigger your blocks"
Link / Block link
(Read attentively)

You can only link a block to an url (example: http://www.google.com) with no other settings or to another RW page. So if you click on this block (don't forget to enable pointer and hover transparency) your url will open. Choose "self" if you want it to open inside the same window or "blanc" if you want to open a new window.

You cannot trigger a lightbox or other stuff !!!
What you can do in this case is, for instance :drop an image inside a Box Block and link this image to trigger a lightbox
Enable Pointer
Mark this checkbox if you set a link on your block
Hover Transparency
Hover transparency lightens the background color or image with 70% (The image will lighten depending the value you set on "Bgr Color Transp.", the image itself remains at 100%)
Box Block Height
Enable or disable (=Fluid height) Box Block Heigh. If you choose Enabled you can set a value for the Block Height (ex. 200px)
Background Color and settings
Choose Transparent, semi Transparent (use together with "Bgr Color Transp." ro choose Full color (=100% color - no transparency)
Background Img
Choose a background image and define if you want to repeat it or not. The position from the innitial image is left-top
Title Block Gradient color
IDefine the main color and gradient color from the title block
Other settings
just try these featues and see what has changed on your web page

Trigger a Box Toggler Block

First drop on your page a couple of Box Toggler blocks and append them to a (virtual) button. Click on a block and define the first group of blocks to button 1 (SEE HUD "App. to button"). Do the same for your second group of blocks and so on. Now: add a link to a text or image with the build-in RapidWeaver link inspector and create a button with the following settings: SETTINGS FIRST BUTTON.
Repeat this as many times as you want. So if you want to trigger a second group of blocks use the same settings but change the id inside the RW link window, example: SETTINGS SECOND BUTTON
If you want to trigger all blocks with only one click (View All) use following settings: TRIGGER ALL BLOCKS