Cara memasukkan amazon ke laman facebook secara percuma

Kedai di Facebook?

Anda telah memutuskan bahawa pemasaran gabungan adalah untuk anda. Anda telah membina Amazon aStore. Anda telah menghabiskan masa anda, dengan tekun menapis produk untuk menambahkannya…

Dengan memanfaatkan kekuatan media sosial, anda bahkan mempunyai halaman Facebook yang dikhaskan untuk usaha pemasaran afiliasi anda… Anda membuat gambar sampul garis masa untuk menyatakan halaman dengan jelas secara visual… Anda menyiarkan kemas kini status ke halaman Facebook itu dengan pautan ke produk tertentu di Kedai anda…

Tetapi tidak akan mengagumkan jika anda dapat memamerkan keseluruhan aStore di halaman Facebook itu? Baiklah… anda boleh!

Tab tersuai agak mudah dikendalikan. Anda bahkan boleh menyesuaikan gambar dan teks tajuk yang dipaparkan pada tab itu sendiri.

Satu contoh

Lihat halaman Facebook Komunis Closet, misalnya. Perhatikan tab bertajuk "Kedai Soviet?"

Kedai Soviet adalah Amazon aStore yang disematkan terus ke halaman Facebook dengan sedikit HTML dan aplikasi "Facebook-legal". Tidak, kami tidak menggodam apa-apa… hanya menggunakan sumber.

Apa yang Anda Perlu

Akses pentadbir ke halaman Facebook (jika anda membuatnya, anda sudah mempunyai akses pentadbir)
Aplikasi tab tersuai percuma (Saya suka menggunakan HTML Statik: tab iframe)
Amazon aStore dan pautan yang berkaitan

Tolonglah… buka Facebook dan Amazon Associate Central dalam tab penyemak imbas yang berasingan (atau bahkan penyemak imbas yang berasingan, jika anda mahu). Dengan cara itu, anda boleh pergi dan balik di antara keduanya sekiranya keperluan itu timbul.

Menambah Aplikasi

Navigasi ke aplikasi dalam Facebook (dengan pautan di atas) dan klik butang "pasang" untuk menambahkan aplikasi ke halaman anda. Pada layar berikutnya, aplikasi akan meminta Anda untuk mengesahkan tujuan pemasangan (halaman di mana anda akan memasang aplikasi) jika anda mentadbir lebih dari satu halaman Facebook.

Pilih halaman tujuan yang betul dan klik butang "pasang" untuk mengesahkan. Ya, semudah itu.

Edit Kandungan Tab

Setelah pemasangan aplikasi selesai, kembali ke halaman anda. Anda akan menemui tab baru yang bertajuk "Selamat Datang!" di skrin anda. Klik dan mari kita buat sihir!

Jangan bimbang tentang tajuk dan gambar tab sebentar lagi, kita akan segera mendapatkannya.

Mengklik pada tab Selamat Datang baru anda akan membawa anda ke layar penyuntingan ini. Di sini, anda dapat:

Hoskan "kod" anda di bahagian index.html
Susun kod lebih jauh di bahagian style.css dan script.js (untuk pengguna yang lebih maju)
Ubah tetapan tab
Buat Gerbang Kipas (kami akan melakukannya di Hab lain)

Secara lalai, anda akan memasuki bahagian index.html aplikasi (di sinilah kami akan melakukan semua kerja kami). Sila padamkan teks yang ada di bahagian itu.

Dapatkan Kod aStore Anda

Di Pusat Bersekutu Amazon:

Gunakan menu tarik turun di kiri atas skrin untuk memilih ID penjejakan yang betul dari aStore anda. (Ini hanya perlu jika anda mempunyai beberapa stor dalam akaun yang sama… jika anda hanya mempunyai satu aStore, jangan risau tentang langkah ini.)
Klik "Dapatkan Pautan" di menu sebelah kiri.
Halaman akan memaparkan layar baru yang bertajuk "Kedai anda telah diterbitkan!" Tepat di bawah pengumuman, anda akan melihat beberapa versi pautan aStore anda.
Pilih pilihan "Benamkan kedai saya menggunakan bingkai sebaris". Kami akan mengubah sedikit kod ini untuk mengoptimumkannya untuk integrasi Facebook.
Salin semua kod di kotak teks dan tampal ke dalam aplikasi (bahagian index.html) dalam Facebook.

