Sektioner och block

Du kan använda sektioner i ditt tema för att skapa den layout du vill ha för din webbshop. Sektioner består av olika typer av block som var och en har en specifik funktion, till exempel text, knappar, enskilda bilder, ett bildkollage eller länkar.

Sektioner och block ger flexibilitet i hur du ordnar ditt innehåll och låter dig styra stilen och känslan i din webbshop utan att du behöver redigera kod, inklusive följande anpassningsalternativ:

• Du kan flytta om sektioner i dina mallar och flytta om block inom sektioner.
• Sektioner och block kan ha specifika anpassningsinställningar.
• Du kan ansluta kompatibla sektioner och block för att visa dynamisk information i din webbshop från anpassade data, som att lägga till skötselråd för dina produkter. Mer information om att ansluta dynamiska källor.

De sektioner och block som är tillgängliga i temaredigeraren beror på ditt tema och din temaversion. Ditt tema kan till exempel ha ett Bildspelsblock som du bara kan lägga till i en Bildspelssektion och ett Rubriktextblock som du kan lägga till i alla temats sektioner. Mer information om vilka alternativ som är tillgängliga för dig finns i temats dokumentation.

Maximalt antal sektioner och block

Sektioner och block har följande maxbegränsningar:

• Varje mall kan ha upp till 25 sektioner.
• Varje mall kan ha upp till 1 250 block totalt i alla sektioner. Det exakta antalet block och antalet block av varje typ som du kan lägga till i varje sektion beror på sektions- och blockkällorna och anges av temadesignern för ditt tema. Om ditt tema till exempel har en sektion för E-postregistrering kan du kanske bara lägga till ett block av typen E-postformulär.
• Block som har stöd för nästling kan ha upp till åtta nivåer av nästlade block.

Blockkällor

Beroende på ditt temas struktur och de appar du har installerat kan ditt tema innehålla en mängd olika sektioner som accepterar block från olika källor. När du lägger till ett block i en sektion visas alla tillgängliga block för den sektionen i blockväljaren. Beroende på ditt tema och din temaversion kan du lägga till följande typer av block i sektioner i ditt tema:

• App-block är block som lägger till funktioner i ditt tema. Du kan använda ett app-block för att flytta områden i ditt tema som lagts till av dina installerade appar till ett specifikt område på en sida i ditt tema.
• Sektionsblock är block som definieras inom en specifik sektion.
• Temablock är block som definieras i ditt tema och kan ha dynamiska funktioner, till exempel nästling.

Ditt tema kan innehålla vissa sektioner som använder sektionsblock och andra sektioner som använder temablock. En enskild sektion kan acceptera antingen temablock eller sektionsblock, men inte en blandning av båda.

Tillgängligheten för app-block i sektioner beror på appens funktionalitet och om sektionen kan acceptera app-block.

Sektionsblock

Sektionsblock är block som är utformade för en specifik sektion. En sektion kan ha begränsningar för vilka typer av sektionsblock och hur många av en viss typ av block som du kan lägga till.

Exempel på en sektion med sektionsblock

Ditt tema har till exempel en sektion för E-postregistrering. Du kan använda den här sektionen för att lägga till ett formulär för nyhetsbrevsregistrering så att kunder kan prenumerera på ditt nyhetsbrev. När du har lagt till sektionen E-postregistrering kan du lägga till ett av vart och ett av följande block:

• ett block av typen E-postformulär
• ett block av typen Rubrik
• ett block av typen Underrubrik

Om du lägger till blocket E-postformulär och klickar på Lägg till block för att lägga till ytterligare ett block, visas blocket E-postformulär inte längre som ett alternativ i blockväljaren. Denna begränsning hjälper till att förhindra problem med att samla in kundens e-postadress och säkerställer att kunden enkelt kan ange sin e-postadress.

Om du har lagt till alla tre tillgängliga block för sektionen E-postregistrering visar blockväljaren ett meddelande om att alla tillgängliga block har använts.

Temablock

Temablock är block som definieras i ditt tema och kan ha dynamiska funktioner, till exempel nästling. Sektioner som accepterar temablock kan acceptera en mängd olika block, beroende på sektionens struktur. En sektion som accepterar temablock kan acceptera alla tillgängliga temablock, en specifik delmängd av block eller block som är unika för den sektionen. Temablock kan även ha följande beteenden:

• Vissa block har stöd för nästling, så att du kan nästla block i andra block upp till åtta nivåer djupt.
• Vissa sektioner har obligatoriska block. Du kan anpassa eller dölja dessa block, men du kan inte ändra ordning på dem eller radera dem.
• Vissa block visas automatiskt i en sektion när vissa villkor är uppfyllda.

Exempel på en sektion med temablock

Ditt tema har till exempel en Bildspelssektion med temablock.

