Tilføj brugerdefineret HTML eller CSS til kurvskuffen

Brug først de indbyggede indstillinger til farver, billeder og tekst. Brugerdefineret HTML og CSS er tilgængeligt til ændringer, der kræver din egen markup eller styling.

Tilføj en blok med brugerdefineret HTML

1. Rediger din kurv, og åbn Kurv.
2. Brug Tilføj brugerdefineret HTML i indholds- eller sidefodsområdet.
3. Indtast markuppen i HTML, og placér derefter blokken med dens trækgreb i området. Feltet er en kodeeditor med linjenumre og farvede tags. Formatér rydder op i indrykningen.
4. Gennemgå layoutet, gem, og kontrollér butikken.

Du kan tilføje op til 10 blokke med brugerdefineret HTML pr. område. Editorens grænse er 10.000 tegn pr. blok, og den komplette kurvkonfiguration har også en størrelsesgrænse.

Tilføj brugerdefineret CSS

Åbn Stil, rul ned til Avanceret nederst, og åbn Brugerdefineret CSS. Afgræns regler til skuffen, for eksempel med #bxc-drawer, så de ikke utilsigtet ændrer stylingen af resten af dit tema. Gem en kopi af eksisterende CSS, før du erstatter den. Feltet accepterer op til 10.000 tegn.

Feltet er en kodeeditor: Den farvelægger din CSS, foreslår egenskabsnavne, mens du skriver, og markerer en regel, den ikke kan læse, med rødt, så en manglende klammeparentes vises, før du gemmer. Formatér rydder op i indrykningen.

Prøv en enkel note

Dette eksempel tilføjer en brandnote. Brug HTML-blokken til dens indhold:

<p class="aurelia-cart-note">
  <strong>Aurelia Botanicals</strong><br>
  Everyday skincare essentials.
</p>

Tilføj derefter en afgrænset regel i Brugerdefineret CSS for at give noten en venstrekant:

#bxc-drawer .aurelia-cart-note {
  border-left: 3px solid #334fb4;
  padding-left: 12px;
}

Gem, og kontrollér noten, produktkontrollerne og checkout-knappen på computer og telefon.

Adfærden i forhåndsvisningen og butikken er forskellig

Forhåndsvisningen viser layoutet for brugerdefineret HTML, men fjerner scripts og interaktive attributter. I butikken behandles brugerdefineret markup som temakode. Almindelige indsatte <script>-tags udføres ikke automatisk, så dette felt er ikke et generelt værktøj til installation af scripts.

Indsæt kun kode, du forstår, eller som du har fået gennemgået af din udvikler. Kontrollér det offentliggjorte resultat på computer og mobil, herunder tilføjelse af en vare og åbning af checkout. Hvis skuffen går i stykker efter en ændring, skal du fjerne den brugerdefinerede kode, gemme igen og teste på ny.