Lær hvordan du legger til en Twitter mate til din Shopify nettstedet lar merkevaren din vise frem sin sosiale tilstedeværelse på sider som hjemmesiden din, bloggen og til og med produktsider.
Den store delen med å bygge inn en Twitter feed på nettstedet ditt er at det oppdateres automatisk Twitter innhold på nettstedet ditt, noe som betyr at du ikke trenger å kopiere innlegg fra din Twitter side.
I tillegg a Twitter feed er en utmerket måte å injisere en betydelig mengde bilder på nettstedet ditt; mange merker bruker Twitter gallerier eller feeder for å fungere som deres hjemmeside-bildegallerier.
Det er to måter å legge til en Twitter mate til din Shopify nettside:
- Med en app
- Ved å bygge inn kode for en Twitter widget
I denne guiden vil vi lede deg gjennom begge metodene, slik at du kan bestemme hvilken som fungerer best for deg. Vi anbefaler å prøve hvert alternativ, siden du kan finne ut at det ene ser ut eller fungerer bedre enn det andre, avhengig av nettstedets layout og arbeidsflyt.
Fortsett å lese for å lære alt om hvordan du legger til en Twitter mate til en Shopify hjemmeside!
Hvordan legge til Twitter Mate til Shopify Nettsted
Til å begynne med skal vi utforske hvordan du legger til en Twitter mate til Shopify med en app. Det er flere Twitter apps i Shopify App Store, som alle gir unik funksjonalitet. Noen gir deg knapper på sosiale medier, Twitter antall følgere, eller til og med automatisk posting. Det vi derimot ser etter er en app for å synkronisere din nåværende Twitter feed, som viser et visst antall av de siste innleggene fra kontoen din (eller en annen offentlig konto).
Metode 1: Legg til Twitter Mate til Shopify med en app
Det er noen gratis og noen betalte, Twitter feed-apper tilgjengelig for nedlasting via Shopify App Store. I denne opplæringen bruker vi Zestard Twitter Feed-appen, siden den gir funksjonaliteten som kreves, og den er gratis. Hvis du bestemmer deg for en annen app, foreslår vi at du prøver ut alle gratisappene først, siden dette ikke akkurat er en funksjon du bør betale for.
For å begynne, installer Zestard Twitter Feed-app på din Shopify butikk. Hvis du fortsatt kommer i gang med Shopify, lære hvordan du lager din butikk her. Du kan finne apper ved å logge på din Shopify konto, og går til Legg til appereller navigere direkte til App Store.
Klikk Legg til app i Shopify App Store, altså Installer app når den bringer deg tilbake til dashbordskjermen med innformation om tillatelser og personvern.
Når den er installert, vil du se en ny fane for Twitter under Apps fanen i Shopify. Det er også en del om Hvordan bruke appen, som du kan følge for å sette den opp riktig.
Noe konfigurasjon er nødvendig før du kan se noen Twitter feeds på frontend. Gå til Tidslinjeinnstillinger å starte.
Denne siden inneholder flere felt for å tilpasse det generelle utseendet og innholdet i feeden.
Det viktigste feltet å fylle ut er Feednavn; skriv eller lim inn Twitter håndtaket du vil trekke fra. Det er mulig å vise feeden fra alle offentlige Twitter profil.
Andre innstillinger inkluderer:
- Fôrboksbredde
- Høyde på mateboks
- Feed-tema (lys eller mørk)
- Feed Limit (viser bare et visst antall nylige tweets)
- Datalink farge
- Bakgrunnsfarge for feed
Når du er ferdig med å tilpasse, sørg for at du klikker på Lagre endringer knappen for å gjengi en forhåndsvisning.
Etter å ha klikket Lagre endringer, genererer appen en forhåndsvisning av Twitter mate. Rull gjerne gjennom feeden og gå tilbake for å justere innstillingene basert på hva du ønsker å oppnå.
Rett over forhåndsvisningen ser du at appen også genererte en kortkode for feeden. Dette er en unik kodebit du kan lime inn hvor som helst på din Shopify nettsted. Klikk for å Kopier koden til utklippstavlen.
De Twitter Feed-appen viser en popup der du enkelt kan kopiere koden. Alt du trenger å gjøre er å bruke kortkoden CTRL + C (Command + C for Mac) for å kopiere kortkoden til datamaskinens utklippstavle.
Det kan være lurt å plassere Twitter lever av en Shopify nettsiden, for eksempel på Om oss-, Kontakt- eller Support-sidene dine. For å gjøre det, gå til Nettbutikk > Sider in Shopify. Åpne den nye siden du vil legge til feeden for. Klikk på <> (Vis HTML) for å bytte fra Visual Editor til HTML Code Editor.
Lim inn den tidligere kopierte kortkoden i HTML-editoren. Hvis det er annet innhold på siden, velger du bare hvor du vil at feeden skal gå, og setter inn koden der. Husk å lagre siden.
Naviger til frontenden av siden ved å forhåndsvise eller gå til nettadressen. Du vil nå se Twitter feed vises nøyaktig der du satte inn kortkoden.
Mange nettbutikkeiere vil heller lære å legge til Twitter mate til en Shopify hjemmeside. I så fall, Shopify gir en visuell tilpasning for hjemmesiden, noe som gjør det enda enklere å sette inn Twitter feed kortkode.
For det, gå til Nettbutikk > Temaer > Tilpass.
Deretter finner du området der du vil plassere Twitter mate. Klikk på Legg til seksjon knappen i dette området. Søk etter Tilpasset væske temadelen og sett den inn i Shopify.
De Tilpasset væske temaseksjonen presenterer flere innstillinger på venstre side. Den viktigste av dem er Tilpasset væske felt. Lim inn kortkoden som tidligere ble kopiert fra Twitter Feed-app.
Etter å ha klikket Spar, vil du se Twitter feed gjengitt i Shopify forhåndsvisning av hjemmesiden til høyre.
Du kan til og med tilpasse delen litt med alternativer for:
- Fargevalg
- Seksjon Polstring
- Custom CSS
Den siste måten å sette inn en kortkode fra Twitter Feeds-appen er ved å legge den til den faktiske temakildekoden. Dette anbefales vanligvis bare hvis du ønsker det Twitter feed for å vises globalt i visse seksjoner eller sider.
For å gjøre det, gå til Nettbutikk > Temaer in Shopify. Klikk på Ellipsis (…) for å vise flere alternativer. Klikk på Rediger kode fra rullegardinmenyen.
Velg theme.liquid fil og lim inn koden hvor du vil innenfor temakodingen. Som et alternativ kan du velge å endre maler or Seksjoner for mer kontroll over hvor Twitter feed vises.
Andre innstillinger finner du i Twitter Feed-appen inkluderer:
- Alternativer for å bygge inn en enkelt tweet (eller retweet)
- Et verktøy for å generere en Twitter deleknapp
- Alternativer for å vise hashtag-feeder
Metode 2: Legg til Twitter Mate til Shopify med en Embedded Twitter Widget
Twitter tilbyr en måte å publisere enhver offentlig tidslinje på nettstedet ditt. Dette betyr at du har muligheten til å vise merkevarens feed, eller innleggene fra en annen konto.
For å komme i gang, gå til Publisere.Twitter. Med.
Lim inn eller skriv inn URL-en til Twitter profilen du vil vise som en feed på din Shopify butikk. Klikk på pilknappen for å fortsette.
Her har du to alternativer:
- Innebygd tidslinje
- Twitter knapper
De Twitter knapper er nyttige for å legge til en følg eller nevne-knapp et sted på nettstedet ditt. Men for denne artikkelen er vi mer fokusert på å få en Twitter feed skal vises. Så velg Innebygd tidslinje alternativet.
Twitter genererer automatisk Twitter feed-widget-kode. Vi foreslår imidlertid at du klikker på Angi tilpasningsalternativer link til format feeden fullstendig før publisering på nettstedet ditt.
Dette avslører flere innstillinger for å endre utseendet til feed-widgeten din:
- Høyde
- Bredde
- Se (mørkt eller lys)
- Språk (Du kan vanligvis bare gå med Automatisk)
Klikk på Oppdater-knapp for å se endringene dine i forhåndsvisningen nedenfor. Som du kan se, vår enkle endring fra Lett til mørk allerede gjengitt i forhåndsvisningen.
Når du er fornøyd med måten du Twitter feed ser ut, klikk på Kopier kode for å kopiere widgetkoden til datamaskinens utklippstavle.
Nå er det på tide å lære hvordan du legger til Twitter mate til din Shopify nettsted. Det enkleste alternativet er å plassere feeden på din Shopify hjemmeside, via en Shopify seksjon.
Gå til Nettbutikk > Temaer > Tilpass å åpne Shopify visuell tilpasning. Finn området på hjemmesiden du vil sette inn Twitter mate. Klikk på en av Legg til seksjon knapper for å avsløre Shopifysin samling av seksjoner. Bla gjennom listen eller søk etter Tilpasset væske seksjon. Klikk for å legge det til på siden.
Bruke Tilpasset væske feltet for å lime inn den tidligere kopierte koden (fra Twitter nettsted). Juster gjerne andre seksjonsinnstillinger som Fargevalg, Seksjon Polstringeller Custom CSS.
Du vil legge merke til at til å begynne med er alt som vises en lenke til dine tweets Twitter konto.
Du må bare klikke på Spar knapp for Shopify å gjengi Twitter feed i tilpasset forhåndsvisning.
En ekstra måte å legge til en Twitter feed via innebygd kode er ved å plassere den på en bestemt side i Shopify. Gå til Nettbutikk > Sider for å oppnå dette. Åpne siden du vil redigere.
Når du er i sideredigeringsprogrammet, klikker du på Vis HTML (<>) knapp. Dette bytter fra Visual Editor til Custom HTML Editor, som kreves for å legge til kode.
Lim inn koden du opprinnelig kopierte fra Twitter. Klikk på Spar or Publiser knappen for at endringene skal tre i kraft.
Enten forhåndsvis siden eller gå til frontend-visningen. Her vil du se Twitter feed som vises sammen med annet innhold du kan ha hatt på den siden.
Den siste måten å bygge inn en Twitter widget med kode er ved å bruke Shopify temafiler. Gå til Nettbutikk > Temaer å begynne. Velg Ellipsis (…) knappen, velg deretter Rediger kode.
De theme.liquid fil gir deg full kontroll over temaet du for øyeblikket har installert på Shopify. Lim inn Twitter feedkode der du vil at feeden skal vises i temaet. Annenwise, er det mulig å bruke Mal og Seksjon filer i tilfelle du heller vil Twitter feed vises bare i visse deler av nettstedet ditt, for eksempel i sidefeltet.
Slik legger du til en Twitter Mate til en Shopify Nettside!
Du har kanskje lagt merke til at du bruker en Shopify app oppretter fortsatt en kortkode som du kan plassere hvor som helst på nettstedet ditt. Det kan få deg til å spørre: "hva er vitsen med å bruke en app?" Det er tre grunner:
- Å bruke en app betyr at alt arbeidet ditt er samlet i ett dashbord: Shopify.
- Det er langt flere tilpasningsinnstillinger tilgjengelig i Twitter Feed-apper sammenlignet med det som tilbys gjennom Twitter innebygd widget.
- En kortkode er i det minste litt mindre skremmende enn koden levert av Twitter.
Og det er alt som skal til! Vi håper vår komplette guide om hvordan du legger til Twitter mate til Shopify har hjulpet deg med å finne ut om en plugin eller kodewidgeten er riktig for nettbutikken din. Vi oppfordrer deg til å se på andre apper for å bygge inn alternative sosiale medier-feeder, som en Instagram-feed, eller til og med for å vise noe som sosiale bevis eller TikTok-videoer. Gi oss beskjed i kommentarfeltet hvis du har spørsmål!
Kommentar 0 Responses