DocumentatieCommerceAan de slag

Storefront-branding

Last update: Mon Jul 15 2024 00:00:00 GMT+0000 (Coordinated Universal Time)
  • Onderwerpen:

Gemaakt voor:

  • Beginner
  • tussenpersoon
  • Beheerder
  • Leider
  • Gebruiker

Één van de eerste dingen u wilt doen is het embleem 🔗 in de kopbal te veranderen en een faviconvoor browser te uploaden. Daarna, zou u uw welkome berichtmoeten toevoegen en de copyrightkennisgevingin footer bijwerken. Deze taken zijn een paar eenvoudige ontwerpelementen die u meteen kunt uitvoeren. Terwijl uw opslag in ontwikkeling is, kunt u de kennisgeving van de opslagdemoaanzetten, en dan het verwijderen wanneer u klaar bent om te lanceren.

Storefront brandende elementen

Uw logo uploaden

De grootte en locatie van het logo in de koptekst wordt bepaald door het winkelthema. Uw logo kan worden opgeslagen als een GIF-, PNG- of JPG-bestandstype (JPEG) en worden geüpload vanuit de beheerder van uw winkel.

Logo in Kopbal

De afbeelding van het logo bevindt zich op de volgende locatie op de server. Elk afbeeldingsbestand met de naam logo.svg wordt gebruikt als het standaardthemalogo.

Volledig pad - app/design/frontend/[vendor]/[theme]/web/images/logo.svg

Relatief pad - images/logo.svg

Als u de grootte van het logo of andere afbeeldingen die in het thema worden gebruikt niet weet, opent u de pagina in een browser, klikt u met de rechtermuisknop op de afbeelding en inspecteert u het element.

NOTE
Naast het embleem in de kopbal, verschijnt uw embleem ook op e-mailmalplaatjesen op PDF facturenen andere verkoopdocumenten. De logo's die voor e-mailsjablonen en facturen worden gebruikt, hebben verschillende groottevereisten en moeten afzonderlijk worden geüpload.

Ondersteunde bestandsindelingen voor logo's:

Bestandsindeling
Beschrijving
PNG
(Portable Network Graphics) Dit nieuwere alternatief voor de indeling GIF ondersteunt maximaal 16 miljoen kleuren (24 bits). De compressie-indeling zonder verlies produceert een bitmapafbeelding van hoge kwaliteit met heldere tekst, maar een groter bestand dan sommige indelingen. De PNG-indeling ondersteunt transparante lagen en is ontworpen voor onlineweergave en -streaming.
GIF
(Graphics Interchange Format) Een breed ondersteunde en oudere bitmapindeling die is beperkt tot 256 kleuren (8 bits). De indeling GIF ondersteunt eenvoudige animatie en transparante lagen.
JPG (JPEG)
(Joint Photographic Expert Group) Een gecomprimeerde bitmapindeling die door de meeste digitale camera's wordt gebruikt. De compressie met verlies veroorzaakt gegevensverlies, wat soms opvalt als vage vlekken in tekst.

  1. Voor Admin sidebar, ga Content > Design>Configuration.

    pagina van de Configuratie van het Ontwerp {width="700"}

  2. Zoek de winkelweergave die u wilt configureren en klik op Edit in de kolom Action.

  3. Breid selecteur van de Uitbreiding de Header sectie uit.

    montages van de Kopbal {width="600"}

  4. Als u een nieuw logo wilt uploaden, klikt u op Upload en kiest u het bestand in uw systeem.

  5. Voer de Logo Image Width en Logo Image Height in pixels in.

  6. Voer bij Logo Image Alt de tekst in die u wilt weergeven wanneer iemand de cursor boven de afbeelding houdt.

  7. Klik op Save Configuration als de bewerking is voltooid.

Een favicon toevoegen

Favicon is kort voor favoriet pictogram en verwijst naar het kleine pictogram op het lusje van elke browser pagina. Afhankelijk van de browser wordt het favicon ook weergegeven in de adresbalk, vlak voor de URL.

Een favicon heeft doorgaans een grootte van 16 x 16 pixels of 32 x 32 pixels. Commerce accepteert bestandstypen ICO, PNG, APNG, GIF en JPG (JPEG), hoewel niet alle browsers deze indelingen ondersteunen. De meest ondersteunde bestandsindeling voor een favicon is ICO. U kunt andere typen afbeeldingsbestanden gebruiken, maar de indeling wordt mogelijk niet door alle browsers ondersteund. Er zijn veel gratis gereedschappen online beschikbaar waarmee u een ICO-afbeelding kunt genereren of een afbeelding kunt omzetten in die indeling.

Favicon in browser tabel

Commerce ondersteunt de volgende bestandsindelingen als favicon:

Bestandsindeling
Beschrijving
ICO
Deze indeling voor afbeeldingsbestanden is ontworpen voor pictogramafbeeldingen op kleine grootte. De ICO-indeling wordt vooral gebruikt in Microsoft® Windows OS en kan afbeeldingen tot 256 x 256 pixels en 16 miljoen kleuren (24 bits) met 8 bits transparantie bevatten.
PNG
(Portable Network Graphics) Dit nieuwere alternatief voor de indeling GIF ondersteunt maximaal 16 miljoen kleuren (24 bits). De compressie-indeling zonder verlies produceert een bitmapafbeelding van hoge kwaliteit met heldere tekst, maar een groter bestand dan sommige indelingen. De PNG-indeling ondersteunt transparante lagen en is ontworpen voor onlineweergave en -streaming.
APNG
(Geanimeerde Portable Network Graphics) Een bestandsindeling die vergelijkbaar is met PNG en eenvoudige animatie ondersteunt.
GIF
(Graphics Interchange Format) Een breed ondersteunde en oudere bitmapindeling die is beperkt tot 256 kleuren (8 bits). De indeling GIF ondersteunt eenvoudige animatie en transparante lagen.
JPG (JPEG)
(Joint Photographic Expert Group) Een gecomprimeerde bitmapindeling die door de meeste digitale camera's wordt gebruikt. De compressie met verlies veroorzaakt gegevensverlies, wat soms opvalt als vage vlekken in tekst.

