Průvodce krok za krokem přidáním banneru s tématem Dawn Shopify

Pokud jste použili Shopify, znáte téma Úsvit. Je to jedno z bezplatných témat dostupných pro nové podnikatele a vysoce přizpůsobitelná možnost pro návrh jedinečného výkladu.

Téma Dawn přichází s mnoha moduly, jako je jeho standardní blok pro nahrávání videa a obrázkový banner.

V této příručce vám ukážeme, jak vytvořit a Téma úsvitu video banner, který upoutá pozornost na vaší domovské stránce!

Přehled tématu Úsvit

Téma Úsvit je zdarma Shopify téma který je široce používán prodejci elektronického obchodu. Díky jednoduchému designu a přímočarému nastavení zůstává oblíbenou volbou pro zřízení vizuálně přitažlivého a elegantně vyhlížejícího obchodu.

Co je to pozadí videa/banner a proč byste ho měli na svém webu používat?

Banner videa je oblast webové stránky, která zobrazuje video jako pozadí v plné šířce spolu s dalšími prvky v popředí, jako jsou tlačítka a text.

Modul, jako je video banner s tématem Dawn, nabízí řadu výhod, které návštěvníkům vylepší celkový zážitek z webu. Zde jsou některé klíčové výhody:

1. Obohacené vizuální prvky: Začleněním poutavých videí se web stává vizuálně atraktivnějším a upoutá pozornost návštěvníků.
2. Dynamický a poutavý obsah: Videa efektivně předávají informace. Mohou předvést funkce produktu, předvést návody nebo vyprávět podmanivý příběh značky a udržet návštěvníky v zájmu.
3. Lepší zapojení uživatelů: Videa mají sílu vytvořit na návštěvníky trvalý dojem. Kombinace obrazu, zvuku a pohybu přitahuje pozornost a povzbuzuje uživatele k dalšímu zkoumání.
4. Efektivní komunikace značky: Video pozadí nebo banner může zákazníkům sdělit sdělení značky. Umožňuje podnikům zvýraznit jejich jedinečnou hodnotovou nabídku, předvést produkty nebo služby a vytvořit silnou identitu značky.

Využitím síly videa v designu vašich webových stránek můžete své stránky učinit zajímavějšími a zvýšit konverze.

Podrobný průvodce přidáním pozadí videa/banneru k tématu Dawn

Technicky existují čtyři způsoby, jak přidat banner s tématem Dawn (ne všechny jsou ideální):

1. Převod videa do formátu videa/obrázku WebP.
2. Nastavení Shopify kód pro běžný obrázkový banner, aby podporoval video.
3. Převod videa do formátu GIF.
4. Jednoduše nahrajte video do bloku Video v Shopify, přeskakující myšlenku mít prvky v popředí (takže by to nebyl skutečný banner).

Není to příliš obtížné upravit Shopify kód pro standardní obrázkový banner, ale proces je zbytečně zdlouhavý vzhledem k tomu, že máte přístup k formátu souboru, jako je WebP. GIFy výrazně snižují kvalitu videa a možnost 4 nám nedává skutečný video banner.

Proto doporučujeme převést jakýkoli formát videa, který máte (.mp4, .mov, .wmv), do formátu WebP. WebP kombinuje výhody obrázků JPEG, videí a GIF s vysokým rozlišením v tom, že můžete vytvářet krásná pohyblivá videa bez velkého objemu a bez velké ztráty rozlišení. A můžete nahrávat videa/obrázky WebP do a Shopify obrázkový banner.

Zde je návod:

Krok 1: Vezměte své video a převeďte jej do souboru WebP Format

Online jsou různé bezplatné převodníky „video na WebP“. Vyzkoušejte online vyhledávání nebo použijte některý z námi testovaných převodníků:

• Ezgif
• MC převodník
• MP4.to

Nahrajte své video do bezplatného nástroje pro převod a poté jej převeďte do formátu WebP. Uložte nový soubor do počítače.

Krok 2: Najděte téma Dawn v Shopify

Přejděte na „Internetový obchod“ > „Motivy“.

Pokud jej ještě nemáte, nainstalujte si motiv Dawn. V opačném případě byste měli najít téma Dawn označené jako Shopify„Aktuální téma“. Pokračujte kliknutím na tlačítko „Přizpůsobit“.

Krok 3: Přidejte a vyberte blok obrázku banneru

