Home
Products
Grids
Blog
Support
Donate
About
   

Tipue Slide

Download   Demo
V. 1.1
Tipue Slide. A sliding panel site search jQuery plugin. It's free, open source and fast.
Tipue Slide is a search engine for your site or app. It only needs a browser that supports jQuery, and it doesn't need MySQL or similar. Tipue Slide is free and open source.
Enter tipue or blog in the demo.

Tipue Slide is free for both commercial and non-commercial use. It doesn't show advertising or branding.

Getting started

Copy the Tipue Slide folder to your site and include the following in the <head> section of your page.
HTML
The first line loads normalize.css, a library that forces browsers to render elements more consistently. This is recommended, but optional. The second line loads jQuery. Then the Tipue Slide content, CSS and jQuery code are loaded.

Add the following directly after the <body> element in your page.

HTML
Call the .tipueslide() method. Add this towards the end of the page.
HTML
To display Tipue Slide, add the tipue-slide-toggle class to any element.
HTML

Content for Tipue Slide

Tipue Slide uses a simple JavaScript object for content. The search data is contained in the tipueslide object, and this is usually stored in the tipueslide_content.js file.
JS
Note that the last record doesn't end with a comma. Some characters may need to be escaped, such as " or \. These should be preceded with a backslash.

A JavaScript object has properties. These can be seen as variables attached to the object. Or you can see properties as fields in a database.

You can store the tipueslide JavaScript object in any file, or even not in a file. The Tipue Slide script just has to have access to the tipueslide object.

The tipueslide object properties

title

The title of the page. This is a required value.

text

Some content of the page, and a required value.

img

The url of an image that will display in the search result. This can be a full or partial url, and the only value that isn't mandatory.

url

The url of the page. This can be a full or partial url. Required.

Options

The options for Tipue Slide are set as arguments in the .tipueslide() method.
HTML
chars

The number of characters in the search before the results display. The default is 3.

newTab

The search result opens in a new browser tab if set to true. The default is false.

show

The number of results displayed. The default is 6.

speed

The speed the results display, in milliseconds. The default is 300.

Appearance

The look of Tipue Slide is set entirely via CSS.

Browsers, support

Tipue Slide works with Chrome 49+, Edge 16+, IE11, Firefox 58+, Safari 11+, iOS Safari 10.3+, Chrome for Android 66+, Samsung Internet 4+ and most recent browsers.

We offer a range of flexible support plans, including free.