Aggiungere una casella di ricerca al Blog

giovedì 14 febbraio 2008 Lascia un Commento

Come inserire una Casella di Ricerca su Blogger Blogspot?
Supponiamo che i nostri lettori vogliano cercare un determinato argomento all'interno del nostro blog Blogger. Con questa guida impareremo ad inserire un utile sistema di ricerca dei post, per Blogger Blogspot.

Andiamo su Layout ->Elementi pagina->Aggiungi elemento pagina->HTML / Javascript ed inseriamo lo script seguente:


<p align="left"><form id="searchthis" action="INDIRIZZO TUO BLOG/search" style="display:inline;" method="get"><strong>NOME DEL BLOG<br/></strong>
<input id="b-query" maxlength="255" name="q" size="20" type="text"/><input id="b-searchbtn" value="Search" type="submit"/></form></p>



Ricordatevi di cambiare INDIRIZZO TUO BLOG con l'URL o indirizzo web del vostro blog.
Esso deve essere necessariamente della forma http://NOMEBLOG.blogspot.com. Quindi non va bene il solo www.

Inoltre, potete sostituire NOME DEL TUO BLOG con qualsiasi cosa desideriate. Per esempio, se il vostro nome blog è lungo, potete scrivere "Ricerca qui" o "Cerca nel sito".

Salvate lo script e verificate il risultato.


Eccone un esempio:

TSG BLOGGER


Se volete aumentare la larghezza della barra di ricerca modificate il valore dell'attributo size, ad esempio size=30. Otterremo:

TSG BLOGGER





Se volete cambiare il testo contenuto nel pulsante basta modificare l'attributo value, ad esempio: value=Cerca nel Blog. Otterremo:

TSG BLOGGER







Sostituire il pulsante di ricerca con una immagine personalizzata.
Per fare ciò, create una immagine personalizzata e caricatela su un servizio di hosting (qualche esempio qui: spazio web).
Annotatevi l'indirizzo URL dell'immagine.
Andate su Layout ->Elementi pagina->Aggiungi elemento pagina->HTML / Javascript

Al posto del codice precedentemente visto utilizzate questo:


<p align="left"><form id="searchthis" action="INDIRIZZO TUO BLOG/search" style="display:inline;" method="get"><strong>NOME DEL BLOG<br/></strong><input id="b-query" maxlength="255" name="q" size="20" type="text"/><input id="b-searchbtn" type="image" src="INDIRIZZO URL IMMAGINE" align="top"/></form></p>



Ricordatevi di sostituire INDIRIZZO URL IMMAGINE con quello della vostra immagine personalizzata.

21 commenti »

  • the Tramp ha scritto:  

    Ciao, grazie per la dritta. Avrei una domanda: come posso cambiare il colore del nome del mio blog sopra la barra di ricerca? Io uso uno sfondo nero e le scritte sono color arancione, copiando il codice che hai postato la scritta compare di colore bianco. Grazie ancora per l'aiuto.

  • Mauro ha scritto:  

    Ho copiato il codice che hai postato, e fin qui tutto bene l'ho inserito come tu hai descritto, ma quando inserisco una parola per la ricerca mi esce la scritta Not found Cosa sbaglio? Grazie Ciao

  • Paolo M. Grossholz ha scritto:  

    Ciao JS,
    grazie sia per la caselle di ricerca che per la Tag Cloud, funziona tutto alla grande !!!
    Bye bye, Paolo

  • Tiz ha scritto:  

    Sì sì, confermo! Sei stato chiarissimo ma anche a me non trova mai risultati. Come mai? Non ti chiedo di farmi da tecnico ma sai mica dirmi se è solo questione di tempo o se ho sbagliato qualcosa?

  • JS ha scritto:  

    Tiz

    La voce "INDIRIZZO TUO BLOG" deve essere da te sostituita con http://sentichisparla.blogspot.com
    e non con www.sentichisparla.blogspot.com.

    (Devi utilizzare la forma completa di http://)

    Controlla, prova e fammi sapere.

  • Tiz ha scritto:  

    Oops! Ti ringrazio molto! Ora funziona... Beh, avevo intuito di aver dimenticato qualcosa ;-)
    Ti mando un saluto.

  • CLA ha scritto:  

    ciao...sono da poco, anzi pochissimo in questo mondo dei blog ma io (da buona capra del tecnologico) non riesco afare nessuna modifica...mi compare sempre questa scritta...Non è stato possibile salvare il modello
    Correggi l'errore qui sotto, quindi invia nuovamente il modello.
    "Non è stato possibile analizzare il tuo modello, in quanto non è strutturato correttamente. Assicurati che tutti gli elementi XML presentino il tag di chiusura richiesto."
    ma a me nn pare di fare alcun errore....sto impazzendo

    sai come aiutarmi???

  • Tarta10 ha scritto:  

    Ma xkè non mi compare la scritta aggiungi elementi?

  • la bottega dei sensi ha scritto:  

    nell'anteprima l'operazione riesce,ma nella visualizzazione normale del blog non c'è

  • florencetag ha scritto:  

    grande! mi sono divertito a provare le varie dimensioni e alla fine ho trovato quella giusta. mi chiedevo se però ci fosse un sistema per avere un'anteprima dei risultati con parola cercata in evidenza (tipo copia cache)... grazie per la chiarezza e i suggerimenti!

  • Omy Photo ha scritto:  

    Grazie :) Mi sei stato molto d'aiuto!

  • tilli ha scritto:  

    Ciao sto seguendo il tuo tutorial alla lettera, ma se voglio modificare ulteriormente l'ultimo codice, che hai elencato quello in cui si può inserire l'immagine al posto del tasto, voglio non inserire il nome del blog. elimino la stringa?.grazie.

  • Jack Slater ha scritto:  

    @tilli
    Elimina il blocco:
    <strong>NOME DEL BLOG<br/></strong>

  • Francesca-emporiolavanda ha scritto:   Questo commento è stato eliminato dall'autore.
  • Francesca-emporiolavanda ha scritto:  

    credevo di avere risolto invece ho problemi con la casella di ricerca, o mi da pagina inesistente oppure mi da un solo risultato, magari invece di tre...dove sbaglio?...

  • IL Gladiatore ha scritto:  

    funziona tutto ,ma come faccio a collegare la ricerca al file specifico?

  • Lo Stai Guardando ha scritto:  

    Guida molto utile ma mi potresti spiegare come mettere il tasto cerca a fianco alla barra e non sotto????

  • Rino Rossi ha scritto:  

    Funziona benissimo. Grazie!

  • Commenta!

    Lascia il tuo commento riguardo l'articolo!