Tulee aika ja kyllästyt tavalliseen selaimeen, haluat lisätä suosituimpaan selaimeen, ja tällainen Chromen "ainutlaatuinen ominaisuus" voi olla "teema", jota ei ladata virallisesta verkkokaupasta, mutta omaa, toisin kuin kukaan muu.

Kuten ehkä jo ymmärsit, tarkastelemme tänään kysymystä omien teemojen luomisesta Google Chrome -selaimelle.

Luodaksemme tarvitsemme:

  1. Yksinkertaisin graafinen editori (jopa Paint käy);
  2. Yksityiskohtaiset ohjeemme;
  3. Vähän halua.

Enkä yritä pettää sinua, Chrome-selaimen tyylikkäimmät teemat syntyvät muutamassa minuutissa, mutta siirrytään sanoista tekoihin.

Voit luoda teeman Google Chromelle kahdella tavalla:

  1. Kirjoita tyhjästä (luomalla yhden tekstidokumentin ja useita kuvia);
  2. Käytä erikoistunutta verkkopalvelua.

Kun päätät, mitä menetelmää käytät, aloitan "vaikeimmasta".

Teeman luominen Google Chromelle tyhjästä

Teemat sekä laajennukset kromimoottoriin perustuville selaimille perustuvat tiedostoon manifest.json.

Manifest.json on tekstidokumentti, joka tallentaa teemojen ja laajennusten asetukset sekä otsikon, kuvauksen ja muita palvelutietoja.

Luodaan työpöydälle uusi kansio tulevan aiheemme nimellä, minulle sen nimi on "Älä tee sitä!", ja sen sisään luomme tekstidokumentin - manifest.json, jossa manifest on asiakirjan nimi ja json on sen . Lisäksi luo tyhjä kansio nimeltä "kuvat", joka sisältää kaikki teemamme graafiset elementit.

Seuraava vaihe teeman luomisessa on kuvien valmistelu.

Voit käyttää Internetistä ladattuja valmiita kuvia tai tehdä omia; Teen täysin ainutlaatuisia kuvia teeman myöhempää lataamista varten Chrome-verkkokauppaan.

Tarvitsemme seuraavan kokoisia kuvia:

1. 1920x1080px (HD-muoto) – käytettäväksi selaimen päätaustana.

2. 30x256px – tätä kuvaa käytetään Chrome-ikkunan koristeena.

3. 1100x40px – tämä kuva toimii aloitusnäytönä selaimen vasemmassa yläkulmassa (en tiedä miksi sinun pitäisi käyttää lisäkuvaa tässä paikassa erikseen - voit käyttää sitä teeman lisämuokkaukseen ).

4. 30x200px – se toimii ei-aktiivisten avoimien selaimen välilehtien täyttönä.

5. 30x256px – tätä kuvaa käytetään aktiivisen avoimen välilehden ja Chromen kirjanmerkkipalkin täyttämiseen.

Kiinnitä huomiota kuviin ja erityisesti niiden kokoihin; jos et osaa tehdä juuri tämän kokoista ja muotoista kuvaa, tutustu johonkin meistä.

No, jos sinulla on jo kaikki valmiina, luo tiedosto manifest.json.

Voit ladata valmiin tiedoston, jonka valmistin näytteeksi - tai koota sen itse alla olevien ohjeiden mukaan.

Asiakirja, jossa teemamme koodi kuvataan, alkaa kiharalla aaltosuljella "(", sitten sinun on täytettävä kentät:

