Comment améliorer un plugin « Rechercher » sur Site Web.

  • Créateur du sujet Créateur du sujet HenryP
  • Date de début Date de début
HenryP

HenryP

Membre actif
9 Juin 2012
922
11
Bonjour,
Sur mon Site, j'utilise l'extension « Rechercher » à partir d'un widget natif de Wordpress.
Ce plugin n'est pas assez sélectif, les résultats de la recherche sont vagues, dispersés et ne correspondent pas au fichier recherché.
L'URL de mes fichiers (environ 2000), démarre par un chiffre et quelques fois par un mot.
Je ne sais pas si c'est possible de créer un code CSS ou autre pour affiner la sélection à ces seules données « Chiffres et mots ».
Merci à qui peut m'apporter une aide éventuelle.
 
  • J’aime
Réactions: Apple.Geek
Un user-script JS, via TamperMonkey ou GreaseMonkey ?

Avec un peu de connaissance HTML et CSS (et jQuery éventuellement), il doit être possible de filtrer avec un pattern d'URL coté browser web le résultat renvoyé par le serveur.
 
byte_order a dit:
Un user-script JS, via TamperMonkey ou GreaseMonkey ?

Avec un peu de connaissance HTML et CSS (et jQuery éventuellement), il doit être possible de filtrer avec un pattern d'URL coté browser web le résultat renvoyé par le serveur.
Cliquez pour agrandir...
Bonjour,
Merci pour ta réponse, juste que je ne sais pas faire ça. Si tu peux développer en allant "beaucoup plus loin" dans tes explications...
À + si tu veux bien.
 
HenryP a dit:
Bonjour,
Merci pour ta réponse, juste que je ne sais pas faire ça. Si tu peux développer en allant "beaucoup plus loin" dans tes explications...
À + si tu veux bien.
Cliquez pour agrandir...

Les user-scripts sont des scripts écrits en Javascript qui, grace ) TamperMonkey ou GreaseMonkey, s'exécutent dans le contexte d'une page web particulière (selon une règle de filtrage définissable).
Ils ont donc accès au contenu de la page comme un code Javascript inclu dans la page, et peuvent donc également le modifier dynamiquement.

Par exemple, un tutoriel :
https://medium.freecodecamp.org/applying-javascript-user-scripts-2e505643644d

Evidement, pour cela il faut savoir programmer un peu en Javascript.

Mais la mécanique serait assez similaire à celui de ce tutoriel :
- on attend que le document (la page web, quoi) soit complètement chargé
- quand c'est le cas, on cherche des éléments HTML particuliers, qui encadrent chacun des résultats affichés (que ce soit une balise <li>, une <div> avec un nom particulier, etc, jQuery est très puissant pour cela, mais pour connaitre quels éléments cherché, il faut examiner le code source de la page, comme d'ailleurs montré dans le tutoriel
- sur ces éléments, on applique un filtre "URL commençant par un chiffre ou un mot"
- pour les éléments ne passant pas le filtre, on les retire, en appellant .remove() dessus par exemple.

Mais sans connaitre le format précis de votre page affichant le résultat de votre recherche, difficile de vous aider plus.

Si vous pouvez poster ici un exemple de "source de la page" de résultat que vous voulez améliorer, je pourrais probablement aider nettement plus, voir écrire un tel script.
 
byte_order a dit:
Les user-scripts sont des scripts écrits en Javascript qui, grace ) TamperMonkey ou GreaseMonkey, s'exécutent dans le contexte d'une page web particulière (selon une règle de filtrage définissable).
Ils ont donc accès au contenu de la page comme un code Javascript inclu dans la page, et peuvent donc également le modifier dynamiquement.

Par exemple, un tutoriel :
https://medium.freecodecamp.org/applying-javascript-user-scripts-2e505643644d

Evidement, pour cela il faut savoir programmer un peu en Javascript.

Mais la mécanique serait assez similaire à celui de ce tutoriel :
- on attend que le document (la page web, quoi) soit complètement chargé
- quand c'est le cas, on cherche des éléments HTML particuliers, qui encadrent chacun des résultats affichés (que ce soit une balise <li>, une <div> avec un nom particulier, etc, jQuery est très puissant pour cela, mais pour connaitre quels éléments cherché, il faut examiner le code source de la page, comme d'ailleurs montré dans le tutoriel
- sur ces éléments, on applique un filtre "URL commençant par un chiffre ou un mot"
- pour les éléments ne passant pas le filtre, on les retire, en appellant .remove() dessus par exemple.

Mais sans connaitre le format précis de votre page affichant le résultat de votre recherche, difficile de vous aider plus.

Si vous pouvez poster ici un exemple de "source de la page" de résultat que vous voulez améliorer, je pourrais probablement aider nettement plus, voir écrire un tel script.
Cliquez pour agrandir...
Est-ce que l'adresse du Site peut suffire ? Vous aurez accès aux sources "Rechercher" je pense: https://raphaeltoussaint.com/
 
