Pop

Et minimalistisk tema som er designet til å gjøre innholdet ditt tilgjengelig. Pop er ideelt for butikker med lagerbeholdninger som er små til middels. Pop er designet rundt et stort sidefelt for navigasjon som gjør innholdet ditt lett tilgjengelig.

Eksempel på nettbutikk som bruker Pop

Temaredaktør

Bruk temaredigering til å tilpasse temaet. Verktøyslinjen i temaredigereren er delt inn i Seksjoner og Temainnstillinger.

Verktøyslinjen i temaredigereren viser Seksjoner og Temainnstillinger.

Du kan bruke seksjoner til å modifisere innholdet og oppsettet til de ulike sidene i butikken din. Du kan bruke temainnstillingene til å tilpasse butikkens skrifttyper og farger, foreta endringer i koblinger til sosiale medier og kasseinnstillinger.

Seksjoner er egendefinerbare blokker med innhold fra ulike sider på nettbutikken din.

  • Hjemmesideseksjoner inkluderer funksjoner som f.eks. en lysbildeserie eller en registreringsfunksjon for nyhetsbrevet, som du kan legge til, flytte eller fjerne. Du kan ha opptil 25 seksjoner på hjemmesiden.

  • Hver type har sine egne seksjoner. For eksempel fastslår produktside-seksjonen oppsettet til hver produktside i nettbutikken din.

  • Sideseksjoner hører alltid til i spesifikke steder i nettbutikken. Du kan tilpasse sideseksjonene, men du kan ikke omorganisere eller fjerne dem.

  • Hvert tema inkluderer faste seksjoner som f.eks. topp- og bunntekst, som vises på alle sidene i nettbutikken.

Du kan lese mer om sine unike utvalg av seksjoner og hvordan du tilpasser dem slik at de passer til virksomeheten din.

Pop inkluderer følgende statiske deler:

  • Logo og meny
  • Kunngjøringslinje
  • Bunntekst
  • Produktsider
  • Samlingsider
  • Samlingsliste-side
  • Artikkel

Dynamiske seksjoner

Du kan legge til, flytte og fjerne disse seksjonene for å tilpasse hjemmesidens oppsett. Hvert tema har et unikt sett med seksjoner du kan velge fra.

Pop inkluderer følgende dynamiske deler:

  • Blogginnlegg
  • Samlingsliste
  • Fremhevet samling
  • Bilde med tekst
  • Lysbildefremvisning
  • Utvalgt produkt
  • Nyhetsbrev
  • Kart
  • Rik tekst
  • Video
  • Tilpasset HTML

Produktsider

I Produktside-delen kan du legge til eller fjerne disse elementene:

  • Produktmerket eller leverandøren
  • Bildezoom
  • Relaterte produkter
  • En mengdevelger
  • En dynamisk knapp for å gå til kassen
  • Ikoner for deling på sosiale medier

Slik redigerer du innstillingene for produktsider:

  1. Fra rullegardinmenyen i den øverste linjen velger du Produktsider.

  2. Klikk på Deler.

  3. Klikk på Produktside.

  4. Merk av for Vis produktleverandør for å vise produktmerket eller leverandøren. Du må legge til en leverandør i produktet for å vise en merkevare eller leverandør.

  5. For å la kunder zoome inn ved å holde musepekeren over et produktbilde merker du av for Aktiver bildezoom.

  6. Merk av for Vis relaterte produkter for å vise et utvalg av relaterte produkter nederst på siden. Samlingen som produktet tilhører, fastslår hvilke relaterte produkter som vises. For at relaterte produkter skal vises, må du opprette en samling for produktet eller legge det til i en eksisterende samling. Hvis produktet ikke er en del av en samling, vises ingen relaterte produkter.

  7. Merk av for Vis mengdevelger for å vise en mengdevelger.

  8. For å vise en dynamisk knapp for å gå til kassen merker du av for Vis dynamisk knapp for å gå til kassen.

  9. Merk av for Aktiver produktdeling for å vise ikoner for deling på sosiale medier.

  10. Klikk på Lagre.

Nyhetsbrev

