jQuery Plugins Που Θα Σας Βοηθήσουν Να Προσαρμόσετε Το Search Box




Το πλαίσιο αναζήτησης είναι ένα σημαντικό στοιχείο του χώρου και για ορισμένες ιστοσελίδες, είναι το πιο χρησιμοποιημένο.
Συχνά παραβλέπεται ακόμα κι αν αυτό είναι πραγματικά χρήσιμο για τον επισκέπτη. Όταν δεν το παραμελούμε μπορούμε να το προσαρμόσουμε στις ανάγκες του χώρου με οπτικά στοιχεία και πολύ καλή κωδικοποίηση.
Μπορεί να είναι απλό μόνο προσαρμογές στο σχεδιασμό, αλλά με τη βοήθεια  jQuery plugins μπορεί να γίνει αρκετά πιο περίπλοκο και να προσφέρει πολλές επιπλέον λειτουργίες που κάνει την αναζήτηση ευκολότερη. Η Παράδοση αυτού που ψάχνει ο επισκέπτη σας, είναι πολύ σημαντικό και θα πρέπει να κάνετε αυτή τη λειτουργία ευκολότερη για αυτούς.
Παρακάτω θα δούμε μερικά από τα καλύτερα jQuery Plugins για search box που θα μας βοηθήσουν να το προσαρμόσουμε βάση των αναγκών μας.

Ajax AutoComplete for jQuery

Ajax AutoComplete for jQuery
Το Ajax Autocomplete για jQuery σας επιτρέπει να δημιουργήσετε εύκολα autocomplete / autosuggest κουτιά για τα πεδία εισαγωγής κειμένου. Χτισμένο με έμφαση στην απόδοση – τα αποτελέσματα για κάθε ερώτημα είναι cached και τραβιούνται από την τοπική μνήμη για το ίδιο repeating query. Εάν δεν υπάρχουν αποτελέσματα για το συγκεκριμένο ερώτημα,  η αποστολή αιτημάτων στο διακομιστή για άλλα ερωτήματα με την ίδια ρίζα, σταματάει.

Ένα fancy Apple.com-style search suggestion

A fancy Apple.com-style search jQuery plugin

Search Box με Filter και μεγάλο Drop Down Menu

Search Box with Filter and Large Drop Down Menu
Θα σας δείξει κάποια στοιχεία UI: ένα πλαίσιο αναζήτησης με φίλτρο και ένα μεγάλο drop down μενού. Θα χρησιμοποιήσουμε jQuery στα δύο στοιχεία για το αποτέλεσμα. Θα χρησιμοποιήσουμε επίσης την αφθονία των CSS3 ιδιοτήτων για να δημιουργήσουμε λεπτομέρειες.

Ajax-Driven JavaScript ComboBox with Autocomplete

Ajax-Driven JavaScript ComboBox with Autocomplete Plugin
Το dhtmlxCombo είναι ένα cross-browser JavaScript combobox με autocomplete χαρακτηριστικά. Επεκτείνει τις βασικές λειτουργίες select box και παρέχει τη δυνατότητα να εμφανίζει τις προτάσεις, ενώ ένας χρήστης πληκτρολογεί στο πεδίο κειμένου.

AutoSuggest: An AJAX auto-complete text field

AutoSuggest: An AJAX auto-complete text field
Η AutoSuggest class προσθέτει ένα popdown μενού προτεινόμενων τιμών σε ένα πεδίο κειμένου. Ο χρήστης μπορεί είτε να κάνετε κλικ απευθείας σε μια πρόταση για να εισέλθει στο χώρο, ή να πλοηγηθεί στην λίστα χρησιμοποιώντας το πάνω και κάτω βέλος, επιλέγοντας μια τιμή χρησιμοποιώντας το πλήκτρο tab. Οι τιμές για το  suggestion list παρέχονται ως XML (από ένα PHP script, ή κάτι παρόμοιο).

Creating Next Level Search Form Using jQuery & CSS3

Creating Next Level Search Form Using jQuery & CSS3
Σε αυτό το tutorial θα δούμε πως να δημιουργήσουμε φόρμες αναζήτησης, χρησιμοποιώντας jQuery και CSS3.

jQuery Plugin for On-demand Search Box: SearchMeme

