Verkkosivuston galleria

Pixpa antaa sinulle paljon hallintaa kuvien näyttämisessä gallerioissasi.

Galleriatyylivaihtoehtojen avulla voit hallita täysin kuviesi näyttämistä galleriassa yhdessä gallerian asettelun kanssa.

Vinkki: Gallerian koko sivuston tyyliasetukset otetaan automaattisesti käyttöön kaikissa luomissasi uusissa gallerioissa.
Katso myös: Kuinka ohittaa sivustonlaajuinen galleriatyyli tietyssä galleriassa?


Tässä artikkelissa:

    1. Gallerian asettelu
    2. Grid Style
    3. Ruudukon värit
    4. Hover-tyyli
    5. kuvan nimi
    6. Kuvan reuna
    7. Lightbox -näyttö
    8. Mobiili näyttö

Voit mukauttaa koko sivuston kattavan gallerian asetuksia Design (1) jakso.

Kun olet Suunnittelu-osiossa, napsauta Galleries (2) -välilehti.

Vaihtoehtoisesti voit käyttää myös studion hakuvaihtoehtoa.

  • enter Galleries (1) hakupalkissa.
  • Napsauta aiheeseen liittyvistä tuloksista -kuvaketta Suunnittelu – Galleriat vaihtoehto (2).


  1. Asettelu: Valitse asettelu, jota käytetään galleriassa.
    Opi muuttamaan gallerian asettelua.
  2. Leveys : Valitse gallerian leveys.
    • "Täysi leveys' näyttää gallerian peittäen koko leveyden jättämättä marginaalia.
    • "boxed' näyttää gallerian jättäen jonkin verran täytettä näytön oikealle ja vasemmalle puolelle.
    • "Sivuston leveys' voidaan määrittää suunnitteluosiossa. Täällä voit määrittää kiinteän leveyden.
      Se näyttää gallerian noudattamalla määritettyä kiinteää leveyttä.


 

  1. Ruudukkoväli: Määritä kourutila kuvien välillä ruudukkoasetteluissa. (0–250 pikseliä) 
  2. Kuvan kulman säde: Käytä reunasädettä, jotta kuvan kulmat pyöristetään galleriaruudukoissa.

Esimerkiksi, The Lyhty teeman kotigalleriassa on 142 kuvapisteen ruudukkoväli.  

Kun olet lisännyt Image Corner Radiuksen, näet kuvissa pyöristetyt reunat kuten kohdassa Jälkeen sapluuna.


Pohjan peittävyys: Jos olet valinnut hover-tyypin kuvan korostusväriksi, aseta ruudukon pohjan peittävyys tästä. 

 

  1. Pohja: Perusväriä käytetään ruudukon muodostamiseen ja se näkyy vain hetken ennen kuvien lataamista. Sinulla on kaksi vaihtoehtoa ruudukon perusvärille.
    • Valitse väri: Valitse tämä vaihtoehto asettaaksesi tietyn värin ruudukon pohjalle. Määritä mikä tahansa väri ja peittävyys ruudukon pohjalle.
    • Korostusväri : Käytä kuvan korostusvärejä ruudukon pohjassa. Tämä antaa monivärisen ruudukon käyttämällä kunkin kuvan korostusvärejä.
  2. Pohjan peittävyys: Jos olet valinnut korostusväriksi perustyypin, aseta ruudukon pohjan peittävyys tästä. 
  3. Vie hiiri:  Tämä vaikuttaa ruudukkoon, kun kohdistin on kuvan päällä.
    • Valitse väri: Aseta oletusarvoinen hover-väri ja sen peittävyys, jos olet valinnut ruudukkokuvillesi Valitse väri. 
    • Korostusväri : Käytä kuvan korostusvärejä ruudukon pohjassa. Tämä antaa monivärisen ruudukon käyttämällä kunkin kuvan korostusvärejä.
  4. Hover Opacity: Jos olet valinnut korostusväriksi hover-tyypin, aseta ruudukon pohjan peittävyys tästä. 

 

Kuvan korostusväri on kuvan hallitseva väri, joka valitaan, kun lataat minkä tahansa kuvan.


