Cum să-ți creezi propria temă pentru Google Chrome. Cum să vă creați propria temă pentru Google Chrome. Teme pentru Google Chrome

Vine timpul și te sături de cel obișnuit, vrei să adaugi un pic de poftă celui mai popular browser și o astfel de „funcție unică” în Chrome poate fi o „temă”, și nu descărcată din magazinul online oficial, ci ta propriu, spre deosebire de oricine altcineva.

După cum probabil ați înțeles deja, astăzi vom analiza problema creării propriilor teme pentru browserul Google Chrome.

Pentru a crea avem nevoie de:

1. Cel mai simplu editor grafic (chiar Paint va face);
2. Instrucțiunile noastre detaliate;
3. Un pic de dorinta.

Și nu încerc să vă înșel, cele mai tari teme pentru browserul Chrome sunt create în câteva minute, dar să trecem de la cuvinte la acțiune.

Există două moduri de a crea o temă pentru Google Chrome:

1. Scrieți de la zero (prin crearea unui document text și a mai multor imagini);
2. Utilizați un serviciu online specializat.

În timp ce decideți ce metodă să utilizați, voi începe cu cea mai „grea”.

Crearea unei teme pentru Google Chrome de la zero

Temele, precum și extensiile pentru browsere bazate pe motorul chromium, se bazează pe fișier manifest.json.

Manifest.json este un document text care stochează setări pentru teme și extensii, precum și un titlu, descriere și alte informații despre servicii.

Să creăm un folder nou pe desktop cu numele viitorului nostru subiect, pentru mine se va numi „Nu o face!”, iar în interiorul lui vom crea un document text - manifest.json, unde manifest este numele documentului, iar json este . În plus, creați un folder gol numit „imagini” care va conține toate elementele grafice ale temei noastre.

Următorul pas în crearea unei teme va fi pregătirea imaginilor.

Puteți folosi imagini gata făcute descărcate de pe Internet sau puteți crea propriile dvs.; voi realiza imagini complet unice pentru încărcarea ulterioară a temei în magazinul online Chrome.

Vom avea nevoie de imagini de următoarele dimensiuni:

1. 1920x1080px (format HD) – pentru utilizare ca fundal principal în browser.

2. 30x256px – această imagine va fi folosită ca decor pentru fereastră Chrome.

3. 1100x40px – această imagine va acționa ca un ecran de splash în colțul din stânga sus al browserului (nu știu de ce ar trebui să utilizați o imagine suplimentară în acest loc separat - o puteți folosi pentru „personalizarea” suplimentară a temei ).

4. 30x200px – va acționa ca o umplere pentru filele deschise inactive ale browserului.

5. 30x256px – această imagine va fi folosită pentru a completa fila deschisă activă și bara de marcaje Chrome.

Acordați o atenție deosebită imaginilor, în special dimensiunilor acestora; dacă nu știți cum să faceți o imagine de exact această dimensiune și formă, studiați una dintre ele.

Ei bine, dacă aveți deja totul pregătit, mergeți mai departe și creați un fișier manifest.json.

Puteți descărca fișierul completat pe care l-am pregătit ca exemplu - sau îl puteți compune singur conform instrucțiunilor de mai jos.