Stap 1: Een favicon maken

  1. Maak met de afbeeldingseditor van uw keuze een afbeelding van 16 x 16 of 32 x 32 pixels van het logo.

  2. (Optioneel) Gebruik een van de beschikbare online gereedschappen om het bestand om te zetten in de indeling .ico en het bestand op te slaan op uw computer.

Stap 2: Upload het favicon naar uw winkel

  1. Voor Admin sidebar, ga Content > Design>Configuration.

  2. Zoek in het raster de winkelweergave die u wilt configureren en klik op Edit in de kolom Action.

  3. Onder Other Settings, breid de selecteur van de Uitbreiding uit de HTML Head ​sectie.

    HTML Hoofd montages {width="600"}

  4. Als u huidig favicon wilt verwijderen, klik Schrapping ( het vuilnisbakpictogram ) pictogram in de laag-linkerhoek van het beeld.

  5. Klik op Upload en open het favicon-bestand dat u hebt voorbereid.

    Geüpload favicon {width="400"}

  6. Klik op Save Configuration als de bewerking is voltooid.

Stap 3: De cache vernieuwen

  1. Als u wordt gevraagd de cache te vernieuwen, klikt u op de koppeling Cache Management in het bericht boven aan de werkruimte.

  2. Selecteer in de lijst het selectievakje Page Cache dat is gemarkeerd als Invalidated .

  3. Stel Actions in op Refresh en klik op Submit .

  4. Als u het nieuwe favicon wilt weergeven, gaat u terug naar uw winkel en vernieuwt u de browser.

Het welkomstbericht wijzigen

Het welkomstbericht in de koptekst wordt uitgebreid om de naam van de klant op te nemen die is aangemeld. Alvorens u uw opslag lanceert, ben zeker om het gebrek Onthaal tekst voor elke archiefmening te veranderen.

Welkome bericht

  1. Voor Admin sidebar, ga Content > Design>Configuration.

  2. Zoek in het raster de winkelweergave die u wilt configureren en klik op Edit in de kolom Action.

  3. Onder Other Settings, breid de selecteur van de Uitbreiding uit de Header ​sectie.

  4. Voer bij Welcome Text de welkomstberichttekst in die u wilt weergeven in de koptekst van uw winkel.

    montages van de Kopbal {width="600"}

  5. Klik op Save Configuration als de bewerking is voltooid.

  6. Als u wordt gevraagd om de paginacache bij te werken, klikt u op de koppeling Cache Management boven aan de werkruimte en volgt u de instructies om de cache te vernieuwen.

De copyrightmelding wijzigen

In de winkel wordt op elke pagina een copyrightvermelding weergegeven. Als beste praktijken, zou de auteursrechtkennisgeving het huidige jaar moeten omvatten, en uw bedrijf identificeren als wettige eigenaar van de inhoud op de plaats.

de berichtvoorbeeld van Copyright

De tekencode © wordt gebruikt om het copyrightsymbool in te voegen, zoals in de volgende voorbeelden wordt getoond:

  • Voorbeeld van lange notatie

    Copyright © 2013-present Luma, Inc. All rights reserved.

  • Voorbeeld van korte indeling

    © 2021 Luma, Inc. All rights reserved.

om de copyrightkennisgeving bij te werken:

  1. Voor Admin sidebar, ga Content > Design>Configuration.

  2. Zoek in het raster de winkelweergave die u wilt configureren en klik op Edit in de kolom Action.

  3. Onder Andere Montages, breid de selecteur van de Uitbreiding de Footer sectie uit.

    het ontwerpmontages van de Voettekst {width="600"}

  4. Voer bij Copyright de copyrightvermelding in die u in de voettekst van elke pagina wilt weergeven.

    Gebruik de tekencode © om een copyrightsymbool in te voegen.

  5. Klik op Save Configuration als de bewerking is voltooid.

Melding van opslagdemo instellen

Als uw winkel online is, maar nog steeds in aanbouw is, kunt u boven aan de pagina een demo van de winkel weergeven om mensen te laten weten dat de winkel nog niet geopend is voor zakelijk gebruik. Wanneer u bereid bent om levend te gaan, verwijder eenvoudig het bericht. Het is gelijkaardig aan het omdraaien van het teken dat in het venster van gesloten aan Open hangt. De indeling van de demo-kennisgeving wordt bepaald door het thema van uw winkel.

bericht van de de manifestatie van de Storefront

  1. Voor Admin sidebar, ga Content > Design>Configuration.

  2. Zoek in het raster de winkelweergave die u wilt configureren en klik op Edit in de kolom Action.

  3. Onder Other Settings, breid de selecteur van de Uitbreiding uit de HTML Head ​sectie.

    HTML Head {width="600"}

  4. Schuif omlaag naar de onderkant en stel de Display Demo Store Notice in op uw voorkeur.

  5. Klik op Save Configuration als de bewerking is voltooid.

  6. Als u wordt gevraagd om de cache bij te werken, klikt u op Cache Management in het systeembericht en volgt u de instructies om de cache te vernieuwen.

recommendation-more-help
31746fd0-1ead-45b5-9192-1aaf582c5f66