Du kan legge til registrering for nyhetsbrev på hjemmesiden. På den måten kan du samle inn kunders e-postadresser for markedsføringskampaner via e-post. Du kan lese mer om e-postmarkedsføring på Shopify-bloggen.

Nyhetsbrev-seksjonen på et nettsted. Dette er et felt der kunder kan oppgi en e-postadresse og en knapp merket «Abonner».

Slik legger du til registrering for nyhetsbrev på hjemmesiden:

  1. Find Pop and click Customize.

  2. Klikk på Deler.

  3. Klikk på Legg til seksjon > Nyhetsbrev.

  4. Skriv inn en overskrift for registrering for nyhetsbrevet ditt i Overskrift-feltet. Standardoverskriften er «Abonner på nyhetsbrevet vårt».

  5. Skriv inn en underoverskrift for registrering for nyhetsbrevet ditt i Undertekst-feltet. Standardteksten er «Kampanjer, nye produkter og salg. Direkte til innboksen din.»

  6. Angi bakgrunnsfargen for delen med registrering for nyhetsbrev ved å klikke på Bakgrunnsfarge-kartet og velge en farge.

  7. Klikk på Lagre.

Video

Du kan legge til en video fra YouTube eller Vimeo på startsiden din. Videoer kan engasjere kunder og skape interesse for forretningen din.

Slik legger du til en video på hjemmesiden din:

  1. Find Pop and click Customize.

  2. Klikk på Deler.

  3. Klikk på Legg til seksjon > Video.

  4. Skriv inn en overskrift for videoen din i Overskrift-feltet.

  5. Skriv inn delingskoblingen for videoen i Videokobling-feltet.

    En delingskobling for YouTube ser slik ut: https://youtu.be/OTJXAUZY9t0. Du kan finne ut hvordan du kopierer delingskoblingen for en YouTube-video i denne YouTube-hjelpeartikkelen.

    En delingskobling for Vimeo ser slik ut: https://vimeo.com/281332510. Du kan finne ut hvordan du kopierer delingskoblingen for en Vimeo-video i denne Vimeo-hjelpeartikkelen.

  6. Klikk på Lagre.

Tilpasset HTML

I Tilpasset HTML-seksjonen kan du bruke HTML-kode til å lage tilpasset innhold til hjemmesiden din. Du kan for eksempel bruke HTML til å formatere tekstblokker, opprette tabeller eller legge inn innhold fra et eksternt nettsted.

Slik legger du til tilpasset HTML på hjemmesiden:

  1. Find Pop and click Customize.

  2. Klikk på Deler.

  3. Klikk på Legg til del.

  4. I området Avansert oppsett klikker du på Egendefinert HTML > Legg til.

  5. Klikk på Egendefinert HTML og angi HTML-koden du vil legge til hjemmesiden.

  6. Klikk på Lagre.

Temainnstillinger Du kan bruke temainnstillingene til å tilpasse fargene og typografien i nettbutikken. Du kan også sette opp koblinger til kontoer på sosiale medier, redigere handlekurvinnstillinger og legge til et favicon.

Pop inkluderer følgende temainnstillinger:

  • Farger
  • Typografi
  • Favicon
  • Handlekurvside
  • Sosiale medier
  • Utsjekking

Farger

Du kan velge farger for de ulike delene av nettbutikken.

Tilpass fargeinnstillingene

  1. Ved siden av **klikker du på **Tilpass.

  2. Klikk på Temainnstillinger.

  3. Klikk på Farger.

  4. For hver type innhold klikker du på fargekartet for å bruke fargevelgeren:

    Fargevelgeren i redigeringsprogrammet for temaer.

- Området Nylig valgt viser farger som nylig har blitt valgt for temaet ditt. - Området I bruk nå viser farger du bruker nå i andre deler av temaet ditt

Du kan sette fargen til gjennomsiktig ved å klikke på Ingen.

  1. Klikk på Lagre.

Typografi

Du kan angi skrifttypens stil og størrelse for teksten i nettbutikken.

