Ändra utseendet på sökrutan

För att ändra utseendet behöver du redigera i både stilmallen och kodmallarna.
Klicka på kugghjulet uppe i menyn när du är inloggad på blogg.se, välj sedan "Design" och därefter "Redigera stilmall" och "Redigera kodmallar". Stilmallarna och kodmallarna ser olika ut beroende på vilket tema du använder, guiden här nedan visas med temat "Author".

<form action="http://www.google.se/search" name="search" method="get">
<input type="text" name="q" value="" size="12" maxlength="64" />
<input type="hidden" name="sitesearch" value="{{ blog.absolute_url }}" />
<input type="submit" value="Sök" />
</form>

Här ovan ser du hur koden för sökfunktionen ser ut. Den finns i alla dina kodmallar, oftast under "<div id="side">", som med andra ord är menyn.

För att ändra utseendet på sökfunktionen behöver vi lägga till koder i koden för sökfunktionen. Koderna vi ska lägga till är dessa:

KOD 1


KOD 2


Här nedan visar jag var koderna ska sättas in, och det är alltså så koden ska se ut i kodmallen när det är klart.

<form action="http://www.google.se/search" name="search" method="get">
<input class="sokarean" type="text" name="q" value="" size="12" maxlength="64" />
<input type="hidden" name="sitesearch" value="{{ blog.absolute_url }}" />
<input type="submit" class="sokknappen" value="Sök" />
</form>

Spara sedan kodmallen och gör samma sak i de andra. Gå sedan in på din stilmall.

Klistra in denna kod längst ner i stilmallen:


Koden du klistrade in i stilmallen är den som styr utseendet på knapparna. Förhandsgranska och spara när du är nöjd.