Paano mag-embed ng isang amazon astore sa isang pahina ng facebook nang libre

Isang aStore sa Facebook?

Napagpasyahan mo na ang kaakibat na pagmemerkado ay para sa iyo. Bumuo ka ng isang Amazon aStore. Ginugol mo ang iyong oras, masigasig na nagsala sa mga produkto upang maidagdag dito…

Ginagamit ang kapangyarihan ng social media, mayroon ka ring pahina sa Facebook na nakatuon sa iyong mga pagsisikap sa marketing na kaakibat… Gumawa ka ng isang larawan sa takip ng timeline upang malinaw na maipakita ang pahina nang biswal… Nag-post ka ng mga pag-update ng katayuan sa pahina ng Facebook na may mga link sa mga tukoy na produkto sa iyong aStore…

Ngunit hindi ba magiging kahanga-hanga kung maipamalas mo ang buong aStore sa mismong pahina ng Facebook? Kaya… kaya mo!

Ang mga pasadyang tab ay medyo madali upang pamahalaan. Maaari mo ring ipasadya ang mga imahe at teksto ng pamagat na lalabas sa mismong tab.

Isang halimbawa

Tingnan ang pahina ng Facebook ng Komunista Closet, halimbawa. Pansinin ang tab na pinamagatang "Soviet Shop?"

Ang Soviet Shop ay isang Amazon aStore na direktang naka-embed sa pahina ng Facebook na may isang maliit na HTML at isang "Facebook-ligal" na app. Hindi, hindi kami nagta-hack ng anumang… paggamit lamang ng mga mapagkukunan.

Ano ang Kakailanganin Mo

Pag-access ng admin sa isang pahina sa Facebook (kung nilikha mo ito, mayroon ka nang access sa admin)
Libreng pasadyang tab app (Gusto kong gumamit ng Static HTML: mga tab na iframe)
Ang Amazon aStore at ang kaugnay na link

Ginusto mo ba ang iyong sarili… buksan ang Facebook at Amazon Associate Central sa magkakahiwalay na mga tab ng browser (o kahit na magkakahiwalay na mga browser, kung gusto mo). Sa ganoong paraan, maaari kang bumalik-balik sa pagitan ng dalawa kung kailangan ang pangangailangan.

Pagdaragdag ng App

Mag-navigate sa app sa loob ng Facebook (kasama ang link sa itaas) at i-click ang pindutang "i-install" upang idagdag ang app sa iyong pahina. Sa susunod na screen, hihilingin sa iyo ng app na kumpirmahin ang patutunguhan sa pag-install (ang pahina kung saan mo mai-install ang app) kung nangangasiwa ka ng higit sa isang pahina sa Facebook.

Piliin ang tamang pahina ng patutunguhan at i-click ang pindutang "i-install" upang kumpirmahin. Oo, talagang simple lang iyon.

I-edit ang Nilalaman ng Tab

Matapos makumpleto ang pag-install ng app, bumalik sa iyong pahina. Mahahanap mo ang isang bagong tab na pinamagatang "Maligayang Pagdating!" sa iyong screen. I-click ito at gumawa tayo ng ilang mahika!

Huwag mag-alala tungkol sa pamagat ng tab at imahe pa lang, makakarating kami sa mga iyon.

Ang pag-click sa iyong bagong tab na Maligayang pagdating ay magdadala sa iyo sa screen ng pag-edit na ito. Dito, magagawa mong:

I-host ang iyong "code" sa seksyong index.html
Ayusin pa ang code sa mga seksyon ng style.css at script.js (para sa mas advanced na mga gumagamit)
Baguhin ang mga setting ng tab
Lumikha ng isang Fan-Gate (gagawin namin iyon sa ibang Hub)

Bilang default, mapupunta ka sa seksyong index.html ng app (dito namin gagawin ang lahat ng aming trabaho). Mangyaring tanggalin ang umiiral na teksto sa seksyong iyon.

Kunin ang Iyong aStore Code

Sa Associate Central ng Amazon:

Gamitin ang drop down menu sa kaliwang itaas ng screen upang mapili ang tamang tracking ID ng iyong aStore. (Kailangan lang ito kung marami kang aStores sa parehong account… kung mayroon ka lamang isang aStore, huwag mag-alala tungkol sa hakbang na ito.)
I-click ang "Kumuha ng Link" sa kaliwang menu.
Magpapakita ang pahina ng isang bagong screen na pinamagatang "Nai-publish ang iyong tindahan!" Direkta sa ibaba ng anunsyo, makakakita ka ng maraming mga bersyon ng iyong link sa aStore.
Piliin ang opsyong "I-embed ang aking tindahan gamit ang isang inline frame" na opsyon. Babaguhin naming baguhin ang code na ito upang ma-optimize ito para sa pagsasama sa Facebook.
Kopyahin ang lahat ng code sa text box at i-paste ito sa app (seksyon ng index.html) sa loob ng Facebook.

