Tyylit 1001site-luettelosta
Tyyli on ennalta suunniteltu verkkosivustomalli, joka perustuu tunnettuun alustaan: värit, fontit, painikkeiden ja korttien muodot sekä animaatiot. 1001site-luettelo sisältää 1 000 tyyliä. Valitse malli, napsauta "Käytä", ja verkkosivustosi suunnitellaan kyseisellä tyylillä.
Kenelle tämä sopii?
Kaikille, jotka haluavat kauniin verkkosivuston ilman suunnittelijaa. Voit muuttaa tyyliä niin monta kertaa kuin haluat.
Mistä valita tyyli#
- Tililläsi: Asetukset → Etusivu ja valikko → "Sivuston tyyli" → "Valitse tyyli" (tai "Valitse toinen"). Tai noudata oppaan vaihetta 2.
- Hakemistosivustolla 1001site.com: avaa tyyli ja napsauta kortin alareunassa olevaa "Käytä tauluun". Jos olet jo kirjautunut sisään, tyyli otetaan käyttöön välittömästi.
- Valitse rekisteröitymisen yhteydessä luettelosta "Hanki se" → "Kaikki sisältyy". Tyyli muistetaan ja otetaan käyttöön maksun jälkeen.
Askeleet#
Vaihe 1. Avaa luettelo#
Napsauta "Sivuston tyyli" -osiossa "Valitse tyyli". Kortteja sisältävä ikkuna avautuu. Vie hiiri kortin päälle nähdäksesi videon esimerkkisivustosta.
Vaihe 2. Löydä tyyli#
Haku hakee tuotemerkin, värin, fontin ja luokan mukaan. Esimerkiksi: "omena", "minimalistinen", "tumma", "kauppa".
Vaihe 3. Napsauta Käytä#
Muutamassa sekunnissa tyyli otetaan käyttöön: värit, fontit, pyöristys, varjot ja animaatiot. Valitun tyylin nimi ja esikatselu näkyvät "Sivuston tyyli" -osiossa. Avaa sivusto napsauttamalla "Katso tulos" -linkkiä.
Mikä muuttaa tyyliä#
| Mitä | Miten |
|---|---|
| Värit | Tausta, kortit, teksti, korostus. Oletusarvoinen vaalea tai tumma teema – kuten esimerkissä. |
| Fontit | Esimerkkifontin kaltainen fontti on valittu Google Fontsista |
| Lomake | Nappien ja korttien pyöristäminen, litteät kortit tai varjostetut kortit, tiheys |
| Animaatiot | Yksi neljästä sarjasta: rauhallinen, pehmeä, hehkuva, dynaaminen |
| Kotiin | Jos "suunnittelukotisivu" -kytkin on käytössä, yläreunaan lisätään pääelementti, jossa on sivuston nimi ja tyylin iskulause. |
Tyyli ei vaikuta tekstiisi, tuotteisiisi, kategorioihisi, sivuihisi tai CSS:ään. CSS-muokkauksesi tallennetaan tyylilohkon viereen.
Tyyli ja tekoälyavustaja#
Tyylin valinnan jälkeen tekoälyassistentti kokoaa kotisivun ja sivut kyseisen tyylin suunnitteluohjeiden perusteella: sommittelu, kuvasto, typografia ja tekstin sävy. Tämä on sama periaate kuin suunnittelijoilla: tyyli → suunnittelujärjestelmä → sivut.
Muuta tai poista tyyli#
- Muuta: "Valitse muu" → valitse uusi → "Käytä". Edellinen tyylilohko korvataan, sitä ei lisätä.
- Poista: roskakorikuvake tyylin esikatselusta. Tämä poistaa tyylin CSS:n ja nimen. Värit ja fontit pysyvät ennallaan – voit säätää niitä brändäyksessä tai pyytää avustajaa "nollaamaan ulkoasun".
Tyylitiedostot#
Jokaisella luettelon tyylillä on tiedostoja, jotka tekoälytyökalut ymmärtävät:
- DESIGN.md (täydellinen ja kompakti) — tyylin kuvaus: värit rooleineen, fontit, koot, sisennykset, tee-/älä-säännöt.
- Tailwind v4 on Tailwindin teema.
- CSS-muuttujat - CSS-muuttujat.
- Design Tokenit — JSON tokeneilla.
Tiedostoja voi kopioida tai ladata tyylin luettelosivulta. Ne on helppo antaa Claudelle, ChatGPT:lle, Cursorille tai avustajallemme: "Tee se tällä tyylillä." Katso tyyliluettelo.
Tariffit#
Tyylin lisääminen verkkosivustollesi on saatavilla maksullisilla paketeilla. Ilman pakettia tyyli tallennetaan ja otetaan käyttöön automaattisesti maksun jälkeen.
Kysymyksiä ja vastauksia#
Tyyliä käytettiin, mutta sivusto ei näytä esimerkin kaltaiselta. Miksi?#
Tyyliin kuuluvat värit, fontit, muodot ja animaatiot. Sivun rakenne ja valokuvat ovat sinun. Jotta kotisivu näyttäisi esimerkin mukaiselta, kysy tekoälyassistentilta: "Suunnittele kotisivu sivuston tyyliin: sankari, edut, galleria, yhteystiedot."
Voinko käyttää tyyliä useilla sivustoilla?#
Kyllä, tyyliä käytetään nykyisellä sivustolla. Vaihda sivustoa kojelaudassa ja käytä tyyliä uudelleen.
Muutin värin manuaalisesti ja käytin sitten tyyliä. Kumpi voittaa?#
Tyyli. Tyylin värit korvaavat manuaalisesti valitut värit. "Koodi ja widgetit" -osiosta muokattu CSS säilyy.
Mistä esimerkit tulevat?#
Avoimesta luettelosta suosittuja verkkosivustotyylejä. Videot ja julisteet tallennetaan palvelimellemme.