3 modalităţi simple prin care vă puteţi pregăti site-ul web de Crăciun

Sezonul sărbătorilor este aici! Dacă aţi început deja să vă împodobiţi casa ori bradul, de ce să nu conţinuaţi și cu site-ul dvs. Webgarden? Vă oferim în continuare 3 modalităţi prin care puteţi schimba apariţia site-ului dvs, astfel încât acesta să răspândească spiritul Crăciunului prin fiecare pagină.
01 vánoce_001.jpg
1. Alegeţi un șablon în sezon
Webgarden vă oferă o serie de șabloane cu tematica sărbătorilor, câteva dintre ele special realizate pentru Crăciun. Puteţi alege cel cară vă place cel mai mult și astfel, în doar câteva clicuri, schimba hainele site-ului dvs. în unele de sărbătoare.
sablon1.png
sablon2.png
sablon3.png
sablon4.png
sablon5.png
sablon6.png
Şabloanele cu design-ul de Crăciun pot fi găsite în pagina de administrare a site-ului dvs, în tab-ul DESIGN. Pentru a le vedea, apăsaţi butonul “Afișează restul modelelor” din partea de jos a paginii.
Precum este cazul și cu celelate șabloane, trecerea la un șablon de Crăciun va modifica integral apariţia site-ului dvs. web și va anula orice coduri CSS aţi folosit înainte. Dacă nu sunteţi dispus să faceţi schimbări atât de drastice, există și alte soluţii pentru împodobirea site-ului dvs. în haine de sărbătoare.
2. Adăugaţi o imagine de fundal festivă la design-ul pe care deja îl aveţi
Creaţi o atmosferă de Crăciun pentru site-ul dvs. prin inserare unei imagini de fundal în 4 pași simpli.
coffee.png
1. Găsiţi o imagine potrivită pentru fundalul siteului. Puteţi, de exemplu, răsfoi paginile unor site-uri precum Unsplash.com, Pexels.com, Gratisography.com, și Pixabay.com. Aceastea sunt niște surse foarte bune pentru diferite imagini de calitate.

SFAT: Imaginea aleasă ar trebui să aibă cel puţin 1920px x 1080px, astfel încât să poată fi afișată bine și pe monitoare Full HD. Încercaţi, totuși, să evitaţi imaginile mai mari de 500k, întrucât acestea se vor încărca mai greu și vă vor încetini site-ul.
2. Mergeţi la Tab-ul DESIGN din pagina de administrare Webgarden și alegeţi EDITARE CSS în coloana din partea stângă. Apoi, plasaţi cursorul mouse-ului peste icoana verde din colţul dreapta-sus, alegeţi “Incărcare imagine nouă pe server” și urmaţi pașii de mai jos.
CSS 1  Webgarden.png
Imaginea este acum încărcată în pagina de administrare. Chiar sub imagine este URL-ul său, cu care vom lucra pentru moment.
CSS 2.png
3. Copiaţi următorul cod CSS:
body {
background-image: url("image_url");
background-position: center center;
background-size: cover;
background-attachment: fixed;
}
și lipiţi-l în partea de jos a căsuţei de editare CSS.
CSS_Code1.png
Câteva clarificări legate de limbajul CSS:

body
Acesta este selectorul corect pentru majoritatea șabloanelor de design. Dacă acesta nu funcţionează, încercaţi să utilizaţi.screen background-image
Aici veţi insera URL-ul imaginii de la pasul 4.

background-position
Păstraţi poziţia centrată.

background-size
Valoarea cover va întinde imaginea pe întreaga suprafaţă de fundal

background-attachment
Dacă utilizaţi valoarea fixed, imaginea va rămâne într-un singur loc în timp ce faceţi scroll în sus ori în jos. Dacă nu doriţi acest lucru, ștergeţi această proprietate.

4. Copiaţi URL-ul imaginii dvs., aflat imediat sub aceasta (vedeţi pasul 2), și lipiţi-l în câmpul background-image în loc de image_url. Apoi apăsaţi SALVEAZA.
CSS_Code2.png
Acum, site-ul dvs. web are o imagine de sărbătoare ce acoperă întregul fundal!
coffee_Christms.png
Cum să faceţi textul lizibil?
Este foarte posibil ca atunci când schimbaţi imaginea de fundal, textul dvs. iniţial să nu mai fie foarte ușor de citit. O modalitate prin care puteţi rezolva această problemă ar fi adăugarea unui alt fundal, mai mic, doar pentru textul dvs. În acest caz, imaginea de fundal va fi afișată doar în acele părţi ale ecranului peste care nu este afișat niciun alt fel de conţinut.
coffee3.png
Pentru a insera acest fundal pentru conţinut, adăugaţi următorul cod la finalul căsuţei de editare CSS:
.page{
background: rgb(255,255,255);
}
Apăsaţi SALVEAZA.
CSS_Code3.png
SFAT: Unele șabloane au deja un fundal cu propria sa culoare acopering conţinutul paginii. În acest caz, vă recomandăm să alegeţi o culoare pentru fundalului de conţinut care să se potrivească.
Un alt fel prin care puteţi da vizibilitate textului este prin adăugarea unui fundal transparent. In acest caz, imaginea de fundal va fi parţial vizibilă sub fundalul de conţinut, iar textul va fi vizibil.
coffee_4.png
Puteţi adăuga acest fundal transparent în același fel precum cel anterior. Codul care trebuie inserat, în acest caz, este următorul:
.page{
background: rgba(255,255,255,0.85);
}
Nu uitaţi să apăsaţi Salvează.
SFAT: Numărul 0.85 din CSS înseamnă nivelul de transparenţă (1 – complet opac; 0 – complet transparent). Dacă doriţi ca fundalul să fie mai transparent, iar în acest fel, imaginea de fundal mai vizibilă, atunci schimbaţi valoarea numărului spre una mai aproape de 0. Invers, pentru un fundal de conţinut mai opac, alegeţi o valoare mai aproape de 1.
Dacă nu doriţi ca niciun alt fundal intermediar să vă acopere imaginea, atunci pur și simplu schimbaţi culoarea textului, astfel încât acesta să poată fi vizbil peste nou imagine de fundal. Pentru cei ce încă nu au citit articolul nostru de pe blog Inseraţi o imagine de fundal pentru site-ul dvs., acolo vă explicăm cum puteţi schimba culoarea textului.
3. Folosiţi propriile idei
Desigur că vă puteţi decora site-ul web oricum doriţi. Adăugaţi un antent festiv, un banner, ori orice altceva ce vă trece prin minte. Aici instrucţiunile noastre se termină și vă oferim spaţiu pentru propria creativitate. Jucaţi-vă cu elementele site-ului dvs. și creaţi ceva cu adevărat original!


La final, am dori să vă urăm un Crăciun fericit și un An Nou minunat!
12/16/2015 14:25:57
info
Name
Email
Comment
Or visit this link or this one