Lær at tilføje en Twitter foder til din Shopify websted gør det muligt for dit brand at fremvise dets sociale tilstedeværelse på sider som din hjemmeside, blog og endda produktsider.
Den store del ved at indlejre en Twitter feed på din hjemmeside er, at den automatisk opdateres Twitter indhold på dit websted, hvilket betyder, at du ikke behøver at kopiere indlæg fra din Twitter .
Derudover a Twitter feed er en fremragende måde at injicere en betydelig mængde billeder på dit websted; mange mærker bruger Twitter gallerier eller feeds til at fungere som deres hjemmesides billedgallerier.
Der er to måder at tilføje en Twitter foder til din Shopify hjemmeside:
- Med en app
- Ved at indlejre kode for en Twitter widget
I denne guide vil vi lede dig gennem begge metoder, så du kan beslutte, hvilken der fungerer bedst for dig. Vi anbefaler, at du prøver hver mulighed, da du kan opleve, at den ene ser ud eller fungerer bedre end den anden, afhængigt af dit websteds layout og arbejdsgang.
Fortsæt med at læse for at lære alt om, hvordan du tilføjer en Twitter fodre til en Shopify hjemmeside!
Sådan tilføjes Twitter Foder til Shopify Hjemmeside
Til at begynde med vil vi undersøge, hvordan du tilføjer en Twitter fodre til Shopify med en app. Der er flere Twitter apps i Shopify App Store, som alle giver unik funktionalitet. Nogle giver dig knapper på sociale medier, Twitter antal følgere, eller endda auto-postering. Det, vi leder efter, er imidlertid en app til at synkronisere din nuværende Twitter feed, der viser et vist antal af de seneste indlæg fra din konto (eller en anden offentlig konto).
Metode 1: Tilføj Twitter Foder til Shopify med en app
Der er nogle gratis og nogle betalte, Twitter feed-apps, der kan downloades via Shopify App butik. I denne tutorial bruger vi Zestard Twitter Feed-app, da den giver den nødvendige funktionalitet, og den er gratis. Hvis du beslutter dig for en anden app, foreslår vi, at du prøver alle de gratis apps først, da dette ikke ligefrem er en funktion, du skal betale for.
For at begynde skal du installere Zestard Twitter Feed app på din Shopify butik. Hvis du stadig er i gang med Shopify, lære hvordan du opretter din butik her. Du kan finde apps ved at logge ind på din Shopify konto, og går til Tilføj apps eller navigerer direkte til App Store.
Klik Tilføj app i Shopify App Store altså Installer app når det bringer dig tilbage til dashboard-skærmen med oplysninger om tilladelser og privatliv.
Når den er installeret, vil du se en ny fane for Twitter Foder under Apps fane i Shopify. Der er også et afsnit om Sådan bruges den: appen, som du kan følge for at konfigurere den korrekt.
Der kræves en vis konfiguration, før du kan se nogen Twitter feeds på frontend. Gå til Tidslinjeindstillinger at begynde.
Denne side indeholder flere felter til tilpasning af feedets overordnede udseende og indhold.
Det vigtigste felt at udfylde er Fodernavn; skriv eller indsæt Twitter håndtag du vil trække fra. Det er muligt at vise feedet fra enhver offentlighed Twitter profil.
Andre indstillinger omfatter:
- Foderkassebredde
- Foderkassehøjde
- Feedtema (lys eller mørk)
- Feedgrænse (viser kun et vist antal seneste tweets)
- Datalink farve
- Feed baggrundsfarve
Når du er færdig med at tilpasse, skal du sørge for at klikke på Gem ændringer knappen for at gengive en forhåndsvisning.
Efter at have klikket Gem ændringer, genererer appen en forhåndsvisning af Twitter foder. Du er velkommen til at rulle gennem feedet og gå tilbage for at justere indstillinger baseret på, hvad du gerne vil opnå.
Lige over forhåndsvisningen kan du se, at appen også genererede en kortkode til feedet. Dette er en unik bit kode, som du kan indsætte hvor som helst på din Shopify internet side. Klik for at Kopi koden til din udklipsholder.
Twitter Feed-appen afslører en popup, så du nemt kan kopiere koden. Alt du skal gøre er at bruge kortkoden CTRL + C (Command + C til Mac) for at kopiere kortkoden til din computers udklipsholder.
Du ønsker måske at placere Twitter fodre på en Shopify webside, f.eks. på dine Om os-, Kontakt- eller Support-sider. For at gøre det, gå til Onlinebutik > Sider in Shopify. Åbn den nye side, som du vil tilføje feedet til. Klik på <> (Vis HTML) knappen for at skifte fra Visual Editor til HTML Code Editor.
Indsæt den tidligere kopierede kortkode i HTML-editoren. Hvis der er andet indhold på siden, skal du blot vælge, hvor du vil have feedet hen, og indsætte koden der. Sørg for at gemme siden.
Naviger til frontenden af den side ved at se en forhåndsvisning eller gå til dens webadresse. Du vil nu se Twitter feed vises præcis, hvor du indsatte kortkoden.
Mange onlinebutiksejere vil hellere lære at tilføje Twitter fodre til en Shopify hjemmeside. I det tilfælde, Shopify giver en visuel tilpasning til hjemmesiden, hvilket gør det endnu nemmere at indsætte Twitter feed kortkode.
For det, gå til Onlinebutik > Temaer > Tilpas.
Find derefter det område, hvor du gerne vil placere Twitter foder. Klik på Tilføj sektion knappen i dette område. Søg efter Brugerdefineret væske temaafsnit og indsæt det i Shopify.
Brugerdefineret væske temaafsnittet præsenterer flere indstillinger i venstre side. Den vigtigste af dem er Brugerdefineret væske Mark. Indsæt den kortkode, der tidligere er kopieret fra Twitter Feeds app.
Efter at have klikket Gem, vil du se Twitter foder gengivet i Shopify forhåndsvisning af hjemmesiden til højre.
Du kan endda tilpasse sektionen lidt med muligheder for:
- Farveskema
- Sektionspolstring
- Brugerdefineret CSS
Den sidste måde at indsætte en kortkode fra Twitter Feeds-appen er ved at føje den til den faktiske temakildekode. Dette anbefales generelt kun, hvis du ønsker det Twitter feed til at blive vist globalt i visse sektioner eller sider.
For at gøre det skal du gå til Onlinebutik > Temaer in Shopify. Klik på Ellipse (…) knappen for at afsløre flere muligheder. Klik på Rediger kode fra rullemenuen.
Vælg theme.liquid fil og indsæt koden, hvor du vil inden for temakodningen. Som et alternativ kan du vælge at ændre skabeloner or Sektioner for mere kontrol over, hvor Twitter feed vises.
Andre indstillinger kan du finde i Twitter Feed app inkluderer:
- Muligheder for at integrere et enkelt tweet (eller retweet)
- Et værktøj til at generere en Twitter deleknap
- Muligheder for at vise hashtag-feeds
Metode 2: Tilføj Twitter Foder til Shopify med en Embedded Twitter Widget
Twitter tilbyder en måde at offentliggøre enhver offentlig tidslinje på dit websted. Det betyder, at du har mulighed for at vise dit brands feed, eller indlæggene fra en anden konto.
For at komme i gang skal du gå til Offentliggøre.Twitter.com .
Indsæt eller indtast URL'en på Twitter profil, du gerne vil vise som et feed på din Shopify butik. Klik på pileknappen for at fortsætte.
Her har du to muligheder:
- Indlejret tidslinje
- Twitter Knapper
Twitter Knapper er nyttige til at tilføje en følg- eller nævn-knap et sted på dit websted. Men for denne artikel er vi mere fokuserede på at få en Twitter foder til at dukke op. Så vælg Indlejret tidslinje valgmulighed.
Twitter genererer automatisk Twitter feed-widget-kode. Vi foreslår dog, at du klikker på Indstil tilpasningsmuligheder link for at formatere feedet fuldt ud, før det udgives på dit websted.
Dette afslører flere indstillinger for at ændre udseendet af din feed-widget:
- Højde
- Bredde
- Se (mørkt eller lys)
- Sprog (Du kan normalt bare gå med Automatisk)
Klik på knappen Opdater knap for at se dine ændringer i forhåndsvisningen nedenfor. Som du kan se, er vores simple ændring fra Lys til Mørk allerede gengivet i forhåndsvisningen.
Når du er tilfreds med din måde Twitter feed ser ud, klik på Kopier kode knappen for at kopiere widgetkoden til din computers udklipsholder.
Nu er det tid til at lære, hvordan du tilføjer Twitter foder til din Shopify internet side. Den nemmeste mulighed er at placere foderet på din Shopify hjemmeside, via en Shopify sektion.
Gå til Onlinebutik > Temaer > Tilpas at åbne Shopify visuel tilpasning. Find det område på hjemmesiden, du gerne vil indsætte Twitter foder. Klik på en af de Tilføj sektion knapper til at afsløre Shopify's samling af sektioner. Rul gennem listen eller søg efter Brugerdefineret væske afsnit. Klik for at tilføje det til siden.
Brug Brugerdefineret væske felt for at indsætte den tidligere kopierede kode (fra Twitter internet side). Du er velkommen til at justere andre sektionsindstillinger som f.eks Farveskema, Sektionspolstring eller Brugerdefineret CSS.
Du vil bemærke, at i første omgang er alt, der vises, et link til dine tweets Twitter konto.
Du skal blot klikke på Gem knap til Shopify at gengive Twitter feed i tilpasset forhåndsvisning.
En yderligere måde at tilføje en Twitter feed via indlejringskode er ved at placere den på en bestemt side i Shopify. Gå til Onlinebutik > Sider at opnå dette. Åbn den side, hvor du vil redigere.
Når du er i sideeditoren, skal du klikke på Vis HTML (<>) knap. Dette skifter fra Visual Editor til Custom HTML Editor, som er påkrævet for at tilføje kode.
Indsæt den kode, du oprindeligt kopierede fra Twitter. Klik på Gem or Udgiv knappen for at ændringerne træder i kraft.
Se enten et eksempel på siden eller gå til dens frontend-visning. Her vil du se Twitter feed, der vises sammen med andet indhold, du måtte have haft på den pågældende side.
Den sidste måde at indlejre en Twitter widget med kode er ved at bruge Shopify temafiler. Gå til Onlinebutik > Temaer at begynde. Vælg Ellipse (…) knappen, og vælg derefter Rediger kode.
theme.liquid fil giver dig fuld kontrol over det tema, du i øjeblikket har installeret på Shopify. Indsæt Twitter feedkode, hvor end du ønsker at feedet skal vises i temaet. Ellers er det muligt at bruge Skabelon og Sektion filer, hvis du hellere vil Twitter feed vises kun i visse dele af dit websted, f.eks. i sidebjælken.
Sådan tilføjer du en Twitter Foder til en Shopify Internet side!
Du har måske bemærket, at du bruger en Shopify app opretter stadig en kortkode, som du kan placere hvor som helst på dit websted. Det kan få dig til at spørge, "hvad er meningen med at bruge en app?" Der er tre grunde:
- Brug af en app betyder, at alt dit arbejde er indeholdt i ét dashboard: Shopify.
- Der er langt flere tilpasningsindstillinger tilgængelige i Twitter Feed apps sammenlignet med, hvad der tilbydes gennem Twitter indlejrbar widget.
- En shortcode er i det mindste lidt mindre skræmmende end koden leveret af Twitter.
Og det er alt, hvad der er til det! Vi håber vores komplette guide til, hvordan du tilføjer Twitter fodre til Shopify har hjulpet dig med at finde ud af, om en plugin eller kode-widget er den rigtige til din e-handelsbutik. Vi opfordrer dig til at se på andre apps for at indlejre alternative sociale medier-feeds, som et Instagram-feed, eller endda for at vise noget som social proof eller TikTok-videoer. Fortæl os det i kommentarerne, hvis du har spørgsmål!
Kommentarer 0 Responses