sâmbătă, 4 iunie 2011

Cum adaug în blog bara de cautare pentru articole? Tutorial

0 Comentarii
Mai demult vroiam să-mi pus si eu o bară de căutare numai pentru articolele din blog, dar chiar nu găseam cum! Până la urmă m-am descurcat eu cumva și am descoperit cum să adaugi un search box în blogger.com. Astăzi împărtășesc metoda și cu voi în câțiva pași simpli despre cum să adaugă bara de căutare atunci cand ”template ul” nu-l oferă. 

În primul rând, mergem la pagina de design a blogului. Adaugăm un element html/java script în locul unde vrem să apară bara de căutare.Următorul pas este de a adăuga unul din următoarele coduri:

Primul:
<form id="searchThis" action="/search" style="display:inline;" method="get"><input id="searchBox" name="q" type="text"/> <input id="searchButton" value="Go" type="submit"/></form>

Rezultatul este următoarea căsuță de căutare:




De menționat că textul cu roșu ”Go” paote fi înlocuit cu orice cuvânt, rezultatul fiind schimbarea cuvântului din butonul de ”search”.
Următoarul tip de search pe care vi-l pun la dispoziție este acesta:



Poate fi obținută folosind următorul cod:

<form id="searchthis" action="/search" style="display:inline;" method="get">
<input id="search-box" name="q" size="25" type="text" style="background: #ccccff; border: 2px solid #000066"/><input id="search-btn" value="Search" type="submit" style="background: #000066; border: 2px outset #ff0000; color: #ffffff; font-weight: bold;"/></form>

Tot ce e cu roșu poate fi editat pentru a schimba culorile, stilul, marimea etc.

O a treia căsuță este următoarea:




Codul este următorul:


<form id="searchthis" action="/search" style="display:inline;" method="get">
<input id="search-box" name="q" size="25" type="text" value="Enter search terms"/><input id="search-btn" value="Search" type="image" src="http://dryicons.com/images/icon_sets/stickers_icon_set/png/16x16/search_magnifier.png" style="margin-left: 5px; margin: 3px 0 0 5px;"/></form>

La această casuță se poate customiza imaginea din dreapta modificând codul scris cu roșu și adăugând un link către orice altă imagine.
Mult spor!

Related Posts Plugin for WordPress, Blogger...

Go stats