En trin-for-trin guide til at tilføje et Dawn Theme-videobanner i Shopify

Hvis du har brugt Shopify, du kender Dawn-temaet. Det er et af de gratis temaer, der er tilgængelige for nye iværksættere, og en meget tilpasselig mulighed for at designe en unik butiksfacade.

Dawn-temaet kommer med adskillige moduler, såsom dens standard videouploadblok og et billedbanner.

I denne guide viser vi dig, hvordan du bygger en Daggry tema videobanner for at fange opmærksomhed på din hjemmeside!

Oversigt over Dawn-temaet

Dawn-temaet er gratis Shopify tema som er meget brugt af e-handelshandlere. Med et enkelt design og enkle indstillinger forbliver det et populært valg til at oprette en visuelt tiltalende og elegant butik.

Hvad er en videobaggrund/banner, og hvorfor skal du bruge en på dit websted?

Et videobanner er et område på en webside, der præsenterer en video som en baggrund i fuld bredde sammen med andre elementer i forgrunden, såsom knapper og tekst.

Et modul som et Dawn-tema-videobanner tilbyder adskillige fordele for at forbedre den overordnede webstedsoplevelse for besøgende. Her er nogle vigtige fordele:

1. Berigede visuelle elementer: Ved at inkorporere fængslende videoer bliver hjemmesiden mere visuelt tiltalende og fanger de besøgendes opmærksomhed.
2. Dynamisk og engagerende indhold: Videoer formidler effektivt indformation. De kan fremvise produktfunktioner, demonstrere how-tos eller fortælle en fængslende brandhistorie, der holder besøgende engageret.
3. Forbedret brugerengagement: Videoer har magten til at skabe et varigt indtryk på besøgende. Kombinationen af ​​billeder, lyd og bevægelse fanger opmærksomheden og opfordrer brugerne til at udforske yderligere.
4. Effektiv brandkommunikation: En videobaggrund eller et banner kan kommunikere brandets budskab til kunderne. Det giver virksomheder mulighed for at fremhæve deres unikke værditilbud, fremvise produkter eller tjenester og etablere en stærk brandidentitet.

Ved at udnytte styrken af ​​video i dit webstedsdesign, kan du gøre dit websted mere spændende og booste konverteringer.

Trin-for-trin guide til at tilføje en videobaggrund/banner til Dawn-temaet

Der er teknisk fire måder at tilføje et Dawn-tema-videobanner på (ikke alle ideelle):

1. Konvertering af videoen til WebP-videoen/-billedet format.
2. Justering af Shopify kode til et almindeligt billedbanner, så det understøtter video.
3. Konvertering af videoen til en GIF format.
4. Du skal blot uploade en video til videoblokken Shopify, springer tanken om at have forgrundselementer over (så det ikke ville være et ægte banner).

Det er ikke voldsomt svært at ændre Shopify kode til et standard billedbanner, men processen er unødvendigt langvarig i betragtning af, at du har adgang til en fil format ligesom WebP. GIF'er reducerer videokvaliteten betydeligt, og mulighed 4 giver os ikke et rigtigt videobanner.

Derfor anbefaler vi at konvertere en hvilken som helst video format du har (.mp4, .mov, .wmv) til WebP format. WebP kombinerer fordelene ved højopløselige JPEG-billeder, -videoer og GIF'er, ved at du kan producere smukke bevægelige videoer uden bulk og uden at miste meget opløsning. Og du kan uploade WebP-videoer/billeder til en Shopify billedbanner.

Her er du:

Trin 1: Tag din video og konverter den til WebP-filen Format

Der er forskellige gratis "video til WebP"-konvertere online. Prøv en onlinesøgning, eller brug en af ​​de konvertere, vi har testet:

• Ezgif
• MC konverter
• MP4.til

Upload din video til det gratis konverterværktøj, og vælg derefter at konvertere den til WebP format. Gem den nye fil på din computer.

Trin 2: Find Dawn-temaet i Shopify

Gå til "Onlinebutik"> "Temaer".

Hvis du ikke allerede har det, så installer Dawn-temaet. Andetwise, bør du finde Dawn-temaet udpeget som Shopifys "Aktuelt tema." Klik på knappen "Tilpas" for at fortsætte.

Trin 3: Tilføj og vælg billedbannerblokken