C'est votre propre site, ou vous etes utilisateur du site mais vous souhaitez améliorer le resultat des recherches *pour vous* uniquement ?

EDIT: le votre.

Donc, en gros, le code javascript doit être embarqué directement dans la page, pas via un user-script qui nécessite que chaque visiteur l'installe sur chacun de ses browsers (et cela ne marchera pas sur les mobiles de toute façon).
 
Bon, par exemple, avec jQuery, voici comment, avec ce user script et GreaseMonkey/ TamperMonkey, ne garder que les résultats commençant par "N°" :

JavaScript: 
// ==UserScript==
// [USER=98389]@name[/USER]         raphaeltoussaint-search-results-filter
// @namespace    [URL]http://tampermonkey.net/[/URL]
// [USER=101246]@VERSION[/USER]      0.1
// @description  try to take over the world!
// [USER=932362]@Author[/USER]       You
// @match        [URL]https://*raphaeltoussaint.com/?s=*[/URL]
// @match        [URL]http://*raphaeltoussaint.com/?s=*[/URL]
// @grant        none
// @require      [URL]https://code.jquery.com/jquery-latest.js[/URL]
// ==/UserScript==

(function() {
    'use strict';

    // Your code here...
    $(document).ready(function() {
        var r = $('article:has(.entry-title:not(:contains(N°)))');
        // console.log(r);
        $.each(r, function (i, el) {
            el.remove();
        });
    });


})();

Evidement, pour ne pas être dépendant de la bonne volonté du visiteur d'installer TamperMonkey et ce userscript, le mieux c'est d'ajouter, coté serveur, ce code directement dans la page elle-même, par exemple ainsi:

HTML: 
<html>
<head>
   <!-- ajouter jQuery -->
  <script src="https://code.jquery.com/jquery-latest.js"></script>[/B]
</head>
<body>
...

<!-- en bas du body: -->
<script>
       var r = $('article:has(.entry-title:not(:contains(N°)))');
       $.each(r, function(i, el) { el.remove(); });
</script>

</body>
</html>

En bref, intégrer ce bout de code javascript en bas de la page pour filtrer les résultats.
C'est pas idéal coté bande passante, car les résultats ont bien été envoyé intégralement par le serveur, mais bon...
 
Dernière édition:
byte_order a dit:
Bon, par exemple, avec jQuery, voici comment ne garder que les résultats commençant par "N°" :

JavaScript: 
// ==UserScript==
// [USER=98389]@name[/USER]         raphaeltoussaint-search-results-filter
// @namespace    [URL]http://tampermonkey.net/[/URL]
// [USER=101246]@VERSION[/USER]      0.1
// @description  try to take over the world!
// [USER=932362]@Author[/USER]       You
// @match        [URL]https://*raphaeltoussaint.com/?s=*[/URL]
// @match        [URL]http://*raphaeltoussaint.com/?s=*[/URL]
// @grant        none
// @require      [URL]https://code.jquery.com/jquery-latest.js[/URL]
// ==/UserScript==

(function() {
    'use strict';

    // Your code here...
    $(document).ready(function() {
        var r = $('article:not(:contains(N°))');
        console.log(r);
        $.each(r, function (i, el) {
            el.remove();
        })
    });


})();

Evidement, il faudrait ajouter ce code directement dans la page elle-même, par exemple ainsi:

HTML: 
<html>
<head>
[B]   <!-- ajouter jQuery -->
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>[/B]
</head>
<body>
...

<!-- en bas du body:
<script>
$each($('article:not(:contains(N°))'), function(i, el) { el.remove(); });
</script>

</body>
</html>

En bref, intégrer ce bout de code javascript en bas de la page pour filtrer les résultats.
C'est pas idéal coté bande passante, car les résultats ont bien été envoyé intégralement par le serveur, mais bon...
Cliquez pour agrandir...


Impressionnant - Je place ça où - Dans la feuille de style ou bien dans (Personnaliser-> CSS additionnel) ?
 
HenryP a dit:
Impressionnant - Je place ça où - Dans la feuille de style ou bien dans (Personnaliser-> CSS additionnel) ?
Cliquez pour agrandir...

Ni l'un ni l'autre, c'est dans le modèle de page utilisée pour générer le résultat d'une recherche (&s=searchText...).
Comme j'ignore en quoi et avec quoi est fait votre site web, peux pas répondre là.

EDIT: enfin, si, c'est en WordPress, mais comme j'y connais rien a WP...
 
Dernière édition:
Sinon, une autre piste c'est de remplacer le plugin de recherche actuel par un meilleur, une rapide recherche semble indiquer qu'il en existe plein d'autres
 
byte_order a dit:
Ni l'un ni l'autre, c'est dans le modèle de page utilisée pour générer le résultat d'une recherche (&s=searchText...).
Comme j'ignore en quoi et avec quoi est fait votre site web, peux pas répondre là.