Documentul în care va fi descris codul temei noastre începe cu o acoladă „(”, apoi trebuie să completați câmpurile:

( "nume":"Nu o face!", // câmp care indică numele temei; "versiune": "1", // numărul versiunii temei dvs. (mai târziu, când faceți modificări temelor, aveți nevoie de pentru a actualiza versiunea); " description":"Ma mai puteți gândi de două ori?", // descriere scurtă a subiectului; "manifest_version":2, // versiunea manifestului (există două versiuni ale „manifestului” - 1 și 2, versiunea 1 - pentru browserele Chrome sub versiunea 18, 2 pentru browserele versiunea 18 și superioară, inclusiv).

"theme":( "imagini":( "theme_frame": "imagini/theme_frame.jpeg", // imagine folosită în designul ferestrei browser; "theme_toolbar": "images/theme_toolbar.jpeg", // imagine folosită ca umplere filă deschisă activă; "theme_tab_background": "images/theme_tab_background.jpeg", // completarea filelor deschise inactive; "theme_ntp_background": "images/theme_ntp_background.jpeg", // fundalul principal al temei noastre; "theme_frame_overlay": "imagini /theme_frame_overlay .jpeg"), // completați colțul din stânga sus.

Codul de pe această pagină folosește simbolul „//”, este necesar să „comentați” codul. Direct în dosar manifest.json- poate fi sters.

După ce ați specificat căile către imagini, ar trebui să specificați culorile fonturilor și elementelor de interfață. ÎN manifest.json Sunt folosite culori RGB - puteți obține codurile lor în orice convertor online.

"culori":( "cadru":, // Umple spațiul gol al fundalului principal cu culoarea specificată; "bara de instrumente":, // Umple zona din colțul din stânga jos, unde este afișată „url-ul” site-ului; "tab_text":, // Font de culoare al filei deschise active; "tab_background_text":, // Culoarea fontului din fila deschisă inactivă; "bookmark_text":, // Culoarea fontului marcajelor din panoul browserului; "ntp_background": , // Culoarea de umplere a fundalului sub pictogramele „aplicație” din browser; „ntp_text”:, // Culoarea fontului pentru numele aplicațiilor; „button_background”:), // Culoarea „Închidere”, „Minimizare”, „Complet „Ecran” din colțul din dreapta sus.

Tot ce rămâne este să setați poziționarea imaginii principale de fundal și câteva setări suplimentare.

"tints":( "butoane": // Specificați nuanțele culorilor utilizate (lăsați valorile specificate aici);), "properties":( "ntp_background_alignment": "bottom", // Specificați în raport cu ce margine a ferestrei va fi localizată imaginea principală (jos – jos, sus – sus); „ntp_background_repeat”: „no-repeat” // Indicăm dacă este necesar să „umplem” întreg spațiul ferestrei browserului cu imaginea noastră , dacă este mai mare ca dimensiune decât imaginea noastră principală. ))

Ai trecut cu mine prin toți pașii? Grozav, puteți închide fișierul manifest și îl puteți salva și începe să testați tema rezultată încărcând mai întâi imaginile create anterior în folderul „imagini”.

Testarea temei pentru Chrome

Testarea sună prea tare, de fapt, trebuie să verificăm dacă am făcut vreo greșeală în munca noastră.

Aveți deja o temă instalată în browser și trebuie să o modificați puțin? Nici o problemă! Fișierele temelor deja instalate în Chrome sunt stocate la C:\Users\User_Name\AppData\Local\Google\Chrome\User Data\Profile 1\Extensions

Deschideți browserul și accesați Setări, fila Extensii și faceți clic pe Încărcați extensia dezambalată. Asigurați-vă că verificați dacă „Modul dezvoltator” este bifat.

În fereastra care apare, selectați folderul cu tema dvs. pentru Chrome și faceți clic pe „Ok” - în cazul meu, acesta este folderul „Nu o face!”.

Felicitări! Tema din browser ar fi trebuit să se schimbe cu a ta, dacă nu, atunci revino la codul de mai sus și caută erori în fișierele și rezoluțiile imaginilor tale sau descarcă arhiva cu fișierele mele de pe link - și compară cu a ta.

Acum vă puteți bucura de propria temă pentru Google Chrome, dar în fiecare butoi de miere există câte o lingură.

De fiecare dată când deschideți browserul, în colțul din dreapta sus va apărea o fereastră care vă va informa că una dintre extensiile sau temele instalate nu a fost descărcată din magazinul oficial. Există o singură modalitate de a evita acest lucru - încărcați-vă tema în magazinul online oficial Chrome și instalați-o în browser de acolo.

Cum să încărcați o temă în Magazinul Chrome

Dacă decideți să vă despărțiți de banii câștigați cu greu, treceți printr-o înregistrare simplă în magazinul online la https://chrome.google.com/webstore/category/extensions.

După ce ați creat o temă frumoasă și unică, puteți face instalarea plătită pentru utilizatori - în acest fel veți primi un mic venit pasiv.

După ce vă înregistrați și plătiți pentru un cont de dezvoltator, veți avea ocazia să vă încărcați propriile extensii și teme în magazin cu restricții minore - nu mai mult de 20 de extensii per cont, numărul de teme este nelimitat.

În primul rând, împachetați fișierele cu tema și încărcați-le în Magazinul Chrome, așa cum se arată în captura de ecran.

Dacă nu au apărut erori, informațiile despre tema dvs. vor apărea pe pagina principală a panoului pentru dezvoltatori cu un link către pagina de setări, unde puteți schimba descrierea, adăuga o pictogramă și publica tema.

Nu voi descrie toate câmpurile disponibile pentru completare - sunt, deci, bine comentate - dacă aveți probleme, scrieți un comentariu sub postare și voi încerca să vă ajut.

Crearea unei teme pentru Chrome folosind un serviciu online

În prima parte a articolului, am descris o metodă „complicată” de a crea teme pentru browserul Google Chrome, acum să trecem la una mai simplă, care nu necesită săparea în cod și crearea multor imagini suplimentare. Tot ce aveți nevoie este să accesați site-ul web - www.themebeta.com/chrome-theme-creator-online.html cu un fundal mare pregătit în prealabil.

Browserele bazate pe Chromium nu acceptă teme animate, dar Opera acceptă.

Odată accesat serviciul, care, de altfel, nu are nicio legătură oficial cu corporația Google, veți vedea o zonă de lucru în care instrumentele cu comentarii (în engleză) sunt situate în stânga, o fereastră de browser Chrome vizualizată în dreapta , în care vor fi afișate toate modificările efectuate, iar În partea de jos există butoane pentru poziționarea imaginii dvs. în raport cu fereastra browserului.

Introduceți numele unei teme și încărcați o imagine de fundal. Imediat - faceți setările de poziționare sau lăsați-le implicite.

În fila „culori” puteți seta culorile fonturilor utilizate în diferite locuri din browser. Treceți cursorul peste oricare dintre opțiunile propuse din stânga și locația modificării va fi evidențiată cu roșu în fereastra vizualizată. Tot ce trebuie să faci este să lucrezi cu paleta de culori pentru a le alege pe cele de care ai nevoie.

Fără a descărca multe dintre imaginile suplimentare discutate mai sus, fereastra browserului dvs. va reflecta schema de culori implicită Windows, de exemplu. Pentru „personalizarea” completă a temei, trebuie să încărcați toate imaginile propuse în fila „imagini”, conform dimensiunilor menționate în prima parte a articolului.

Accesând fila „Pachet”, vi se vor oferi trei acțiuni din care să alegeți:

1. Instalați tema rezultată în browser (rețineți dezavantajul ferestrei când deschideți browserul).
2. Pachetați tema în format de fișier crxși descărcați-l pe computer (acest fișier este fișierul de instalare pentru teme și extensii în browserul Chrome).
3. Descărcați „codul sursă” al temei într-o arhivă zip (puteți încărca imediat tema finalizată în magazinul online).

Remarc că atunci când utilizați acest serviciu, tema dvs. va fi plasată în director și va fi disponibilă pentru descărcare și instalare de către alți utilizatori.

Dacă sunteți interesat, în următoarele postări voi descrie procesul de creare a temelor animate pentru browserul Opera.

Pentru a face acest lucru, veți avea nevoie de un generator special de teme web, puțină inspirație și câteva minute de timp liber. Deși dacă suferi de perfecționism, poți petrece câteva ore. Te-am avertizat. :)

Deci, deschideți aplicația web. Veți vedea file cu instrumente pentru crearea temelor în partea stângă a ferestrei și o zonă de previzualizare în partea dreaptă.

Acest constructor vă permite să creați teme într-un mod semi-automat. Dar puteți personaliza totul și manual, astfel încât rezultatul să se potrivească pe deplin gustului dvs.

1. Mod ușor

Ideea este aceasta: încărcați orice imagine doriți în constructor, iar ThemeBeta o folosește ca fundal principal pentru noua temă și ajustează automat toate culorile de design la aceasta.

Pentru a adăuga propria imagine, sub fila De bază, faceți clic pe Încărcați o imagine și selectați imaginea dorită pe computer. Apoi, pentru ca editorul să personalizeze culorile temei, faceți clic pe Generare culori.

Dacă sunteți mulțumit de rezultat, faceți clic pe Pack and Install și confirmați descărcarea și apoi adăugarea temei în Chrome. Browserul activează imediat noul design.

Dacă, după configurarea automată, doriți să schimbați culorile sau să adăugați fundaluri separate pentru diferite elemente ale temei, veți avea nevoie de instrumente în alte file. Mai multe detalii despre ele găsiți în paragraful următor al articolului.

2. Metodă avansată

Această metodă implică setarea manuală a fundalurilor și a culorilor textului pentru o nouă temă.

Pentru a selecta imagini sau culori ca fundal pentru diferite elemente de design, utilizați instrumentele din fila Imagini. Doar treceți cursorul peste orice instrument, iar în fereastra din dreapta designerul va arăta ce parte a temei se schimbă. De exemplu, fundalul NTP este folosit pentru a configura fundalul principal. Și Tab Background vă permite să selectați fundalul antetului site-ului.

După ce v-ați dat seama de fundal, puteți personaliza culorile textului în fila Culori. Totul funcționează la fel aici. Există o listă de instrumente, indicați spre oricare dintre ele - iar în fereastra din dreapta veți vedea de ce este responsabil.

Când ați terminat cu fundalurile și culorile textului, deschideți fila Pack și faceți clic pe Pack and Install pentru a descărca și aplica tema aleasă.

În plus, puteți alege și instala oricând una dintre numeroasele teme gata făcute din baza de date ThemeBeta sau din catalogul oficial Google. Dacă în viitor doriți să reveniți la designul standard, accesați setările Chrome și vizavi de elementul „Teme”, faceți clic pe „Scală implicită”.

În această instrucțiune vă voi spune cât de repede și ușor creați o temă pentru browserul Google Chrome. Acesta este cel mai simplu mod, dar pentru orice eventualitate, voi scrie totul în detaliu.

Ce vei avea nevoie:
- Aplicație
-Tema mea Chrome
-Înregistrare în Google

1. Mai întâi, deschideți Chrome și accesați aplicații.

2. Acum mergeți la Magazin. (Nu vă fie teamă, nu trebuie să cumpărați nimic).

3. În căutare, introduceți Tema mea Chrome și apăsați Enter.

4. Găsiți aplicația My Chrome Theme și faceți clic pe butonul Free.

5.Va apărea o fereastră ca aceasta, faceți clic pe adăugare. Apropo, după ce faceți clic pe butonul Gratuit, vi se poate solicita să vă conectați la Google.

6.Acum așteptăm să se descarce și să se instaleze.

7. Acum accesați din nou Aplicații și selectați Tema mea Chrome.

8. Faceți clic pe Începeți crearea temei

9.Aici puteți alege acum să încărcați o imagine de pe computer sau de pe o cameră web. În cazul meu, descarc de pe computer.

10.Alegeți o poză sau o fotografie.

11.Acum editați poziția imaginii sau a fotografiei și faceți clic pe Continuați la Pasul 2.

12.Aici facem clic pe pensule și selectăm culorile pentru fiecare element separat. După aceea, faceți clic pe Continuați la Pasul 3.

13.Scrieți numele temei și faceți clic pe Creați tema mea!

15. În partea de jos, unde sunt descărcările, va apărea o nouă descărcare. Faceți clic pe Următorul.

16.Acum faceți clic pe Adăugare.

17.Și admirăm. Adevărat, în cazul meu, fotografia nu este potrivită. Pentru cei care sunt familiarizați cu Internetul de mult timp, această instrucțiune va părea amuzantă, deoarece totul este descris prea mult în detaliu. Dar să nu uităm că unii oameni nu sunt astfel de experți în utilizarea internetului și necesită o descriere detaliată.

Dacă petreci mult timp pe Internet, atunci aspectul browserului nu este mai puțin important decât funcționalitatea sau viteza acestuia. Este mult mai confortabil să lucrezi cu o interfață frumoasă, ergonomică, în care culorile, pictogramele, comenzile și imaginile de fundal sunt selectate în mod optim. Browserul Google Chrome facilitează instalarea și schimbarea temelor, dar dacă niciuna nu ți se potrivește, le poți crea cu ușurință pe a ta.

După cum puteți vedea, crearea propriei teme folosind o extensie proprietară de la Google este foarte simplă.

Întotdeauna încercăm să personalizăm totul, să ne adaptăm la noi înșine și să îl refacem în funcție de preferințele și gusturile noastre. Computerul nu face excepție în acest sens. La urma urmei, o imagine selectată corect pentru un screensaver sau pur și simplu culori care sunt plăcute ochiului pot duce confortul utilizării unui computer la un nivel cu totul nou.

Cine dintre noi nu a schimbat tapetul pentru Windows? În zilele noastre este rar să întâlnești o astfel de persoană. Unii au pisici, alții au o domnișoară frumoasă, iar alții iubesc abstracția.

Știați că screensavere similare pot fi instalate în browserul Google Chrome? Numai acolo se numesc teme.

Dacă v-ați săturat de pânza albă implicită, citiți mai departe pentru a afla cum puteți modificați designul temei în Google Chrome.

Schimbarea temei (ecranul de deschidere) în Chrome

Schimbați tema în Google Chrome puteți urma următoarele instrucțiuni:

De asemenea, puteți urmări direct linkul.

În această secțiune veți vedea o galerie imensă cu tot felul de subiecte. Unele dintre ele au fost create de designeri Google, iar altele au fost realizate de artiști. Toate sunt gratuite.

Când găsiți subiectul dorit, treceți mouse-ul peste el și faceți clic în fereastra pop-up "gratuit".

Alte teme pentru descărcare Google Chrome

O altă sursă de teme sunt designerii terți. După cum sa dovedit, sunt foarte, foarte mulți dintre ei. De multe ori le depășesc semnificativ pe cele standard în calitate, ca să nu mai vorbim de varietate.

Descărcați teme pentru Google Chrome:

Fișierele descărcate au o extensie CRX (uneori pot fi arhivate). Pentru a le instala, ar trebui să dezarhivați și pur și simplu să trageți fișierele cu tema în fereastra browserului.

Generator de teme (aspect) pentru Google Chrome

Dacă metodele de mai sus nu dau rezultate, atunci ar trebui să utilizați generator de subiecte — Tema mea Chrome, care poate fi descărcat de pe același "Magazin online".

Link de descărcare directă.

Utilizarea acestei aplicații este foarte simplă: încărcați o imagine, personalizați schema de culori și o procesați folosind instrumentele disponibile.