"Image Banner"-blokken tilføjes som standard i Dawn-temaet. Så du burde være i stand til at klikke på det modul for at åbne dets indstillinger i venstre panel. Det er også muligt at klikke på selve billedbanneret, i den visuelle forhåndsvisning til højre. Brug linket "Tilføj blok", hvis du skal indsætte "Billedbanneret" fra bunden.

Trin 4: Upload WebP-videofilen

Klik på knappen "Vælg billede" under afsnittet "Første billede".

Dette indlæser et område til at uploade billeder til dit butiksmediebibliotek. Det er også muligt at indsætte video-URL'er, men vi bruger upload-funktionen. Vælg knappen "Tilføj billeder", og vælg den WebP-fil, du oprettede tidligere. Marker den nyligt uploadede fil med et flueben, og klik derefter på knappen "Udført".

Dette taber WebP-videofilen i billedbanneret, så du også kan redigere indholdet i forgrunden. Klik på "Gem".

Tillykke, du har tilføjet et videobanner med Dawn-tema!

Trin 5: Se forhåndsvisning af videoen

Men vent, det er det wise for at få vist videoen på frontend for at sikre, at den ser rigtig ud, kører problemfrit og har den passende opløsning.

Tilbage på dashboardets hovedskærm skal du klikke på øjeæbleikonet for at "Se din onlinebutik". Det er placeret ved siden af ​​"Onlinebutik" under afsnittet "Salgskanaler".

Succes!

Tilpasning af dit Dawn-tema-videobanner: Gør det unikt til dit

Tilpasning sikrer, at din video passer perfekt til dit brand og din butiks æstetik. Så lad os smøge ærmerne op og dykke ind, skal vi?

Du skal altid vælge billedbanneret for at se dets indstillinger. Når du er der, kan du ændre billedoverlejringens opacitet og ændre bannerhøjden. Derefter kan du ændre desktop indholdsposition, hvilket ændrer, hvor overlejringsteksten er placeret.

Flytning af indholdet og knappositionerne fungerer for at vise teksten og knappen over et område af videoen, hvor de er mest synlige.

For yderligere tilpasning har du adgang til en "Custom CSS" sektion.

Og selvfølgelig er det muligt at vælge indholdsteksten eller knappen for at ændre, hvad de siger, og hvordan de vises.

Tips til optimering af din videofil til maksimal hastighed og kompatibilitet

Det er ligegyldigt at have en imponerende video, om den sænker dit websted til en gennemgang eller ikke vises korrekt på visse enheder. Derfor er optimering af din videofil til maksimal hastighed og kompatibilitet en opgave, der ikke kan forhandles. I dette afsnit deler vi nogle praktiske tips til at sikre, at dit videoindhold er strømlinet for effektiv indlæsning og universel afspilning.

• Brug videofil formats (som WebP), der er bredt kompatible med de fleste webbrowsere.
• Hold videofilstørrelsen så lille som muligt. WebP gør et vidunderligt stykke arbejde med at komprimere video uden at miste kvalitet.
• Indstil videoens billedformat, så det passer godt inden for skærmstørrelsen.
• Vælg en video med afbalanceret farve og kontrast, der afspejler butikkens personlighed.

Fejlfinding af almindelige problemer med tilføjelse af en videobaggrund/banner til Dawn-temaet

Nogle gange, uanset hvor forsigtig du har været, kan der stadig dukke problemer op, når du tilføjer Dawn-tema-videobanner. Her er nogle tip til fejlfinding, når du støder på problemer:

Inkompatibilitetsproblemer

Prøv at konvertere videoen til en kompatibel fil format som WebP eller brug linket til videoindlejring.

Videostørrelsen er for stor

Trim videoen eller komprimer den for at reducere filstørrelsen og samtidig bevare kvaliteten.

Videoen afspilles ikke automatisk

Tjek, at du har aktiveret "Autoplay"-indstillingen i temaindstillingerne.

Vores konklusion om tilføjelse af et Dawn-tema-videobanner

Ved at følge vores trin-for-trin guide og fejlfindingstips, bør du være i stand til at tilføje Dawn-tema-videobanner til Shopify med lethed.

Hvad tænker du? Fortæl os i kommentarerne, hvis du har haft succes med at tilføje et Dawn-tema-videobanner!