Search and Find Stack

With this Stack you are able to bring your visitors an easy way to search your site for the keywords you provide. All you need to do is set up any number of results with label and description. Search and Find Stack does the rest for you and displays results while the visitor types his query into an input field.

Mobile Device Compatibility

Responsive Dialog Stack works flawlessly on your mobile device. You are able to set up the widths of the elements either in a absolute pixel values or relative percentage values.

Example

Label (searchable):

Add a link to the label in order to redirect a click on a result to a specific page.

Description:

This text will appear in addition to the label as a description.

Sexy images

Icon:

Optionally you can add an image as icon

Stacks Image 27155

Label (searchable):

Add a link to the label in order to redirect a click on a result to a specific page.

Description:

This text will appear in addition to the label as a description.

Expand hidden content

Icon:

Optionally you can add an image as icon

Stacks Image 27160

Label (searchable):

Add a link to the label in order to redirect a click on a result to a specific page.

Description:

This text will appear in addition to the label as a description.

To switch content stands for flexibility. With Content Switcher Stack you can define several parts of your page that should be able to be switched. Switch a language, switch the content, switch to another styled stack or to whatever you can imagine.

Icon:

Optionally you can add an image as icon

Stacks Image 27165
Try entering words like „content“ or „stack“

Settings

    Highlight Color: Background color of a highlighted menu item
    Menu item margin: Margin around every menu items text in px

Search and Find - Input field

    Width: Set up the width of the input field
    Width unit: inputs' width unit (% or px)
    Height: Set up the height of the input field in px
    Font Size: inputs' font size
    Padding: inputs' padding
    Border Size: inputs' size of the border in px
    Border Color: inputs' color of the border
    Border Style: inputs' style of the border (solid, dashed, dotted)

Search and Find - Header

    Bold: Bold text style
    Italic: Italic text style
    Underline: Underline text style
    Font Size
    Color: Text color of description

Search and Find - Description

    Bold: Bold text style
    Italic: Italic text style
    Underline: Underline text style
    Font Size
    Color: Text color of description

Infos and Requirements

Rapidweaver
Rapidweaver 5/6/7
Stacks 2 only
Stacks 2.1.8
Responsive
Compatible to
responsive themes
Internet
Internet connection
for preview

How To

    Simply drag and drop the "Search and Find - Base" Stack onto your page
    Drag and drop any number of Search and Find Result Stacks into the previously dropped "Search and Find" base Stack

Downloads

Stacks Image 6044

Download Project File

Browser Compatibility

  • Safari
  • Chrome
  • Opera
  • Internet Explorer 8+
  • Firefox
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.

Cancel OK