Annonce ToutSurTout

Bienvenue sur toutsurtout.biz

Déjà 15 ans !

Radio TST

Si vous souhaitez participer vous aussi aux discussions sur le forum, il faut vous inscrire ou vous identifier.

Le Thème TST Automne est maintenant en place.

Les inscriptions sont actuellement OUVERTES.

Message 1 Discussion postée le 09-07-2013 à 19:15:41

Philippe
Avatar de Philippe


Titre: Banni
Avancement: Niveau 3
Date d'inscription: 26-09-2009
Messages: 3 660

Tipue Search & Drop: 2 plugins jQuery pour des recherches avancées

Tipue Search et Tipue Drop sont deux plugins jQuery permettant de faire des recherches avancées sur vos sites web avec style.

https://www.world-lolo.com/images/uploads/image.num1373388167.of.world-lolo.com.bmp

Tipue Search, dans un premier temps, est un plugin jQuery permettant de mettre en place un moteur de recherche qui consomme du JSON ou une liste de pages de contenu HTML.

Pratique si vous disposez d'un site web avec du contenu plus ou moins statique et que vous ne souhaitez pas mettre en place de moteur de recherche plus lourd comme Elasticsearch, Lucene ...

Vous générez votre JSON de manière statique ou dynamique à partir de votre contenu :



var tipuesearch = {"pages": [
     {"title": "Tipue Search, a site search engine jQuery plugin", "text": "Tipue Search is a site search engine jQuery plugin. Tipue Search is open source and released under the MIT License, which means it's free for both commercial and non-commercial use. Tipue Search is responsive and works on all reasonably modern browsers.", "tags": "JavaScript", "loc": "http://www.tipue.com/search"},
     {"title": "Tipue drop, a search suggestion box jQuery plugin", "text": "Tipue drop is a search suggestion box jQuery plugin. Tipue drop is open source and released under the MIT License, which means it's free for both commercial and non-commercial use. Tipue drop is responsive and works on all reasonably modern browsers.", "tags": "JavaScript", "loc": "http://www.tipue.com/drop"},
     {"title": "About Tipue", "text": "Tipue is a small web development studio based in North London. We've been around for over a decade. We like minimalism with the occasional hint of retro.", "tags": "", "loc": "http://www.tipue.com/about"}
]};

Puis vous appelez le script sur l'input permettant la recherche :



$(document).ready(function() {
     $('#tipue_search_input').tipuesearch();
});

https://www.world-lolo.com/images/uploads/image.num1373388377.of.world-lolo.com.bmp

Les résultats sont bien évidemment personnalisables pour une intégration adaptée à votre webdesign.

Le mode "live" quant à lui permet de définir une liste de pages dans lesquelles le script va devoir aller chercher le contenu :



var tipuesearch_pages = ["http://foo.com/", "http://foo.com/about/", "http://foo.com/blog/", "http://f

Le contenu n'est pas indexé, donc il est possible que le temps de recherche soit plutôt long si vous avez des centaines de pages... Préférez dans ce cas un vrai moteur de recherche comme Elasticsearch, Sphinx ...

https://www.world-lolo.com/images/uploads/image.num1373388584.of.world-lolo.com.bmp

Site Officiel


https://www.world-lolo.com/images/uploads/image.num1445754529.of.world-lolo.com.jpg
Des stades aux entrées payantes sont pleins de gens qui pensent que ceux qu'ils applaudissent sont trop payés, et les bibliothèques à l'entrée gratuite sont vides des gens qui pensent que les livres sont trop chers ...