Blok „Obrázkový banner“ je standardně přidán do motivu Dawn. Takže byste měli být schopni kliknout na tento modul a otevřít jeho nastavení v levém panelu. Je také možné kliknout na samotný banner obrázku ve vizuálním náhledu vpravo. Pokud potřebujete vložit „Obrázkový banner“ od začátku, použijte odkaz „Přidat blok“.

Krok 4: Nahrajte soubor videa WebP

Klikněte na tlačítko „Vybrat obrázek“ v části „První obrázek“.

Tím se načte oblast pro nahrání obrázků do knihovny médií úložiště. Je také možné vložit adresy URL videa, ale použijeme funkci nahrávání. Vyberte tlačítko „Přidat obrázky“ a vyberte soubor WebP, který jste vytvořili dříve. Označte nově nahraný soubor zaškrtnutím a poté klikněte na tlačítko „Hotovo“.

Tím se soubor videa WebP přesune na banner obrázku, což vám umožní upravovat jakýkoli obsah v popředí. Klikněte na „Uložit“.

Gratulujeme, úspěšně jste přidali banner s tématem Dawn!

Krok 5: Náhled videa

Ale počkejte, je moudré prohlédnout si náhled videa na frontendu, abyste se ujistili, že vypadá správně, běží hladce a má odpovídající rozlišení.

Zpět na hlavní obrazovce řídicího panelu klikněte na ikonu oka a zobrazí se „Zobrazit váš online obchod“. Nachází se vedle „Internetový obchod“ pod sekcí „Prodejní kanály“.

Úspěch!

Přizpůsobení banneru s tématem Dawn: Udělejte si jej jedinečně podle sebe

Přizpůsobení zajistí, že vaše video dokonale zapadne do vaší značky a estetiky obchodu. Takže, vyhrneme si rukávy a ponoříme se do toho, ano?

Chcete-li zobrazit jeho nastavení, musíte vždy vybrat banner obrázku. Jakmile tam budete, můžete upravit neprůhlednost překryvného obrázku a změnit výšku banneru. Poté můžete upravit umístění obsahu plochy a změnit umístění překryvného textu.

Přesunutí obsahu a pozic tlačítek funguje pro zobrazení textu a tlačítka nad oblastí videa, kde jsou nejvíce viditelné.

Pro další přizpůsobení máte přístup do sekce „Vlastní CSS“.

A samozřejmě je možné vybrat text obsahu nebo tlačítko a změnit, co říkají a jak se zobrazují.

Tipy pro optimalizaci video souboru pro maximální rychlost a kompatibilitu

Působivé video nebude záležet na tom, zda zpomalí váš web k procházení nebo se na určitých zařízeních nezobrazí správně.

To je důvod, proč je optimalizace vašeho video souboru pro maximální rychlost a kompatibilitu nesmlouvavým úkolem. V této části se s vámi podělíme o několik užitečných tipů, jak zajistit, že váš video obsah bude efektivnější pro efektivní načítání a univerzální přehrávání.

• Používejte formáty souborů videa (jako WebP), které jsou široce kompatibilní s většinou webových prohlížečů.
• Udržujte velikost souboru videa co nejmenší. WebP odvádí skvělou práci při kompresi videa bez ztráty kvality.
• Nastavte poměr stran videa tak, aby odpovídal velikosti obrazovky.
• Vyberte si video s vyváženými barvami a kontrastem, které odráží osobnost obchodu.

Odstraňování běžných problémů s přidáním pozadí videa/banneru do motivu Dawn

Někdy, bez ohledu na to, jak jste byli opatrní, se mohou při přidávání banneru s tématem Dawn objevit problémy. Zde je několik tipů pro odstraňování problémů, když narazíte na problémy:

Problémy s nekompatibilitou

Zkuste video převést do kompatibilního formátu souboru, jako je WebP, nebo použijte odkaz pro vložení videa.

Velikost videa je příliš velká

Ořízněte video nebo jej zkomprimujte, aby se zmenšila velikost souboru při zachování kvality.

Video se nepřehraje automaticky

Zkontrolujte, zda jste v nastavení motivu povolili možnost „Automatické přehrávání“.

Náš závěr o přidání banneru s tématem Dawn

Podle našeho podrobného průvodce a tipů pro odstraňování problémů byste měli být schopni přidat banner s tématem Dawn Shopify s lehkostí.

jaké jsou vaše myšlenky? Dejte nám vědět v komentářích, zda se vám podařilo přidat banner s tématem Dawn!