Hover-tehostetta käytetään vain ruudukkoasettelussa. Voit näyttää seuraavat vaihtoehdot viemällä hiiri ruudukkotilassa.

  1. Ei vaikutusta – Ei vaikutusta kuviin ruudukkotilassa.
  2. Väri – Vain hover-värit kuvissasi ruudukkotilassa.
  3. Väri ja kuvan otsikko – Kuvan hover-värille kuvan otsikon kanssa. Voit määrittää hover-värin ja kuvan otsikon tekstin värin/fontin/koon/painon kohdassa seuraava vaihtoehto.
  4. Väri ja kuvake – Kuvan hover-värille kuvakkeella.
  5. Väri, kuvan otsikko ja kuvake – Kuvan hover-värille, kuvan otsikolle ja kuvakkeelle. Voit myös lisätä kuviisi kuvakkeita, kuten plus, nuoli, risti ja silmä. 


Hover-kuvake

  • Hover-kuvakkeita käytetään vain gallerioiden ruudukkoasetteluissa. Voit valita, näytetäänkö kuvillesi kuvake ruudukkotilassa.
  • Vaihtoehdot ovat plus, nuoli, risti ja silmä. Tämä on käytettävissä vain, kun kuvake on valittuna leijuva vaikutus pudotusvalikosta. 


  1. Tätä käytetään, kun päätät näyttää kuvien otsikot hiirellä.


Pixpa tarjoaa monipuolisen kuvan reunusominaisuuden, jonka avulla voit parantaa verkkosivustosi visuaalista houkuttelevuutta lisäämällä reunuksia kuvien ympärille. Klikkaa tästä saadaksesi lisätietoja kuvan reunuksesta


1. Avaa Lightbox

  • Kun kuvat näytetään ruudukossa, kuvan napsauttaminen avaa sen Lightbox-tilassa (koko kuvan näyttö).
  • Voit ottaa tämän käyttöön tai poistaa sen käytöstä täältä. 

Tarkista Lightbox-tila toiminnassa


2. Ota zoomaus käyttöön

  • Ota kuvien zoomaus käyttöön tai poista se käytöstä Lightbox-tilassa.
  • Zoomaustoiminto toimii niin työpöydällä kuin mobiilisivustoillakin.


3. Näyttöasetukset

  • Valitse, kuinka haluat näyttää kuvat täydessä kuvanäytössä.
  • Voit valita näytä vain kuvia, kuva pikkukuvilla, kuva tekstityksellä alareunassaja kuva otsikoineen oikealla

Esimerkiksi, galleria näytä vain kuva

Esimerkiksi, galleria näytä kuva pikkukuvien kanssa.

Esimerkiksi, galleria näytä kuva otsikolla pohja.

Esimerkiksi, galleria näytä kuva ja kuvateksti päällä oikein.


4. Peittoväriasetukset

Päällystyksen väri on taustaväri, joka näkyy, kun kuvia katsotaan valolaatikkotilassa. Peittokuvan värin säätäminen voi auttaa sovittamaan sivustosi ulkoasun ja tuntumaan ja tarjota kuvillesi yhtenäisen, hienostuneen esityksen lightbox-näkymässä.

  • Valitse Mukautettu väri -vaihtoehto asettaaksesi tietyn taustavärin kaikille valolaatikkotilassa katsotuille kuville. Voit määrittää haluamasi värin Päällystyksen väri asettaminen. Lisätietoja.
  • Valita Korostusväri soveltaa ainutlaatuista väriä kunkin kuvan korostussävyistä. Voit muokata tätä haluamallasi tavalla jokaiselle kuvalle erikseen. Lisätietoja.
  • Jos valitset Korostusväri-vaihtoehdon, voit säätää Sameus (läpinäkyvyys) taustaväristä.


5. Kuvanäkymä

Määritä Lightboxin näyttötila –

  • Mittakaava ja istuvuus – Kuvat skaalataan sopimaan käytettävissä olevalle selainalueelle, jotta koko kuva näkyy. 
  • Täysi verenvuoto – Kuvat mitoitetaan niin, että ne täyttävät koko käytettävissä olevan selainalueen – jotkin kuvan osat voivat jäädä pois, kun saavutetaan tämä koko näytön näyttö. 

Esimerkiksi, galleria scale ja fit -tila missä kuvat mahtuisivat käytettävissä olevaan selaimen korkeuteen. 

Esimerkiksi, galleria, jossa on a täysi verenvuoto tila jossa kuvia venytetään täyttämään käytettävissä oleva selaimen leveys. 


6. Hallintalaitteet