I bildspelssektionen i ditt tema, när du klickar på Lägg till block, kan du välja ett Bildspelsblock från blockväljaren. Inga andra blocktyper är tillgängliga. Om du försöker lägga till ett Bildspelsblock i en annan sektion i ditt tema, till exempel en Bildbannersektion, är Bildspelsblock inte tillgängligt. Detta är ett exempel på ett begränsat block.

När du har lagt till ett bildblock i sektionen Bildspel kan du klicka på Lägg till block för att lägga till ytterligare block i vilket bildblock som helst i sektionen, till exempel Rubrik, Bild eller Knapp. Dessa block är nästlade i bildblocket. Detta är ett exempel på ett nästlat block.

Om du lägger till ett andra bildblock i sektionen Bildspel lägger temat automatiskt till ett block för bildspelskontroller. Det här blocket visar knappar som besökare på din webbplats kan klicka på för att navigera från en bild till en annan. Du kan anpassa knapparnas stil eller dölja kontrollerna, men du kan inte ta bort eller radera blocket. Detta är ett exempel på ett obligatoriskt block som visas villkorligt.

Temablockskompatibilitet

För att få åtkomst till temablock måste ditt tema ha sektioner som stöder temablock. Du kan kontrollera om ditt tema stöder temablock i temats kod. Om det finns en blocks-katalog i sidofältet i Liquid-redigeraren använder du ett tema som stöder temablock. Du kan även kontrollera temats dokumentation.

Steg:

1. Gå till Webbshop > Teman från din Shopify admin.

2. Klicka på knappen bredvid det tema du vill kontrollera och klicka sedan på Redigera kod.

3. Sök efter mappen blocks i sidofältet.

   

Anpassa temamallar med sektioner och block

När du öppnar temaredigeraren läses din butiks startsida in som standard. Du kan använda rullgardinsmenyn för att välja en annan mall, till exempel produkter, produktserier, sidor eller bloggar, eller använda sökfältet i mallens rullgardinsmeny för att söka efter en specifik mall. När du väljer en mall läses den in i temaredigeraren och alla ändringar du gör förhandsgranskas i redigeraren.

Lägg till en sektion

Lägg till en ny sektion på valfri sida i din webbshop.

Steg:

Redigera en sektion

Ändra ordning på en sektion eller ett block

Du kan ändra ordningen på sektioner i dina sidmallar och ändra ordningen på block i dessa sektioner. Dessutom kan du flytta kompatibla block mellan olika sektioner. Om din startsida till exempel innehåller två sektioner med bildspel kan du dra ett bildblock från ett bildspel till ett annat.

Du kan inte flytta ett block till en annan sektion om blocktypen är inkompatibel eller om sektionen redan har nått sin maximala gräns för block. Om du försöker flytta en sektion eller ett block till en ogiltig plats kommer den/det att återgå till sin ursprungliga position.

Du kan även använda förhandsgranskningsinspektören för att ändra ordning på sektioner. Läs mer om att använda förhandsgranskningsinspektören i temaredigeraren.

Steg:

Duplicera en sektion eller ett block

Du kan duplicera en sektion eller ett block för att skapa en identisk kopia av den sektionen eller det blocket.

När du har duplicerat ett block läggs det nya blocket till i samma sektion. Om du vill flytta blocket till en ny sektion eller ändra blockordningen kan du ändra ordning på blocket. Du kan även kopiera ett block och sedan klistra in det direkt i en annan sektion istället.

Kopiera och klistra in block

Om du vill använda samma block i flera sektioner kan du enkelt kopiera och klistra in det i en annan sektion. Du kan även kopiera och klistra in ett block i samma sektion, eller så kan du välja att duplicera blocket istället. Ett duplicerat block behåller alla inställningar och allt innehåll från originalblocket.

Steg:

1. Gå till Webbshop > Teman från din Shopify admin.

2. Klicka på Redigera tema bredvid det tema som du vill redigera.

3. För att kopiera och klistra in ett block på din startsida, väljer du det antingen direkt eller använder rullgardinsmenyn Startsida för att välja den specifika mall som innehåller sektionen eller blocket du vill redigera.

4. Högerklicka på blocket som du vill duplicera och klicka sedan på Kopiera.

5. Högerklicka i samma sektion eller i en annan sektion och klicka sedan på Klistra in.

6. Klicka på Spara.

Dölj eller ta bort en sektion eller ett block

Byta namn på en sektion eller ett block

Som standard är titeln för en sektion eller ett block i temaredigerarens sidofältsmeny och inställningsdetaljer inställd på block- eller sektionstypen, såsom ”Produktserie” eller ”Text”.

För block gäller att om blockinställningarna innehåller ett textfält, t.ex. en rubrik eller beskrivning, läggs den texten även till i titeln i sidofältsmenyn. Om det finns mer än ett textfält läggs det första textfältet som har innehåll till. När du ändrar texten i textfältet ändras blocktiteln så att den inkluderar den uppdaterade texten. Ett sektions- eller blocknamn kan inte vara tomt.