Ang code na makikipagtulungan sa amin ay dapat na katulad ng:

Ligtas na URL

Kapag unang na-paste ang iyong link code sa app, makakakita ka ng isang babalang mensahe tungkol sa iyong pagiging walang seguridad sa iyong aStore URL. Hindi, hindi ka tatanungin ng link kung ang pinagmulan ng code ng code ay ginagawang taba nito. Ngunit, ang ilang mga browser ay maaaring hindi maipakita nang maayos ang iyong aStore dahil hindi nila "iniisip" na ang tindahan ay nai-host sa isang ligtas na server. Partikular itong mahalaga dito sapagkat, kung tutuusin, hindi namin nais na gawing paranoid ang iyong mga potensyal na customer kapag namimili.

Kaya, una muna… Baguhin ang http: // sa loob ng iyong code sa http s: //

Ayusin ang Mga Dimensyon ng Display

Ngayon, babaguhin namin ang ipinakitang mga sukat ng iyong aStore sa loob ng pahina ng Facebook.

Pansinin na ang lapad ay nakatakda sa 90%? Kaya, iyon ang 90% ng kinakalkula ng browser bilang kasalukuyang laki ng pahina. Ito ay magiging ganap na hindi tumpak… Tutukuyin namin ang lapad bilang 815 mga pixel upang magkasya sa iframe app.

Palitan ang lapad = "90%" sa lapad = "815px"

Inirerekumenda ko rin na paikliin ang taas (makabuluhang) sa 1000 o kahit na 1200 pixel. Gagawin nitong konti ang iyong nilalaman…

Baguhin ang taas = "4000" hanggang sa taas = "1200px"

Payagan ang Pag-scroll

Ang iyong aStore ay maaaring makakuha ng masyadong mahaba (kahit na mas mahaba kaysa sa orihinal na 4000 mga pixel na tinukoy). Karaniwan itong nangyayari kung ang mga paglalarawan ng produkto ay mahaba at maraming mga pagsusuri sa produkto ang nai-post din. Bilang default, hindi pinagana ang pag-scroll… at makakapagputol ng nilalaman nang lampas sa tinukoy na taas. Dahil hindi namin nais na limitahan ang iyong aStore, paganahin namin ang pag-scroll.

Palitan ang pag-scroll = "hindi" sa pag-scroll = "oo"

Ang iyong natapos na code ay dapat magmukhang ganito:

Huwag kalimutang pindutin ang pindutang "I-save at I-publish" sa kanang sulok sa itaas. Maaari mo ring i-preview ang iyong trabaho sa anumang oras gamit ang katabing pindutang "Preview"…

Mapili, Mapili…

OK, tumitingin ako… Mayroon kaming iframe code sa loob ng isang iframe app. Oo, ito ay kalabisan. Oo, dapat itong ayusin. Ngunit, para sa kadalian ng paggamit sa gabay sa antas ng nagsisimula, iiwan ko ito tulad ng dati. Wag mo akong husgahan

Pasadyang Button

Ngayong kumpleto na ang iyong pagsasama ng aStore, gugustuhin mo ang maliit na maliit na "Maligayang Pagdating!" pindutan sa front page upang tumingin ng kaunti pang makabuluhan, tama?

Bumalik sa "front end" ng iyong pahina sa Facebook.
I-click ang maliit na pindutan (na may pababang itinuro na tatsulok) sa agarang kanan ng lahat ng mga tab ng pahina.
Habang lumalaki ang pahina, i-hover ang iyong mouse sa bagong "Maligayang Pagdating!" tab
Mapapansin mo ang isang bagong icon (lapis) na lilitaw sa tab. I-click ang icon na ito para sa isang bagong drop-down na menu.

Mula sa drop-down na menu, i-click ang "I-edit ang Mga Setting."
Lilitaw ang isang popup window kung saan maaari mong baguhin ang pangalan ng tab at magdagdag ng isang pasadyang imahe upang ipakita bilang pindutan.
Ipasadya ang tab ayon sa gusto mo.