Tilpass typografiinnstillingene

  1. Ved siden av **klikker du på **Tilpass.

  2. Klikk på Temainnstillinger.

  3. Klikk på Typografi.

  4. For hver type tekst klikker du på Endre for å bruke fargevelgeren:

    «Endre»- knappen på skrifttypevelgeren

  5. Utforske skrifttyper ved hjelp av søkefeltet eller ved å klikke på Last inn mer.

    Du finner alle tilgjengelige skrifttyper i Shopifys skrifttypebibliotek.

  6. Klikk på navnet til skrittypen du vil endre.

  7. Du kan endre skrifttypen til en annen stil, f.eks. fet eller kursiv, ved å klikke på Vanlig. Klikk deretter på stilen du bil bruke og deretter på Velg:

    Et utvalg av skrifttykkelser som er tilgjengelige fra skrifttypevelgeren

  8. Klikk på Lagre.

Sosiale medier

Du kan legge til knapper for deling på sosiale medier på produktene og blogginnleggene dine og koblinger til kontoene dine på sosiale medier.

Slik tilpasser du innstillingene dine for sosiale medier:

  1. Find Pop and click Customize.

  2. Klikk på Temainnstillinger.

  3. Klikk på Sosiale medier.

  4. For å laste opp et bilde for deling på sosiale medier, klikker du på Velg bilde eller Utforsk gratisbilder i Bilde for deling på sosiale medier-området.

  5. I Sosiale kontoer-området skriver du inn koblingene til kontoene i de oppgitte feltene for å legge til koblinger til kontoene dine på sosiale medier. Oppgi fullstendige koblinger, for eksempel https://instagram.com/shopify eller https://twitter.com/shopify.

    Koblinger til kontoene dine på sosiale medier vises i bunnteksten til nettbutikken din.

  6. For å legge til knapper for deling på sosiale medier i produktene og blogginnleggene dine merker du av noen eller alle avmerkingsboksene i Alternativer for deling på sosiale medier-området.

    Du kan legge til disse knappene for deling:

- Del på Facebook - Tweet på Twitter - Fest i Pinterest (ikke tilgjengelig for deling av blogginnlegg)

  1. Klikk på Lagre.

Legg til undermenyer i sidefeltet

Du må opprette menyer i Navigasjon-siden din for å legge til rullegardinmenyer i hovedmenyen din. Denne artikkelen viser hvordan du gjør det.

En proporsjonalt kompakt logo ser best ut i Pop-temaet, siden temaet viser logoen i et sidefelt. Bannerlignende logoer med stor bredde og relativt liten høyde ser ikke bra ut i det temaet.

Maksimumsbredden for logoen er 450 piksler, og maksimumshøyden er 200 piksler. Størrelsen til den opplastede logofilen blir endret, slik at den passer disse begrensningene.

Det ideelle formatet er PNG.

Gjør logoen din større på mobilenheter

For å gjøre logoen din større i hvilket som helst oppsett er det først og fremst ekstremt viktig å beskjære all negativ plass eller gjennomsiktige piksler som omgir logografikken, før du laster opp filen til Shopify.

Her ser du en logo med masse negativ plass:

Her er samme logo når den er beskjært – når all negativ plass er blitt fjernet fra den:

Den ubeskjærte logoen vises nedenfor når den brukes i Pop-temaet:

Den beskjærte logoen vises nedenfor når den brukes i Pop-temaet:

Når du vet at logoen din ikke blir mindre på grunn av den negative plassen den inneholder, kan du justere høyden på overskriften for mobilenheter for å gi logoen rom til å bli utvidet. Dermed blir logoen større.

Gå til redigeringsprogrammet for temaer og øk verdien for «Størrelse > Høyde for mobilmeny» i Overskrift og navigasjon.

Gjør logoen din større i sidefeltet

For å gjøre logoen din større i hvilket som helst oppsett er det først og fremst ekstremt viktig å beskjære all negativ plass eller gjennomsiktige piksler som omgir logografikken, før du laster opp filen til Shopify.

Her ser du en logo med masse negativ plass:

Her er samme logo når den er beskjært – når all negativ plass er blitt fjernet fra den:

Logoen med negativ plass vises nedenfor når den er lastet opp i Pop-temaet:

Den beskjærte logoen vises nedenfor når den brukes i Pop-temaet:

Når du vet at logoen din ikke blir mindre på grunn av den negative plassen den inneholder, kan du justere bredden til sidefeltet for å gi logoen rom til å bli utvidet. Dermed blir logoen større.