jQuery Plugin for On-demand Search Box: SearchMeme
SearchMeme – η ιδέα είναι να παρέχει ένα μικρό κουμπί αναζήτησης που μπορεί να τοποθετηθεί οπουδήποτε στην ιστοσελίδα (μπορεί να θέλετε να το βάλετε στο header σας). Κάνοντας κλικ στο κουμπί αναζήτησης επεκτείνεται για να δείξει ένα πλαίσιο κειμένου όπου μπορείτε να πληκτρολογήσετε τους όρους αναζήτησης.

AutoCompleter Tutorial – jQuery(Ajax)/PHP/MySQL

AutoCompleter Tutorial – jQuery(Ajax)/PHP/MySQL

jQuery Autocomplete

jQuery Autocomplete

jQuery Smooth Animated Search Field Freebie

jQuery Smooth Animated Search Field Freebie

jQuery Autocomplete Mod

jQuery Autocomplete Mod

Tipue Search, a jQuery site search engine

Tipue Search, a jQuery site search engine

AutoCompleter

AutoCompleter jQuery search plugin
Αυτό το  AutoCompleter script για MooTools παρέχει χαρακτηριστικά για text suggestion και completion. Διαθέτει διάφορες πηγές δεδομένων (τοπική, JSON ή XML), μια ποικιλία αλληλεπιδράσεων χρηστών, προσαρμοσμένη μορφοποίηση, πολλαπλή επιλογή, κινούμενα σχέδια και πολλά ακόμα.

FCBKcomplete

FCBKcomplete jQuery search plugin

jQuery JSON Suggest/Search Box: JSON powered auto suggest box implemented as a jQuery plugin

jQuery JSON Suggest/Search Box: A JSON powered auto suggest box implemented as a jQuery plugin

Smart Suggest — Advanced Auto-Complete

Smart Suggest — Advanced Auto-Complete jQuery Search Plugin
Το Smart Suggest είναι ένα εντυπωσιακό search suggestion plugin για jQuery (μοιάζει στο site search της Apple). Το Smart Suggest πηγαίνει το auto-complete ένα βήμα πιο πέρα.

SearchBox

Search Box jQuery plugin
Το SearchBox είναι ένα jQuery plugin που σας επιτρέπει να έχετε πλούσια αποτελέσματα αναζήτησης με filters στην σελίδα σας (παρόμοια με το GMail και το Google Docs).

Simple Content Search

Simple Content Search
Αυτό το plugin δημιουργεί ένα απλό ταξινομητή περιεχομένου. Το Simple Content Sorting παρέχει ένα καθαρό και εύκολο τρόπο για να ομορφύνει το περιβάλλον σας, παρέχοντας ένα μηχανισμό διαλογής. Δεν γίνεται φόρτωση της σελίδας, όταν γίνετε η διαλογή μιας και όλα γίνονται με javascript.

5 σχόλια:

  1. Θα ήθελα να αναζητώ μόνο τους τίτλους. Διάβασα το άλλο άρθρο που έχετε αλλά δεν βρέθηκε ο κώδικας που λέτε στο πρότυπο. Έχετε καμιά ιδέα για να αλλάξω τον κώδικα στο search και να ψάχνει μόνο στους τίτλους του blog μου? Ευχαριστώ πολύ!!! καλή συνέχεια στο υπέροχο site που το συμβουλεύομαι πολύ!

    ΑπάντησηΔιαγραφή
    Απαντήσεις
    1. Κανε κλικ πάνω στις εικόνες για να μπεις στης σελίδες που έχουν κατασκευάσει αυτές της αναζήτησης!

      Αν δεν κάνω λάθος χρησιμοποιείς την πλατφόρμα wordpress?

      Διαγραφή
    2. Τώρα ξεκίνησα τα πρώτα μου βήματα στον προγραμματισμό με php και mysql. Και εκεί έχω καταφέρει κάτι. Στο προσωπικό μου site χρησιμοποιώ wordpress. Εγώ θα ήθελα να βάλω ένα search engine σε ένα blogspot το οποίο να κάνει αναζήτηση μόνο στους τίτλους των άρθρων και όχι στο περιεχόμενο. Αν βρεις κάτι και θέλεις να το μοιραστείς, ευχαριστώ εκ των προτέρων!

      ΣΝ

      Διαγραφή
    3. Δεν έχω βρει κάτι τέτοιο για δες αυτό http://foulscode.blogspot.gr/2013/02/blog-post_6439.html

      Διαγραφή
    4. ok! για την ώρα δεν έχω λύσει το πρόβλημα... πιστεύω πάντως ότι θα βρω μια λύση!

      Διαγραφή

Εγγραφείτε για να λαμβάνετε τις σημαντικότερες ειδήσεις της ημέρας