Valitse Lightbox-näkymässä, kuinka haluat näyttää navigointisäätimet, kuten kuvan tietokuvake, gallerian tietokuvake, ristikuvake, selaimen sovituskuvake jne. vaihtoehdot ovat:

  1. Aina näkyvissä (näyttää aina navigointiohjaimet kuvien päällä)
  2. Näytä hiirellä (navigointiohjaimet näkyvät vain, kun siirrät osoitinta näytöllä)
  3. kätketty (navigointisäätimiä ei koskaan näytetä). 

Esimerkiksi, galleria Aina näkyvissä navigointisäätimet.

Esimerkiksi, galleria näyttää päällä navigointisäätimet. 

Esimerkiksi, galleria kätketty navigointisäätimet.


7. Seuraava/edellinen tyyli

Valitse koko kuvanäytössä, kuinka haluat näyttää navigointinuolet.

  1. Kelluva : Navigointinuolet kelluvat. Siirrä kohdistin kuvan päälle ja napsauta näyttöä, kun nuoli tulee näkyviin, navigoidaksesi kuvien välillä. 
  2. Hihamerkki
  3. Nuolet
  4. Näytä nuoli ympyrässä
  5. kätketty : Poista navigointinuolet kokonaan käytöstä. 


8. Kuvatiedoston nimi

  • Valitse, näytetäänkö tiedostonimi, kun kuvaa katsotaan valolaatikkotilassa.

Katso toiminnassa: 


9. Suurin kuvakoko

Tämä asetus määrittää galleriakuviesi näkymisen enimmäisresoluution. valopöytätila. Voit valita seuraavista vaihtoehdoista:

  • Auto – Mukauttaa kuvan koon automaattisesti katsojan näytön ja laitteen resoluution perusteella. Järjestelmä valitsee älykkäästi sopivimman version kuvasta varmistaakseen optimaalisen selkeyden ja suorituskyvyn.
  • Kiinteät koot – 2048 pikseliä, 1500 pikseliä, 1000 pikseliä, 800 pikseliä tai 500 pikseliä. Kiinteän koon valitseminen tarkoittaa, että kaikki valopöytäkuvat näytetään kyseisellä enimmäisresoluutiolla käyttäjän laitteen tai näytön koon mukaan.
Huomautuksia

Jos alkuperäinen kuvasi ladattu on resoluutioltaan pienempi kuin valittu koko, se näytetään sen alkuperäinen resoluutioSitä ei suurenneta tai skaalata ylöspäin.


Diaesitysasetukset

  1. Diaesitys: Valitse autoplay käynnistääksesi diaesityksen automaattisesti koko kuvan katseluohjelmassa. Voit myös poistaa diaesityksen käytöstä.
  2. Nopeus : Valitse siirtymänopeus. Voit valita 1-10 sekuntia.
  3. Siirtymä: Valitse diaesityksen siirtymistyyli.

 

Katso diaesitys toiminnassa: 


Sävyvaihtoehdot

Tämä ominaisuus mahdollistaa Korostusväri kuvista, joita käytetään taustana, kun kuvia katsotaan Lightbox-tila. Tämä parantaa visuaalista kokemusta kohdistamalla taustan kuvan korostusväriin.

  1. Käytä Accent Color -väriä sävynä:
    • Oletusarvoisesti Lightboxin taustaväri käytetään katseltaessa kuvia Lightbox-tilassa.
    • Kun otat tämän vaihtoehdon käyttöön, Korostusväri Kuviin liittyvää väriä käytetään Lightboxin taustavärinä, mikä tarjoaa dynaamisemman ja visuaalisesti yhtenäisemmän ilmeen.
  2. Sävyn läpinäkyvyys:
    • Voit hallita läpinäkyvyyttä Aksenttivärisävy käyttämällä Sävy-liukusäädintä.
    • Läpinäkyvyyden säätäminen sekoittaa Korostusväri Lightbox-taustavärillä, jonka avulla voit saavuttaa saumattoman ja ammattimaisen estetiikan.


  1. Näytä muodossa: Valitse gallerian näyttäminen Image Slider tai ruudukkotilassa mobiilinäkymässä. 
  2. Ruudukon sarakkeet: Valitse 1 sarake tai 2 sarakenäkymä ruudukkonäytölle mobiilinäkymässä.
  3. Ruudukkoväli: - asettaa räystäskouru kuvien välissä mobiilinäkymä.


 

Etkö löydä etsimääsi?

Ota yhteyttä Pixpa-asiantuntijaan.

Pixpa Studio on juuri uudistettu. Päivitämme parhaillaan kaikkien ohjeartikkeleiden kuvakaappauksia.