EDIT: enfin, si, c'est en WordPress, mais comme j'y connais rien a WP...
Cliquez pour agrandir...

"Rechercher" est un widget natif Wordpress. Je vais voir dans son support. Avant de rajouter ces codes je dois faire une sauvegarde complète (BDD et Fichiers). Demain il fera jour, je vous tiens au courant et grand merci pour votre travail. Bonne soirée.
Cordialement, Henri.
 
Bonjour,
Je n'ai pas trouvé où ni comment placer ces codes ? Pour le moment, personne ne s'est encore avancé pour une suggestion.
J'ai ajouté un autre plugin (rechercher): Woocommerce Search Plugin by instant search+
qui s'appuie sur le widget de Wordpress.
C'est un peu meilleur mais il ne reconnait pas les chiffres.
C'est là qu'il faudrait ajouter le code pour la reconnaissance des chiffres, comment ?
 
Dernière édition:
HenryP a dit:
Bonjour,
Sur mon Site, j'utilise l'extension « Rechercher » à partir d'un widget natif de Wordpress.
Ce plugin n'est pas assez sélectif, les résultats de la recherche sont vagues, dispersés et ne correspondent pas au fichier recherché.
L'URL de mes fichiers (environ 2000), démarre par un chiffre et quelques fois par un mot.
Je ne sais pas si c'est possible de créer un code CSS ou autre pour affiner la sélection à ces seules données « Chiffres et mots ».
Merci à qui peut m'apporter une aide éventuelle.
Cliquez pour agrandir...

Bonjour,

Suis pas certain de bien comprendre ton problème. Tu parles de « fichier recherché ». WordPress ne va pas chercher des fichiers à proprement parler mais dans des articles ou dans des pages du site le ou les termes que tu recherches.

Tu parles également d’URL. Pas certain que WordPress fasse une recherche dans l’URL (mauvaise idée de toute façon, le jour où tu change tes URL, c’est mort). Mais plutôt dans les titres et le contenu de tes articles et pages.

À ce niveau d’ailleurs il ne fait pas faire la distinction entre un chiffre et un caractère. La recherche est textuelle.

Il est possible, au titre de quelques efforts, de créer un formulaire de recherche plus précis que celui par défaut de WordPress en proposant par exemple dans ce formulaire des critères particuliers (comme, par exemple, rechercher un livre selon son titre uniquement ou une liste de livres selon une date d’édition). Cela passe généralement par :
- Créer un formulaire de recherche ;
- Éventuellement manipuler le code sous jacent qui va interroger la base de données WordPress et renvoyer le résultat ;
- Éventuellement utiliser les tags et les catégories de WordPress en les incluants en tant que critères de recherche ;
- Créer une page qui affichera le résultat ;
Tout ça en HTML, PHP et du CSS pour la déco.
 
Chris K a dit:
Bonjour,

Suis pas certain de bien comprendre ton problème. Tu parles de « fichier recherché ». WordPress ne va pas chercher des fichiers à proprement parler mais dans des articles ou dans des pages du site le ou les termes que tu recherches.

Tu parles également d’URL. Pas certain que WordPress fasse une recherche dans l’URL (mauvaise idée de toute façon, le jour où tu change tes URL, c’est mort). Mais plutôt dans les titres et le contenu de tes articles et pages.

À ce niveau d’ailleurs il ne fait pas faire la distinction entre un chiffre et un caractère. La recherche est textuelle.

Il est possible, au titre de quelques efforts, de créer un formulaire de recherche plus précis que celui par défaut de WordPress en proposant par exemple dans ce formulaire des critères particuliers (comme, par exemple, rechercher un livre selon son titre uniquement ou une liste de livres selon une date d’édition). Cela passe généralement par :
- Créer un formulaire de recherche ;
- Éventuellement manipuler le code sous jacent qui va interroger la base de données WordPress et renvoyer le résultat ;
- Éventuellement utiliser les tags et les catégories de WordPress en les incluants en tant que critères de recherche ;
- Créer une page qui affichera le résultat ;
Tout ça en HTML, PHP et du CSS pour la déco.
Cliquez pour agrandir...
Bonjour,
Mon problème est résolu, j'ai réussi à réaliser totalement ce que je cherchais comme tu peux le constater, voir: https://raphaeltoussaint.com/
 

Sujets similaires

MacVF
À lire Mise à jour : GraphicConverter 11.3 build 4587
Réponses
0
Affichages
4K
GraphicConverter
MacVF
MacVF
S
Projet
Réponses
19
Affichages
3K
Développement web
3arly
3
Letabilis
Topic communautaire : Vos plugins sur Firefox
Réponses
0
Affichages
1K
FAI et réseau Mac
Letabilis
Letabilis
golf
OpenOffice.org : vrais enjeux et idées fausses...
Réponses
18
Affichages
4K
Réagissez !
maousse
maousse
M
La typographie
Réponses
63
Affichages
23K
Création graphique
Vieux Mac-User
Vieux Mac-User
Haut Bas