Treceți la conținutul principal

Adaugare imagine in fundal

Nu uitati sa salvati sablonul inainte de orice modificare in HTML!

Primul pas este sa gasiti (sau sa creati) imaginea pe care o doriti ca fundal. Conditiile de care trebuie sa tineti cont: sa fie mica si sa nu aiba margini distincte (pentru a arata frumos cand se repeta pe toata pagina). Incercati sa nu alegeti o imagine prea mare, pentru ca se incarca greu. Pentru a gasi asemenea imagini, cautati pe Google: "graphic backgrounds".
Dupa ce ati gasit ceva ce va place, salvati imaginea pe calculatorul dumneavoastra, apoi incarcati-o in Photobucket (trebuie sa va faceti un cont) si copiati-i link-ul.

Atentie la copyright! Folositi imaginile gratuite!

In Editati HTML cautati /*Primary layout*/ body{
Sub aceste doua randuri introduceti urmatorul cod: background-image: url(link imagine), unde link imagine va fi inlocuit cu link-ul imaginii dorite, neaparat intre paranteze.



La fel veti proceda si daca doriti sa schimbati imaginea de fundal a spatiului destinat articolelor ( #main-wrapper{ ) sau a spatiului destinat coloanei de meniu a blogului ( #sidebar-wrapper{ ).
In mod automat imaginea se va repeta pentru a umple spatiul alocat (background- repeat: repeat;). In caz ca nu doriti acest lucru, puteti face urmatoarele modificari (inlocuind repeat;): no-repeat; (imaginea nu se repeta), repeat-x; (imaginea se repeta doar pe orizontala), repeat-y; (imaginea se repeta doar pe verticala).
Daca ati ales o imagine care nu vreti sa se repete, poate doriti sa specificati pozitia exacta in care sa apara aceasta imagine. Pentru a realiza acest lucru, in textul HTLM adaugati sub codul in care ati adaugat link-ul imaginii, urmatorul cod: background-position: top left; - imaginea va aparea in coltul din stanga sus a paginii. Alte modificari posibile (inlocuind top left; ): top center; (centru sus), top right; (coltul din dreapta sus), center left; (centru-stanga), center center; (centru), center right; (centru-dreapta), bottom left; (coltul din stanga jos), bottom center; (centru-jos), bottom right; (coltul din dreapta jos).
Dupa ce ati schimbat imaginea, trebuie sa ajustati culorile textului pentru a fi mai vizibil. Pentru asta mergeti la Personalizati->Aspect -> Fonturi si culori.
Si cam atat pentru azi. Data viitoare ne ocupam de header si de linia despartitoare intre articole.

Comentarii

Postări populare de pe acest blog

Prajitura cu rabarbar

Prajitura turceasca cu gris si iaurt

Pizza cu blat din paine

Tocanita de ceapa cu pipote si inimi de pui

Friptura frageda de cocos

Frunze de vita de vie conservate in saramura, la borcan

Prajitura Krem a la krem - dukan style

Macrou marinat in sos de tomate

Sunca fiarta in zeama de varza murata

Scrumbie cu lamaie, la cuptor