Gå til redigeringsprogrammet for temaer og øk verdien for «Størrelse > Menybredde for datamaskin» i Overskrift og navigasjon.

Reduser mellomrom rundt logoen i sidefeltet

Før du fjerner fyll som er lagt til av Pop-temaet over og under logoen, er det ekstremt viktig å beskjære alt fyll som kan komme fra selve bildet. Du må beskjære den negative plassen eller gjennomsiktige pikslene som omgir logografikken, før du laster opp filen til Shopify.

Her ser du en logo med masse negativ plass:

Her er samme logo når den er beskjært – den negative plassen er blitt fjernet fra den:

Den ubeskjærte logoen vises nedenfor når den brukes i Pop-temaet:

Den beskjærte logoen vises nedenfor når den brukes i Pop-temaet:

Når du har lastet opp en beskjært logo til temaaktivaene dine, kan du justere bredden til sidefeltet ved å gå til redigeringsprogrammet for temaer. I Overskrift og navigasjon-delen redigerer du verdien «Størrelse > Menybredde for datamaskin" etter behovene dine.

Som et endelig, ustøttet tiltak kan du følge disse trinnene for å redusere fyll over og under logoen:

  1. Under Aktiva klikker du på timber.scss.liquid for å åpne stilarket for temaet i det nettbaserte redigeringsprogrammet for kode, eventuelt kan du gå til denne nettadressen.

  2. Nederst i filen legger du til dette:

```sass {% comment %} Følgende funksjon for mediespørring viser dette: @media screen and (min-width: 1025px) { ... } Sidefeltet vises bare når bredden > 1025 piksler. {% endcomment %}

@include at-query ($min, $large) { .header-logo { margin-bottom: 30px /* original is 60px */; }

.site-header {
   padding-top: 30px /* original is 90px */;

   .hr--small {
     margin: 0 auto 10px /* original is 15px auto 30px */;
   }
 }

} ```

  1. Lagre filen.

Rediger innstillingene for produktsiden

I Produktside-delen kan du legge til eller fjerne disse elementene:

  • Produktmerket eller leverandøren
  • Bildezoom
  • Relaterte produkter
  • En mengdevelger
  • En dynamisk knapp for å gå til kassen
  • Ikoner for deling på sosiale medier

Slik redigerer du innstillingene for produktsider:

  1. Fra rullegardinmenyen i den øverste linjen velger du Produktsider.

  2. Klikk på Deler.

  3. Klikk på Produktside.

  4. Merk av for Vis produktleverandør for å vise produktmerket eller leverandøren. Du må legge til en leverandør i produktet for å vise en merkevare eller leverandør.

  5. For å la kunder zoome inn ved å holde musepekeren over et produktbilde merker du av for Aktiver bildezoom.

  6. Merk av for Vis relaterte produkter for å vise et utvalg av relaterte produkter nederst på siden. Samlingen som produktet tilhører, fastslår hvilke relaterte produkter som vises. For at relaterte produkter skal vises, må du opprette en samling for produktet eller legge det til i en eksisterende samling. Hvis produktet ikke er en del av en samling, vises ingen relaterte produkter.

  7. Merk av for Vis mengdevelger for å vise en mengdevelger.

  8. For å vise en dynamisk knapp for å gå til kassen merker du av for Vis dynamisk knapp for å gå til kassen.

  9. Merk av for Aktiver produktdeling for å vise ikoner for deling på sosiale medier.

  10. Klikk på Lagre.

Beste typer produktbilder for Pop

Bilder med høyere oppløsning ser bedre og mer profesjonelle ut i Pop-temaet. Derfor bør du gå for bilder som er minst 1024 x 1024 piksler. Bilder blir automatisk skalert ned når det er nødvendig, så du bør bruke høyest mulig bildekvalitet.

Bilder med høyere oppløsning er spesielt viktig hvis du bruker Bildezoom-funksjonen, som du kan aktivere i redigeringsprogrammet for temaer i Produktsider-delen:

Ideelt sett har de utvalgte bildene for alle produktene dine samme bredde-til-høyde-forhold, slik at de ser best mulig ut på samlingsider.

Er du klar til å begynne å selge med Shopify?

Prøv det gratis