Lär dig att lägga till en Twitter mata till din Shopify webbplats gör det möjligt för ditt varumärke att visa upp sin sociala närvaro på sidor som din hemsida, blogg och till och med produktsidor.
Den stora delen med att bädda in en Twitter flödet på din webbplats är att det uppdateras automatiskt Twitter innehåll på din webbplats, vilket innebär att du inte behöver kopiera inlägg från din Twitter sida.
Dessutom a Twitter feed är ett utmärkt sätt att injicera en betydande mängd bilder på din webbplats; många märken använder Twitter gallerier eller flöden för att fungera som deras hemsidas bildgallerier.
Det finns två sätt att lägga till en Twitter mata till din Shopify webbplats:
- Med en app
- Genom att bädda in kod för en Twitter widget
I den här guiden går vi igenom båda metoderna, så att du kan bestämma vilken som fungerar bäst för dig. Vi rekommenderar att du provar varje alternativ, eftersom du kan upptäcka att det ena ser ut eller fungerar bättre än det andra, beroende på din webbplatslayout och arbetsflöde.
Fortsätt läsa för att lära dig allt om hur du lägger till en Twitter mata till en Shopify hemsida!
Hur man lägger till Twitter Mata till Shopify Webbplats
Till att börja med kommer vi att utforska hur man lägger till en Twitter mata till Shopify med en app. Det finns flera Twitter appar i Shopify App Store, som alla ger unik funktionalitet. Vissa ger dig knappar för sociala medier, Twitter antal följare, eller till och med automatiska inlägg. Vad vi däremot letar efter är en app för att synkronisera din nuvarande Twitter flöde, som visar ett visst antal av de senaste inläggen från ditt konto (eller ett annat offentligt konto).
Metod 1: Lägg till Twitter Mata till Shopify med en app
Det finns några gratis och några betalda, Twitter flödesappar tillgängliga för nedladdning via Shopify App Store. I den här handledningen kommer vi att använda Zestard Twitter Feed-appen, eftersom den ger den funktionalitet som krävs, och den är gratis. Om du bestämmer dig för en annan app, föreslår vi att du provar alla gratisappar först, eftersom detta inte precis är en funktion som du ska behöva betala för.
För att börja, installera Zestard Twitter Feed app på Shopify Lagra. Om du fortfarande kommer igång med Shopify, lära sig hur du skapar din butik här. Du kan hitta appar genom att logga in på din Shopify konto och går till Lägg till Apps, eller navigerar direkt till App Store.
Klicka Lägg till app i Shopify App Store alltså Installera app när den tar dig tillbaka till instrumentpanelens skärm med informatom behörigheter och integritet.
När du har installerat den ser du en ny flik för Twitter Feed under appar flik i Shopify. Det finns också ett avsnitt om Så här använder du appen, som du kan följa för att ställa in den korrekt.
Viss konfiguration krävs innan du visar någon Twitter matar på frontend. Gå till Tidslinje inställningar att börja.
Den här sidan innehåller flera fält för att anpassa flödets övergripande utseende och innehåll.
Det viktigaste fältet att fylla i är Flödes namn; skriv eller klistra in Twitter handtag du vill dra ur. Det är möjligt att visa flödet från vilken publik som helst Twitter profil.
Andra inställningar inkluderar:
- Matarlådans bredd
- Foderlådans höjd
- Flödestema (ljus eller mörkt)
- Flödesgräns (visar bara ett visst antal senaste tweets)
- Datalänksfärg
- Mata bakgrundsfärg
När du är klar med anpassningen, se till att du klickar på Spara ändringar knappen för att göra en förhandsgranskning.
Efter att ha klickat Spara ändringar, genererar appen en förhandsvisning av Twitter utfodra. Bläddra gärna igenom flödet och gå tillbaka för att justera inställningarna baserat på vad du vill uppnå.
Precis ovanför förhandsvisningen ser du att appen också genererade en kortkod för flödet. Detta är en unik kodbit som du kan klistra in var som helst på din Shopify hemsida. Klicka till Kopiera koden till ditt urklipp.
Smakämnen Twitter Feed-appen visar en popup där du enkelt kan kopiera koden. Allt du behöver göra är att använda kortkoden CTRL + C (Command + C för Mac) för att kopiera kortkoden till din dators urklipp.
Du kanske vill placera Twitter livnär sig på en Shopify webbsida, som på dina Om oss-, Kontakt- eller Support-sidor. För att göra det, gå till Onlinebutik > Sidor in Shopify. Öppna den nya sidan som du vill lägga till flödet för. Klicka på <> (Visa HTML) för att växla från Visual Editor till HTML Code Editor.
Klistra in den tidigare kopierade kortkoden i HTML-redigeraren. Om det finns annat innehåll på sidan, välj helt enkelt var du vill att flödet ska gå och infoga koden där. Se till att spara sidan.
Navigera till sidans frontend genom att förhandsgranska eller gå till dess webbadress. Du kommer nu att se Twitter flödet visas exakt där du infogade kortkoden.
Många nätbutiksägare vill hellre lära sig att lägga till Twitter mata till en Shopify hemsida. Isåfall, Shopify ger en visuell anpassare för hemsidan, vilket gör det ännu enklare att infoga Twitter foderkortkod.
För det, gå till Onlinebutik > Teman > Anpassa.
Hitta sedan det område där du vill placera Twitter utfodra. Klicka på Lägg till avsnitt knappen i detta område. Sök efter Anpassad vätska temasektion och infoga den i Shopify.
Smakämnen Anpassad vätska temasektionen presenterar flera inställningar på vänster sida. Den viktigaste av dem är Anpassad vätska fält. Klistra in kortkoden som tidigare kopierats från Twitter Flödesapp.
Efter att ha klickat Save, kommer du att se Twitter foder som återges i Shopify förhandsvisning av hemsidan till höger.
Du kan till och med anpassa avsnittet lite med alternativ för:
- färg~~POS=TRUNC
- Sektionsstoppning
- Anpassad CSS
Det sista sättet att infoga en kortkod från Twitter Feeds app är genom att lägga till den i själva temats källkod. Detta rekommenderas i allmänhet bara om du vill ha det Twitter flödet för att visas globalt i vissa avsnitt eller sidor.
För att göra det, gå till Onlinebutik > Teman in Shopify. Klicka på Ellips (…) knappen för att visa fler alternativ. Klicka på Redigera kod från rullgardinsmenyn.
Välj theme.liquid fil och klistra in koden var du vill inom temakodningen. Som ett alternativ kan du välja att ändra Mallar or Sektioner för mer kontroll över var Twitter feed visas.
Andra inställningar hittar du i Twitter Flödesappen inkluderar:
- Alternativ för att bädda in en enskild tweet (eller retweet)
- Ett verktyg för att skapa en Twitter delningsknapp
- Alternativ för att visa hashtag-flöden
Metod 2: Lägg till Twitter Mata till Shopify med en Embedded Twitter widget
Twitter erbjuder ett sätt att publicera en offentlig tidslinje på din webbplats. Det betyder att du har möjlighet att visa ditt varumärkes flöde, eller inläggen från ett annat konto.
För att komma igång, gå till Publicera.Twitter.com.
Klistra in eller skriv in webbadressen till Twitter profil som du vill visa som ett flöde på din Shopify Lagra. Klicka på pilknappen för att fortsätta.
Här har du två alternativ:
- Inbäddad tidslinje
- Twitter Knappar
Smakämnen Twitter Knappar är användbara för att lägga till en följ eller nämn-knapp någonstans på din webbplats. Men för den här artikeln är vi mer fokuserade på att få en Twitter foder för att dyka upp. Så, välj Inbäddad tidslinje alternativ.
Twitter genererar automatiskt Twitter flödeswidgetkod. Vi föreslår dock att du klickar på Ställ in anpassningsalternativ anknyta till format hela flödet innan det publiceras på din webbplats.
Detta visar flera inställningar för att ändra utseendet på din flödeswidget:
- Höjd
- Bredd
- Titta (mörkt eller ljust)
- Språk (Du kan vanligtvis bara gå med Automatisk)
Klicka på Uppdatera knapp för att se dina ändringar i förhandsgranskningen nedan. Som du kan se, vår enkla förändring från Svagt till mörkt redan renderat i förhandsgranskningen.
När du är nöjd med ditt sätt Twitter flödet ser ut, klicka på Kopiera kod för att kopiera widgetkoden till din dators urklipp.
Nu är det dags att lära sig hur man lägger till Twitter mata till din Shopify hemsida. Det enklaste alternativet är att placera flödet på din Shopify hemsida, via en Shopify sektion.
Gå till Onlinebutik > Teman > Anpassa att öppna Shopify visuell anpassning. Hitta det område på hemsidan du vill infoga Twitter utfodra. Klicka på en av Lägg till avsnitt knappar för att avslöja Shopifys samling av avsnitt. Bläddra igenom listan eller sök efter Anpassad vätska sektion. Klicka för att lägga till det på sidan.
Använd Anpassad vätska fältet för att klistra in den tidigare kopierade koden (från Twitter hemsida). Justera gärna andra sektionsinställningar som färg~~POS=TRUNC, Sektionsstoppning, eller Anpassad CSS.
Du kommer att märka att, till en början, allt som visas är en länk till dina tweets Twitter konto.
Du behöver bara klicka på Save knapp för Shopify att återge Twitter mata i förhandsgranskningen av anpassaren.
Ett ytterligare sätt att lägga till en Twitter feed via inbäddningskod är genom att placera den på en specifik sida i Shopify. Gå till Onlinebutik > Sidor för att åstadkomma detta. Öppna sidan där du vill redigera.
Väl i sidredigeraren klickar du på Visa HTML (<>) knapp. Detta växlar från Visual Editor till Custom HTML Editor, som krävs för att lägga till kod.
Klistra in koden du ursprungligen kopierade från Twitter. Klicka på Save or Publicera knappen för att ändringarna ska träda i kraft.
Antingen förhandsgranska sidan eller gå till dess frontendvy. Här ser du Twitter flöde som visas tillsammans med annat innehåll du kan ha haft på den sidan.
Det sista sättet att bädda in en Twitter widget med kod är genom att använda Shopify temafiler. Gå till Onlinebutik > Teman att börja. Välj den Ellips (…) knappen och välj sedan Redigera kod.
Smakämnen theme.liquid fil ger dig fullständig kontroll över det tema du för närvarande har installerat på Shopify. Klistra in Twitter flödeskod där du vill att flödet ska synas i temat. Övrigwise, går det att använda Mall och § filer om du hellre vill Twitter flödet visas bara i vissa delar av din webbplats, som i sidofältet.
Så här lägger du till en Twitter Mata till en Shopify Hemsida!
Du kanske har märkt att du använder en Shopify app skapar fortfarande en kortkod som du kan placera var som helst på din webbplats. Det kan få dig att fråga "vad är poängen med att använda en app?" Det finns tre anledningar:
- Att använda en app innebär att allt ditt arbete finns i en instrumentpanel: Shopify.
- Det finns mycket fler anpassningsinställningar tillgängliga i Twitter Mata appar jämfört med vad som erbjuds genom Twitter inbäddningsbar widget.
- En kortkod är åtminstone lite mindre skrämmande än koden som tillhandahålls av Twitter.
Och det är allt som finns! Vi hoppas vår kompletta guide om hur man lägger till Twitter mata till Shopify har hjälpt dig att ta reda på om en plugin eller kodwidget är rätt för din e-handelsbutik. Vi uppmuntrar dig att titta på andra appar för att bädda in alternativa sociala mediaflöden, som ett Instagramflöde, eller till och med för att visa något som socialt bevis eller TikTok-videor. Låt oss veta i kommentarerna om du har några frågor!
Kommentarer 0 Responses