Cum să încorporezi gratuit un amazon astore într-o pagină de facebook

Un magazin în Facebook?

Ați decis că marketingul afiliat este pentru dvs. Ați construit un magazin Amazon. Ți-ai petrecut timpul, cercetând cu sârguință produse pentru a le adăuga…

Utilizând puterea rețelelor sociale, aveți chiar și o pagină de Facebook dedicată eforturilor dvs. de marketing afiliat… Ați creat o fotografie de copertă pentru a exprima în mod clar pagina vizuală… Postați actualizări de stare la acea pagină de Facebook cu linkuri către produse specifice în magazinul tău…

Dar nu ar fi minunat dacă ai putea arăta întreaga aStore chiar în acea pagină de Facebook? Ei bine… poți!

Filele personalizate sunt destul de ușor de gestionat. Puteți chiar personaliza imaginile și textul titlului care se afișează în filă.

Un exemplu

De exemplu, aruncați o privire pe pagina de Facebook a dulapului comunist. Observați fila intitulată „Magazin sovietic?”

Magazinul sovietic este un magazin Amazon Amazon încorporat direct în pagina de Facebook cu puțin HTML și o aplicație „legală pentru Facebook”. Nu, nu hackăm nimic… doar folosim resurse.

De ce veți avea nevoie

Acces de administrator la o pagină de Facebook (dacă ați creat-o, aveți deja acces de administrator)
Aplicație gratuită de file personalizate (îmi place să folosesc HTML static: file iframe)
Amazon aStore și linkul său asociat

Faceți-vă o favoare… să deschideți Facebook și Amazon Asociate Central în file separate de browser (sau chiar browsere separate, dacă preferați). În acest fel, puteți merge înainte și înapoi între cei doi dacă apare nevoia.

Adăugarea aplicației

Navigați la aplicația din Facebook (cu linkul de mai sus) și faceți clic pe butonul „instalați” pentru a adăuga aplicația la pagina dvs. În ecranul următor, aplicația vă va cere să confirmați destinația de instalare (pagina în care veți instala aplicația) dacă administrați mai multe pagini de Facebook.

Selectați pagina de destinație corespunzătoare și faceți clic pe butonul „instalați” pentru a confirma. Da, chiar este atât de simplu.

Editați conținutul filei

După finalizarea instalării aplicației, reveniți la pagina dvs. Veți găsi o filă nouă intitulată „Bun venit!” pe ecran. Faceți clic pe el și să facem magie!

Nu vă faceți griji cu privire la titlul filei și imaginea încă, vom ajunge la acestea în scurt timp.

Dacă faceți clic pe noua filă de întâmpinare, veți ajunge la acest ecran de editare. Aici veți putea:

Găzduiește „codul” tău în secțiunea index.html
Organizați codul în continuare în secțiunile style.css și script.js (pentru utilizatori mai avansați)
Schimbați setările filei
Creați un Fan-Gate (vom face asta într-un alt Hub)

În mod implicit, veți ateriza în secțiunea index.html a aplicației (aici vom face toată munca noastră). Vă rugăm să ștergeți textul existent în acea secțiune.

Obțineți codul dvs. aStore

În Asociația centrală Amazon:

Utilizați meniul derulant din partea stângă sus a ecranului pentru a selecta ID-ul de urmărire adecvat al magazinului dvs. (Acest lucru este necesar numai dacă aveți mai multe aStores în același cont… dacă aveți un singur aStore, nu vă faceți griji cu privire la acest pas.)
Faceți clic pe „Obțineți link” în meniul din stânga.
Pagina va afișa un nou ecran intitulat „Magazinul dvs. a fost publicat!” Chiar sub anunț, veți vedea mai multe versiuni ale linkului dvs. aStore.
Selectați opțiunea „Încorporează magazinul meu utilizând un cadru în linie”. Vom modifica acest cod ușor pentru a-l optimiza pentru integrarea Facebook.
Copiați tot codul din caseta de text și lipiți-l în aplicație (secțiunea index.html) din Facebook.

Codul cu care vom lucra ar trebui să fie ceva de genul:

Adresa URL sigură

Când lipiți pentru prima dată codul de link în aplicație, veți vedea un mesaj de avertizare despre faptul că adresa URL aStore este nesigură. Nu, linkul nu vă va întreba dacă codul sursă îl face să pară gras. Dar este posibil ca unele browsere să nu vă afișeze corect aStore, deoarece nu „cred” că magazinul este găzduit pe un server securizat. Acest lucru este deosebit de important aici, deoarece, la urma urmei, nu vrem să vă facem clienții potențiali paranoici atunci când cumpărați.

Deci, primul lucru este primul… Schimbați http: // din codul dvs. la http s: //

Reglați dimensiunile afișajului

Acum, vom modifica dimensiunile afișate ale aStore-ului dvs. pe pagina de Facebook.

Observați că lățimea este setată la 90%? Ei bine, acesta este 90% din ceea ce calculează browserul ca dimensiune curentă a paginii. Acest lucru va fi absolut inexact… Vom specifica lățimea ca 815 pixeli pentru a se încadra în aplicația iframe.

Schimbați lățimea = "90%" la lățimea = "815px"

De asemenea, recomand scurtarea înălțimii (semnificativ) la 1000 sau chiar 1200 pixeli. Vă va face conținutul puțin mai cuprins…

Schimbați înălțimea = "4000" la înălțimea = "1200px"

Permiteți derularea

AStore-ul dvs. poate deveni destul de lung (chiar mai lung decât cei 4000 de pixeli inițiali specificați). Acest lucru se întâmplă, în general, dacă descrierile de produse sunt lungi și există și câteva recenzii de produse postate. În mod implicit, derularea este dezactivată… și asta va întrerupe conținutul dincolo de înălțimea specificată. Deoarece nu vrem să vă limităm aStore, vom activa derularea.

Schimbați defilarea = "nu" la defilare = "da"

Codul dvs. finalizat ar trebui să arate acum așa:

Nu uitați să apăsați butonul „Salvați și publicați” din colțul din dreapta sus. De asemenea, puteți să vă previzualizați lucrarea în orice moment cu butonul „Previzualizare” adiacent…

Alegeri, Alegeri…

OK, îmi dau seama… Avem cod iframe într-o aplicație iframe. Da, este redundant. Da, ar trebui remediat. Dar, pentru a fi ușor de utilizat în acest ghid de nivel pentru începători, am să-l las așa cum este. Nu mă judeca.

Buton personalizat

Acum, după ce integrarea dvs. aStore este completă, veți dori acel mic "Bun venit!" butonul de pe prima pagină pentru a arăta puțin mai semnificativ, nu?

Reveniți la „partea frontală” a paginii dvs. de Facebook.
Faceți clic pe butonul mic (cu un triunghi ascuțit în jos) în dreapta imediată a tuturor filelor de pagină.
Pe măsură ce pagina se extinde, plasați mouse-ul peste noul „Bun venit!” filă.
Veți observa o nouă pictogramă (creion) care apare peste filă. Faceți clic pe această pictogramă pentru un nou meniu derulant.

Din meniul derulant, faceți clic pe „Editați setările”.
Va apărea o fereastră pop-up în care puteți schimba numele filei și puteți adăuga o imagine personalizată pentru a o afișa ca buton.
Personalizați fila după cum doriți.