Till exempel lägger du till sektionen Flerkolumn i din sidmall med Kolumn-block. Kolumnblocket har inställningen Rubrik med standardtexten Kolumn och inställningen Beskrivning med standardtexten Kombinera text med en bild för att fokusera på din valda produkt, produktserie eller ditt valda blogginlägg. Standardsektionstiteln är Flerkolumn. Standardtiteln för Kolumn-blocket är Kolumn – Kolumn. Om du tar bort texten från avsnittet Rubrik uppdateras blocktiteln till Kolumn – Kombinera text med en bild....

Du kan byta namn på en sektion eller ett block till ett anpassat namn i dess inställningar i temaredigerarens sidofältsmeny.

Steg:

Arbeta med block

Block är anpassningsbara moduler som du använder för att lägga till innehåll i sektionerna i dina mallar. Du kan använda block för att lägga till text, bilder, länkar, knappar med mera.

Shopify-teman har sektioner och block som du kan anpassa. Vissa sektioner har fasta blocktyper, vilket innebär att du endast kan välja bland de block som görs tillgängliga för den sektionen av temadesignern.

Andra sektioner låter dig välja vilket block som helst, men det finns en gräns för det totala antalet block som du kan lägga till i sektionen. Om din sektion når det maximala antalet tillgängliga block är alternativet Lägg till block nedtonat och du kan inte klicka eller trycka på det.

Du kan använda sökfunktionen för att hitta ett specifikt block efter namn, eller välja ett block från blockväljarens rullgardinsmeny. Ditt temas block kan vara sorterade i kategorier i blockväljaren, till exempel Produktserie för block med en produktserieväljare eller Media för bild- och videoblock.

En förhandsgranskning av blocket visas i blockväljaren så att du kan granska hur det kommer att se ut innan du lägger till det.

Lägg till ett block

Använda metafält och metaobjekt med dynamiska källor

Du kan använda metafält och metaobjekt för att visa dynamisk information i din webbshop. Om du har ett tema som har stöd för metafält kan du ansluta ett metafält till inställningar för ett kompatibelt avsnitt eller block i temaredigeraren.

Om du till exempel säljer ljus kanske du vill visa brinntider för varje ljus som finns i din butik. När du har konfigurerat ett produktmetafält för Brinntid i avsnittet Anpassade data i inställningarna för din Shopify admin kan du lägga till ett textblock i huvudavsnittet för din produktmall. I textblocket kan du klicka på knappen i textinställningen och välja metafältet Brinntid. Information om brinntid visas nu på dina produkter.

Om du har ett Shopify-tema kan du ansluta de flesta metafält och metaobjekt till ditt tema med hjälp av temaredigeraren. Om du använder andra teman, eller om du vill lägga till anpassade datatyper som ditt tema inte har stöd för, kan du redigera din temakod eller anlita en Shopify-partner för att få hjälp. Läs mer om att anlita en Shopify-partner.

Alla avsnitt och block har inte stöd för dynamiska källor. Kontrollera temats arkitekturversion och tillgängliga anpassningsalternativ i temaredigeraren för att avgöra om ditt tema har stöd för dynamiska källor.

Du kan visa dynamisk information i din webbshop genom att lägga till avsnitt eller block som kan använda dynamiska källor. Dynamiska källor kan användas i alla mallar, avsnitt eller block som visar kompatibla resurser (produkt, produktserie, sida, blogg och bloggpost). Du måste lägga till ditt metafält innan du kan ansluta det i dina mallar. Se Dynamiska källor för mer information om hur du använder metafält och metaobjekt med dynamiska källor i ditt tema.

När du har slutfört konfigureringsprocessen, följ stegen nedan för att ansluta dynamiska källor till avsnitt eller block i ditt tema med hjälp av knappen .

Steg:

Läs mer om att visa metafält i din webbshop och att visa metaobjekt i din webbshop.

Dynamisk källväljare

Du kan använda den dynamiska källväljaren för att ansluta rätt dynamisk källa direkt i temaredigeraren. Granska följande nyckelfunktioner för den dynamiska källväljaren:

• Du kan referera till dynamiska källor från olika resurser, där det är tillämpligt. Om du till exempel ansluter en inställning till ett block som är anslutet till både en produktresurs och en sidresurs kan du använda rullgardinsmenyn i den dynamiska källväljaren för att ange om du vill söka efter metafält som är kopplade till antingen produktresursen eller sidresursen.
• Den dynamiska källväljaren har sök- och filterfunktioner som hjälper dig att hitta det metafält du behöver.
• Den dynamiska källväljaren låter dig välja kategorimetafält. Det är ytterligare attribut som blir tillgängliga när du tilldelar en produktkategori till en produkt. Genom att komma åt dessa metafält kan du ansluta dynamiska källor till alla relevanta fält på det underliggande attributmetaobjektet.