( "nimi":"Älä tee sitä!", // kenttä, joka ilmaisee teeman nimen; "versio": "1", // teemasi versionumero (myöhemmin teemoihin muutoksia tehdessäsi version päivittäminen); " kuvaus":"Voiko vielä miettiä kahdesti?", // lyhyt kuvaus aiheesta; "manifest_version":2, // manifestin versio ("manifestista" on kaksi versiota - 1 ja 2, versio 1 - Chrome-selaimille versio 18, 2 selaimille versio 18 ja uudemmat, mukaan lukien).

"theme":( "images":( "theme_frame": "images/theme_frame.jpeg", // selainikkunan suunnittelussa käytetty kuva; "theme_toolbar": "images/theme_toolbar.jpeg", // täytteenä käytetty kuva aktiivinen avoin välilehti; "theme_tab_background": "images/theme_tab_background.jpeg", // ei-aktiivisten avoimien välilehtien täyttäminen; "theme_ntp_background": "images/theme_ntp_background.jpeg", // teemamme päätausta; "theme_frame_overlay": "images" /theme_frame_overlay .jpeg"), // täytä vasen yläkulma.

"teema" :(

"kuvat" :(

"theme_frame" : "images/theme_frame.jpeg" , // selainikkunan suunnittelussa käytetty kuva;

"theme_toolbar" : "images/theme_toolbar.jpeg" , // aktiivisen avoimen välilehden täytteenä käytetty kuva;

"theme_tab_background" : "images/theme_tab_background.jpeg", // täyttää ei-aktiiviset avoimet välilehdet;

"theme_ntp_background": "images/theme_ntp_background.jpeg", // teemamme päätausta;

"theme_frame_overlay" : "images/theme_frame_overlay.jpeg"} , // täytä vasen yläkulma.

Tämän sivun koodissa käytetään symbolia "//", koodi on pakollinen "kommentoimaan". Suoraan tiedostossa manifest.json- se voidaan poistaa.

Kun olet määrittänyt kuvien polut, sinun tulee määrittää fonttien ja käyttöliittymäelementtien värit. SISÄÄN manifest.json RGB-värejä käytetään - voit saada niiden koodit missä tahansa online-muuntimessa.

"colors":( "frame":, // Täyttää päätaustan tyhjän tilan määritetyllä värillä; "työkalupalkki":, // Täyttää vasemmassa alakulmassa olevan alueen, jossa sivuston "url" näkyy; "tab_text":, // Aktiivisen avoimen välilehden värifontti; "tab_background_text":, // Ei-aktiivisen avoimen välilehden fontin väri; "bookmark_text":, // Selainpaneelin kirjanmerkkien fontin väri; "ntp_background": , // Taustan täyttöväri "sovellus" -kuvakkeiden alla Näyttö" -painikkeet oikeassa yläkulmassa.

"värit" :(

"kehys": [0, 0, 0], // Täyttää päätaustan tyhjän tilan määritetyllä värillä;

"työkalupalkki" : [ 0 , 0 , 0 ], // Täyttää vasemmassa alakulmassa olevan alueen, jossa sivuston "url" näkyy;

"tab_text" : [ 255 , 255 , 255 ] , // Aktiivisen avoimen välilehden fontin väri;

"tab_background_text" : [ 167 , 167 , 167 ] , // Ei-aktiivisen avoimen välilehden fontin väri;

"bookmark_text" : [ 167 , 167 , 167 ] , // Kirjanmerkkien fontin väri selainpaneelissa;

"ntp_background": [0, 0, 0], // Taustan täyttöväri "sovellus"-kuvakkeiden alla selaimessa;

"ntp_text" : [ 167 , 167 , 167 ] , // Sovellusten nimien fontin väri;

"button_background" : [ 255 , 255 , 255 ] ), // Oikean yläkulman "Sulje", "Minimoi", "Koko näyttö" -painikkeiden väri.

Jäljelle jää vain päätaustakuvan sijainnin asettaminen ja pari lisäasetusta.

"sävyt":( "buttons": // Määritä käytettyjen värien sävyt (jätä arvot tähän);), "properties":( "ntp_background_alignment": "bottom", // Määritä suhteessa mihin reunaan ikkunasta pääkuva sijoittuu (alhaalta - alhaalta, ylhäältä - ylhäältä); "ntp_background_repeat": "no-repeat" // Ilmoitamme, onko tarpeen "täytä" koko selainikkunan tila kuvallamme , jos se on kooltaan suurempi kuin pääkuvamme. ) )

Kävitkö kaikki vaiheet läpi kanssani? Hienoa, voit sulkea manifestitiedoston ja tallentaa sen ja aloittaa tuloksena olevan teeman testaamisen lataamalla ensin aiemmin luodut kuvat "images"-kansioon.

Testataan Chromen teemaa

Testaus kuulostaa liian kovalta, itse asiassa meidän on tarkistettava, olemmeko tehneet virheitä työssämme.

Onko sinulla jo teema asennettuna selaimeesi ja haluatko muokata sitä hieman? Ei ongelmaa! Chromeen jo asennettujen teemojen tiedostot tallennetaan hakemistoon C:\Users\User_Name\AppData\Local\Google\Chrome\User Data\Profile 1\Extensions

Avaa selain ja siirry Asetukset, Laajennukset-välilehteen ja napsauta Lataa pakkaamaton laajennus. Varmista, että "Kehittäjätila" on valittuna.

Valitse näkyviin tulevasta ikkunasta kansio, jossa on Chromen teema, ja napsauta "Ok" - minun tapauksessani tämä on "Älä tee sitä!" -kansio.

Onnittelut! Selaimen teeman olisi pitänyt muuttua omaksi, jos ei, palaa yllä olevaan koodiin ja etsi virheitä tiedostoistasi ja kuvien resoluutioista tai lataa tiedostoni sisältävä arkisto linkistä - ja vertaa omaasi.

Nyt voit nauttia omasta teemastasi Google Chromelle, mutta jokaisessa hunajatynnyrissä on lusikallinen mitä tiedät.

Joka kerta kun avaat selaimen, oikeaan yläkulmaan tulee ikkuna, joka ilmoittaa, että jotakin asennetuista laajennuksista tai teemoista ei ole ladattu virallisesta kaupasta. On vain yksi tapa välttää tämä - lataa teemasi viralliseen Chrome-verkkokauppaan ja asenna se sieltä selaimeen.

Teeman lataaminen Chrome Storeen

Jos päätät luopua kovalla työllä ansaitsemastasi rahasta, rekisteröidy verkkokaupassa osoitteessa https://chrome.google.com/webstore/category/extensions.

Kun olet luonut kauniin ja ainutlaatuisen teeman, voit tehdä asennuksesta käyttäjille maksullisen - näin saat pienen passiivisen tulon.

Rekisteröitymisen ja kehittäjätilin maksamisen jälkeen sinulla on mahdollisuus ladata omia laajennuksiasi ja teemojasi kauppaan pienin rajoituksin - enintään 20 laajennusta tiliä kohden, teemojen määrä on rajoittamaton.

Pakkaa ensin teematiedostot ja lähetä ne Chrome Storeen kuvakaappauksen mukaisesti.

Jos virheitä ei tapahtunut, tiedot teemastasi näkyvät kehittäjäpaneelin pääsivulla ja linkin asetussivulle, jossa voit muuttaa kuvausta, lisätä kuvakkeen ja julkaista teeman.



En kuvaile kaikkia täytettäviä kenttiä - ne ovat siis hyvin kommentoituja - jos sinulla on ongelmia, kirjoita kommentti julkaisun alle, niin yritän auttaa sinua.

Teeman luominen Chromelle verkkopalvelun avulla

Artikkelin ensimmäisessä osassa kuvailin "monimutkaista" tapaa luoda teemoja Google Chrome -selaimelle, siirrytään nyt yksinkertaisempaan, joka ei vaadi koodin kaivamista ja paljon lisäkuvien luomista. Sinun tarvitsee vain mennä verkkosivustolle www.themebeta.com/chrome-theme-creator-online.html, jossa on valmiiksi valmisteltu suuri tausta.

Chromium-pohjaiset selaimet eivät tue animoituja teemoja, mutta Opera tukee.

Päästyäsi palveluun, joka ei muuten liity mitenkään virallisesti Google-konserniin, näet vasemmalla työalueen, jossa kommenteilla varustetut työkalut (englanniksi) ja oikealla visualisoidun Chrome-selainikkunan. , jossa kaikki tehdyt muutokset näkyvät, ja alareunassa on painikkeita kuvan sijoittamiseksi suhteessa selainikkunaan.

Anna teeman nimi ja lähetä taustakuva. Välittömästi - tee paikannusasetukset tai jätä ne oletusarvoiksi.

”Värit”-välilehdellä voit määrittää selaimen eri paikoissa käytettävien fonttien värit. Vie hiiren osoitin minkä tahansa vasemmalla olevan vaihtoehdon päälle, jolloin muutoksen sijainti korostetaan punaisella visualisoidussa ikkunassa. Sinun tarvitsee vain työskennellä väripaletin kanssa valitaksesi tarvitsemasi värit.

Lataamatta paljon yllä käsiteltyjä lisäkuvia, selainikkunasi heijastaa Windowsin oletusvärimallia, ts. Teeman täydellisen "mukauttamiseksi" sinun on ladattava kaikki ehdotetut kuvat "kuvat" -välilehdelle artikkelin ensimmäisessä osassa ilmoitettujen kokojen mukaisesti.

Kun siirryt "Pack"-välilehdelle, sinulle annetaan kolme toimintoa, joista voit valita:

  1. Asenna tuloksena oleva teema selaimeen (muista ikkunan haittapuoli, kun avaat selaimen).
  2. Pakkaa teema tiedostomuotoon crx ja lataa se tietokoneellesi (tämä tiedosto on Chrome-selaimen teemojen ja laajennusten asennustiedosto).
  3. Lataa teeman "lähdekoodi" zip-arkistoon (voit ladata valmiin teeman heti verkkokauppaan).

Huomaan, että kun käytät tätä palvelua, teemasi sijoitetaan hakemistoon ja on muiden käyttäjien ladattavissa ja asennettavissa.

Jos olet kiinnostunut, seuraavissa viesteissä kuvailen animoitujen teemojen luomisprosessia Opera-selaimelle.

Tätä varten tarvitset erityisen verkkoteeman rakentajan, vähän inspiraatiota ja muutaman minuutin vapaa-aikaa. Jos kuitenkin kärsit perfektionismista, voit viettää useita tunteja. Olemme varoittaneet sinua. :)

Avaa siis verkkosovellus. Näet ikkunan vasemmalla puolella välilehdet, joissa on työkalut teemojen luomiseen, ja esikatselualue oikealla.

Tämän rakentajan avulla voit luoda teemoja puoliautomaattisessa tilassa. Mutta voit myös muokata kaikkea manuaalisesti, jotta lopputulos vastaa täysin makuasi.

1. Helppo tapa

Asia on tämä: lataat minkä tahansa kuvan rakentajaan, ja ThemeBeta käyttää sitä uuden teeman päätaustana ja säätää automaattisesti kaikki suunnittelun värit siihen.

Lisää oma kuvasi napsauttamalla Perus-välilehdellä Lataa kuva ja valitsemalla haluamasi kuva tietokoneeltasi. Jos haluat sitten muokata teeman värejä, napsauta Luo värejä.

Jos olet tyytyväinen tulokseen, napsauta Pakkaa ja asenna ja vahvista lataus ja teeman lisääminen Chromeen. Selain aktivoi uuden ulkoasun välittömästi.

Jos haluat automaattisen asennuksen jälkeen muuttaa värejä tai lisätä erillisiä taustoja eri teemaelementeille, tarvitset työkaluja muiden välilehtien alla. Lisätietoja niistä on artikkelin seuraavassa kappaleessa.

2. Edistynyt menetelmä

Tässä menetelmässä taustat ja tekstin värit asetetaan manuaalisesti uudelle teemalle.

Voit valita kuvia tai värejä eri suunnitteluelementtien taustaksi käyttämällä Kuvat-välilehden työkaluja. Vie hiiren osoitin minkä tahansa työkalun päälle, ja oikealla olevassa ikkunassa suunnittelija näyttää, mitä teeman osaa se muuttaa. Esimerkiksi NTP-taustaa käytetään päätaustan määrittämiseen. Ja välilehden tausta antaa sinun valita sivuston otsikon taustan.

Kun olet selvittänyt taustat, voit mukauttaa tekstin värejä Värit-välilehdessä. Täällä kaikki toimii samalla tavalla. Siellä on luettelo työkaluista, osoita mitä tahansa niistä - ja oikealla olevassa ikkunassa näet, mistä se vastaa.

Kun olet lopettanut taustat ja tekstin värit, avaa Pakkaa-välilehti ja napsauta Pakkaa ja asenna ladataksesi ja ottaaksesi valitsemasi teeman käyttöön.

Lisäksi voit aina valita ja asentaa yhden monista valmiista teemoista ThemeBeta-tietokannasta tai virallisesta Google-luettelosta. Jos haluat palata jatkossa vakiomuotoon, siirry Chromen asetuksiin ja napsauta Teemat-kohdan vastapäätä kohtaa Oletusasteikko.

19nar

Tässä ohjeessa kerron kuinka nopeasti ja helposti luo teema Google Chrome -selaimelle. Tämä on helpoin tapa, mutta varmuuden vuoksi kirjoitan kaiken ylös yksityiskohtaisesti.

Mitä tarvitset:
- Sovellus
- Oma Chrome-teema
- Rekisteröityminen Googlessa

1. Avaa ensin Chrome ja siirry sovelluksiin.

2. Siirry nyt kauppaan. (älä pelkää, sinun ei tarvitse ostaa mitään).

3. Kirjoita hakuun My Chrome Theme ja paina Enter.

4. Etsi My Chrome Theme -sovellus ja napsauta Ilmainen-painiketta.

5.Tällainen ikkuna tulee näkyviin, napsauta Lisää. Muuten, kun napsautat Ilmainen-painiketta, saatat joutua kirjautumaan Googleen.

6. Nyt odotamme sen lataamista ja asentamista.

7. Siirry nyt uudelleen kohtaan Sovellukset ja valitse Oma Chrome-teema.

8. Napsauta Aloita teeman tekeminen

9. Täällä voit nyt valita, lataatko kuvan tietokoneeltasi vai verkkokamerasta. Minun tapauksessani lataan tietokoneeltani.

10. Valitse kuva tai valokuva.

11. Muokkaa nyt kuvan tai valokuvan sijaintia ja napsauta Jatka vaiheeseen 2.

12.Tässä napsautamme siveltimiä ja valitsemme värit jokaiselle elementille erikseen. Napsauta sen jälkeen Jatka vaiheeseen 3.

13. Kirjoita teeman nimi ja napsauta Tee oma teema!

15. Latausten alareunassa näkyy uusi lataus. Napsauta Seuraava.

16. Napsauta nyt Lisää.

17. Ja me ihailemme. Totta, minun tapauksessani valokuva ei ole sopiva. Niille, jotka ovat tunteneet Internetin pitkään, tämä ohje näyttää hauskalta, koska kaikki on kuvattu liian yksityiskohtaisesti. Mutta älkäämme unohtako, että jotkut ihmiset eivät ole niin asiantuntijoita Internetin käytössä ja he vaativat yksityiskohtaisen kuvauksen.

Jos vietät paljon aikaa Internetissä, selaimen ulkonäkö on yhtä tärkeä kuin sen toimivuus tai nopeus. On paljon mukavampaa työskennellä kauniilla, ergonomisella käyttöliittymällä, jossa värit, kuvakkeet, säätimet ja taustakuvat on valittu optimaalisesti. Google Chrome -selaimella on helppo asentaa ja vaihtaa teemoja, mutta jos mikään niistä ei sovi sinulle, voit helposti luoda oman.


Syy tämän huomautuksen kirjoittamiseen oli selaintiimin virallisen laajennuksen julkaiseminen. Sen avulla voit luoda oman ainutlaatuisen mallin suosikkiselaimellesi kolmessa yksinkertaisessa vaiheessa. Kun olet asentanut tämän laajennuksen, asennettujen sovellusten välilehteen tulee uusi kuvake. Napsauttamalla sitä käynnistää ohjatun uuden teeman toiminnon.


Ensimmäisessä vaiheessa meitä pyydetään lataamaan taustakuva kuvan tai verkkokameran kuvan muodossa. Ladattu tausta näkyy heti esikatseluikkunassa ja sen sijaintia ja sijaintia voidaan säätää. Voit milloin tahansa peruuttaa tehdyt muutokset tai siirtyä seuraavaan vaiheeseen napsauttamalla painiketta Jatka vaiheeseen 2.


Seuraavassa vaiheessa voimme muuttaa selainikkunan päävärejä. Napsauttamalla painikkeita, joissa on siveltimen kuva, meitä pyydetään valitsemaan yksi kolmestakymmenestä perusväristä uudelle välilehdelle, taustavälilehdelle ja ikkunan taustalle.

Kuten näet, oman teeman luominen Googlen omalla laajennuksella on hyvin yksinkertaista.

Pyrimme aina räätälöimään kaiken, mukauttamaan sen itsellemme ja muokkaamaan sitä uudelleen mieltymystemme ja makujemme mukaan. Tietokone ei ole tässä suhteessa poikkeus. Loppujen lopuksi oikein valittu kuva näytönsäästäjäksi tai yksinkertaisesti silmää miellyttävät värit voivat viedä tietokoneen käyttömukavuuden aivan uudelle tasolle.

Kuka meistä ei ole vaihtanut Windowsin taustakuvaa? Nykyään on harvinaista tavata sellaista henkilöä. Joillakin on kissoja, toisilla kaunis nuori nainen ja toisilla on abstraktio.

Tiesitkö, että samanlaisia ​​näytönsäästäjiä voi asentaa Google Chrome -selaimeen? Vain siellä niitä kutsutaan teemoiksi.

Jos olet kyllästynyt oletusvalkoiseen kankaaseen, lue, kuinka voit tehdä sen muuta teemasuunnittelua Google Chromessa.

Teeman (aloitusnäytön) vaihtaminen Chromessa

Vaihda teemaa Google Chromessa voit seurata seuraavia ohjeita:

Voit myös seurata linkkiä suoraan.

Tässä osiossa näet valtavan gallerian kaikenlaisista aiheista. Jotkut niistä ovat Googlen suunnittelijoiden luomia ja osan taiteilijoiden luomia. Ne ovat kaikki ilmaisia.

Kun löydät haluamasi aiheen, vie hiiri sen päälle ja napsauta ponnahdusikkunaa "ilmaiseksi".

Muita teemoja Google Chromen lataamiseen

Toinen teemojen lähde on kolmannen osapuolen suunnittelijat. Kuten kävi ilmi, niitä on hyvin, hyvin paljon. Ne ylittävät usein huomattavasti standardit laadultaan, monipuolisuudesta puhumattakaan.

Lataa Google Chrome -teemat:

Ladatuilla tiedostoilla on CRX-laajennus (joskus ne voidaan pakata). Asenna ne purkamalla ja vetämällä teematiedostot selainikkunaan.

Teeman (skin) generaattori Google Chromelle

Jos yllä olevat menetelmät eivät tuota tuloksia, sinun tulee käyttää aihegeneraattoriOma Chrome-teema, jonka voi ladata samasta "Verkkokauppa".

Suora latauslinkki.

Tämän sovelluksen käyttäminen on hyvin yksinkertaista: lataat kuvan, muokkaat värimaailmaa ja käsittelet sitä käytettävissä olevilla työkaluilla.