Jak zdarma vložit amazonku astore na facebookovou stránku

Obchod na Facebooku?

Rozhodli jste se, že affiliate marketing je pro vás. Vytvořili jste Amazon Store. Strávili jste čas a pilně prosívali produkty, které k tomu přidali…

Využíváte sílu sociálních médií, máte dokonce stránku na Facebooku věnovanou vašemu úsilí o přidružení marketingu… Vytvořili jste titulní fotografii časové osy, abyste stránku vizuálně jasně vyjádřili… Na tuto stránku na Facebooku zveřejňujete aktualizace stavu s odkazy na konkrétní produkty ve vašem obchodě…

Nebylo by však úžasné, kdybyste se mohli pochlubit celým obchodem přímo na této stránce na Facebooku? No… můžete!

Správa vlastních karet je poměrně snadná. Můžete dokonce přizpůsobit obrázky a text nadpisu, které se zobrazují na samotné kartě.

Příklad

Podívejte se například na facebookovou stránku Communist Closet. Všimněte si záložky s názvem „Sovětský obchod?“

Sovětský obchod je obchod Amazon Store vložený přímo na stránku Facebooku s trochou kódu HTML a aplikací „Facebook-legal“. Ne, nic hackneme… jen využíváme zdroje.

Co budete potřebovat

Administrátorský přístup na stránku na Facebooku (pokud jste ji vytvořili, již máte administrátorský přístup)
Bezplatná aplikace pro vlastní kartu (ráda používám statické karty HTML: karty iframe)
Amazon aStore a související odkaz

Udělejte si laskavost… nechte si Facebook a Amazon Associate Central otevřít na samostatných kartách prohlížeče (nebo dokonce samostatných prohlížečích, pokud chcete). Tímto způsobem můžete mezi nimi v případě potřeby přecházet sem a tam.

Přidání aplikace

Přejděte do aplikace na Facebooku (pomocí odkazu výše) a kliknutím na tlačítko „nainstalovat“ přidejte aplikaci na svou stránku. Na další obrazovce vás aplikace požádá o potvrzení cíle instalace (stránka, na kterou aplikaci nainstalujete), pokud spravujete více než jednu stránku na Facebooku.

Vyberte správnou cílovou stránku a potvrďte kliknutím na tlačítko „nainstalovat“. Ano, je to opravdu tak jednoduché.

Upravte obsah karty

Po dokončení instalace aplikace se vraťte na svou stránku. Najdete novou kartu s názvem „Vítejte!“ na obrazovce. Klikněte na to a pojďme pracovat na nějaké magii!

Zatím si nedělejte starosti s názvem karty a obrázkem, brzy se k nim dostaneme.

Kliknutím na novou kartu Vítejte se dostanete na tuto obrazovku úprav. Zde budete moci:

Hostujte svůj „kód“ v sekci index.html
Uspořádejte kód dále v sekcích style.css a script.js (pro pokročilejší uživatele)
Změňte nastavení karty
Vytvořte Fan-Gate (uděláme to v jiném Hubu)

Ve výchozím nastavení přistanete v sekci index.html aplikace (zde budeme dělat veškerou naši práci). Smažte prosím stávající text v této sekci.

Získejte svůj aStore kód

V Centru pro spolupráci Amazonu:

Pomocí rozevírací nabídky v levé horní části obrazovky vyberte správné ID sledování vašeho aStore. (To je nutné pouze v případě, že máte na jednom účtu více obchodů… pokud máte jen jeden obchod, s tímto krokem si nedělejte starosti.)
V nabídce vlevo klikněte na „Získat odkaz“.
Na stránce se zobrazí nová obrazovka s názvem „Váš obchod byl publikován!“ Přímo pod oznámením uvidíte několik verzí vašeho odkazu aStore.
Vyberte možnost „Vložit můj obchod pomocí vloženého rámečku“. Tento kód mírně upravíme, abychom jej optimalizovali pro integraci s Facebookem.
Zkopírujte celý kód do textového pole a vložte jej do aplikace (sekce index.html) na Facebooku.

Kód, se kterým budeme pracovat, by měl být něco jako:

Zabezpečená adresa URL

Při prvním vložení kódu odkazu do aplikace se zobrazí zpráva s upozorněním na nezabezpečenou adresu URL vašeho obchodu. Ne, odkaz se vás nebude ptát, zda jeho zdrojový kód vypadá tlustě. Některé prohlížeče ale nemusí váš aStore správně zobrazit, protože si „nemyslí“, že je obchod hostován na zabezpečeném serveru. To je zde zvlášť důležité, protože koneckonců nechceme, aby vaši potenciální zákazníci byli při nakupování paranoidní.

Takže první věc je první… Změňte http: // v kódu na http s: //

Upravte rozměry displeje

Nyní změníme zobrazené rozměry vašeho aStore na stránce na Facebooku.

Všimněte si, že šířka je nastavena na 90%? To je 90% toho, co prohlížeč vypočítá jako aktuální velikost stránky. To bude naprosto nepřesné… Šířku určíme jako 815 pixelů, aby se vešla do aplikace iframe.

Změnit width = "90%" na width = "815px"

Také doporučuji zkrátit výšku (výrazně) na 1000 nebo dokonce 1200 pixelů. Díky tomu bude váš obsah trochu obsažnější…

Změnit height = "4000" na height = "1200px"

Povolit posouvání

Váš aStore může být docela zdlouhavý (dokonce delší než původně specifikovaných 4000 pixelů). K tomu obvykle dochází, pokud jsou popisy produktů dlouhé a je zveřejněno také několik recenzí produktů. Ve výchozím nastavení je posouvání zakázáno… a to ořízne obsah nad stanovenou výšku. Protože nechceme omezovat váš aStore, povolíme posouvání.

Změnit rolování = "ne" na rolování = "ano"

Váš hotový kód by nyní měl vypadat asi takto:

Nezapomeňte stisknout tlačítko „Uložit a publikovat“ v pravém horním rohu. Svou práci si také můžete kdykoli prohlédnout pomocí sousedního tlačítka „Náhled“…

Vybíravý, vybíravý…

Dobře, hloupě… V aplikaci iframe máme kód iframe. Ano, je to nadbytečné. Ano, mělo by to být opraveno. Ale pro snadné použití v tomto průvodci úrovní pro začátečníky to nechám tak, jak je. Nesuďte mě.

Přizpůsobené tlačítko

Nyní, když je vaše integrace aStore dokončena, budete chtít to otravné malé „Vítejte!“ tlačítko na titulní stránce, aby vypadalo trochu smysluplnější, že?

Vraťte se do „předního konce“ své stránky na Facebooku.
Klikněte na malé tlačítko (se špičatým trojúhelníkem dolů) vpravo od všech záložek stránky.
Jak se stránka rozšiřuje, najeďte myší na nové „Vítejte!“ záložka.
Všimněte si, že se na kartě objeví nová ikona (tužka). Kliknutím na tuto ikonu zobrazíte novou rozevírací nabídku.

V rozbalovací nabídce klikněte na Upravit nastavení.
Zobrazí se vyskakovací okno, ve kterém můžete změnit název karty a přidat vlastní obrázek, který se zobrazí jako tlačítko.
Přizpůsobte si kartu, jak chcete.