Kod yang akan kami bekerjasama mestilah seperti:

URL selamat

Semasa pertama kali menampal kod pautan anda ke dalam aplikasi, anda akan melihat mesej yang memberi amaran mengenai URL aStore anda tidak selamat. Tidak, pautan tidak akan bertanya kepada anda apakah kod sumbernya menjadikannya kelihatan gemuk. Tetapi, sebilangan penyemak imbas mungkin tidak memaparkan aStore anda dengan betul kerana mereka tidak "menyangka" bahawa kedai dihoskan di pelayan yang selamat. Ini sangat penting di sini kerana, bagaimanapun, kami tidak mahu menjadikan bakal pelanggan anda paranoid ketika berbelanja.

Jadi, perkara pertama yang pertama… Tukar http: // dalam kod anda menjadi http s: //

Laraskan Dimensi Paparan

Sekarang, kami akan mengubah dimensi aStore anda yang dipaparkan dalam halaman Facebook.

Perhatikan bahawa lebarnya ditetapkan 90%? Nah, itu 90% dari apa yang dihitung oleh penyemak imbas sebagai ukuran halaman semasa. Ini benar-benar tidak tepat… Kami akan menentukan lebarnya sebagai 815 piksel untuk dimasukkan ke dalam aplikasi iframe.

Tukar lebar = "90%" menjadi lebar = "815 piksel"

Saya juga mengesyorkan memendekkan ketinggian (dengan ketara) kepada 1000 atau bahkan 1200 piksel. Ini akan menjadikan kandungan anda sedikit lebih terkandung…

Tukar tinggi = "4000" ke tinggi = "1200px"

Benarkan Menatal

AStore anda boleh menjadi agak panjang (bahkan lebih lama daripada 4000 piksel asal yang ditentukan). Ini biasanya berlaku sekiranya keterangan produk panjang dan terdapat beberapa ulasan produk yang disiarkan juga. Secara lalai, tatal dilumpuhkan… dan itu akan memotong kandungan melebihi ketinggian yang ditentukan. Oleh kerana kami tidak mahu menghadkan aStore anda, kami akan mendayakan tatal.

Tukar tatal = "tidak" ke tatal = "ya"

Kod siap anda kini kelihatan seperti ini:

Jangan lupa tekan butang "Simpan & Terbitkan" di sudut kanan atas. Anda juga boleh melihat kerja anda pada bila-bila masa dengan butang "Pratonton" yang berdekatan…

Picky, Picky…

OK, saya memilih… Kami mempunyai kod iframe dalam aplikasi iframe. Ya, ia berlebihan. Ya, ia mesti diperbaiki. Tetapi, untuk kemudahan penggunaan dalam panduan peringkat pemula ini, saya akan meninggalkannya sebagaimana adanya. Jangan menilai saya.

Butang disesuaikan

Setelah integrasi aStore anda selesai, anda akan mahukan "Selamat Datang!" butang di halaman depan untuk kelihatan lebih bermakna, bukan?

Kembali ke "bahagian depan" halaman Facebook anda.
Klik butang kecil (dengan segitiga runcing ke bawah) di sebelah kanan semua tab halaman.
Semasa halaman berkembang, arahkan tetikus anda ke "Selamat Datang!" Yang baru tab.
Anda akan melihat ikon baru (pensil) muncul di atas tab. Klik ikon ini untuk menu lungsur baru.

Dari menu lungsur turun, klik "Edit Tetapan."
Tetingkap pop timbul akan muncul di mana Anda dapat mengubah nama tab dan menambahkan gambar khusus untuk ditampilkan sebagai butang.
Sesuaikan tab sesuka hati.