Jika anda sudah ada laman web sendiri (WordPress, Wix, Squarespace, HTML biasa, jenisnya tidak begitu penting), kod sematan membolehkan anda meletakkan ciri sertai, acara dan derma Anggota terus pada laman itu, dan semua yang dilakukan orang di sana tetap mengalir kembali ke akaun Anggota anda.

Dua cara meletakkan Anggota di web

Anda boleh menggunakan laman web terbitan Anggota, yang terbina dalam dan tidak memerlukan kod (lihat laman web Anggota anda), atau sematkan widget ke dalam laman web yang sudah anda uruskan, menggunakan kod di bawah. Kedua-duanya bercakap dengan akaun yang sama, jadi ahli, acara, pembayaran dan pesanan kekal di satu tempat, apa pun yang anda pilih.

Mencipta kunci sematan

1. Buka Lagi → Tetapan → Kod benam.
2. Tambah alamat web tempat widget akan berjalan pada Origin yang dibenarkan - satu setiap baris, cth. https://www.persatuananda.org. Widget hanya berjalan pada domain yang anda senaraikan di sini.
3. Simpan untuk mendapatkan kunci awam anda (bermula dengan pk_).

Menyalin cebisan widget

Tetapan → Kod benam memberi anda cebisan siap pakai bagi setiap widget - sertai peringkat keahlian, log masuk ahli, senarai acara, kalendar acara, borang derma, dan (kalau kedai dihidupkan) kedai - yang sudah terisi dengan kunci anda. Salin yang anda mahu dan tampal ke dalam HTML laman web anda di tempat widget itu perlu muncul.

Butang sertai keahlian (satu bagi setiap peringkat keahlian):

<div id="join-gold"
  data-checkout="membership"
  data-mode="join"
  data-publishable-key="YOUR_PUBLISHABLE_KEY"
  data-membership-level-id="12"
  data-payment-method="online"
  data-api-base="https://anggota.app/api"></div>
<script src="https://anggota.app/embed/anggota.js"></script>
<script src="https://js.stripe.com/v3/"></script>
<script>Anggota.boot(document.getElementById('join-gold'));</script>

Senarai acara:

<div id="ac-events"
  data-checkout="events"
  data-publishable-key="YOUR_PUBLISHABLE_KEY"
  data-site-base="https://anggota.app"
  data-api-base="https://anggota.app/api"
  data-limit="10"
  data-desktop-cards="3"
  data-slider="true"></div>
<script src="https://anggota.app/embed/anggota.js"></script>
<script>Anggota.boot(document.getElementById('ac-events'));</script>

Borang derma:

<div id="ac-donate"
  data-checkout="donate"
  data-publishable-key="YOUR_PUBLISHABLE_KEY"
  data-currency="MYR"
  data-api-base="https://anggota.app/api"></div>
<script src="https://anggota.app/embed/anggota.js"></script>
<script>Anggota.boot(document.getElementById('ac-donate'));</script>

Tersedia juga widget log masuk ahli (data-checkout="login"), kedai (data-checkout="shop"), galeri foto (data-checkout="gallery"), dan direktori (data-checkout="directory"). Sentiasa salin cebisan itu tepat dari Tetapan → Kod benam - cebisan itu sudah berisi kunci sebenar anda. Baris js.stripe.com hanya diperlukan untuk widget yang menerima bayaran kad dalam talian.

Log masuk ahli tersedia dalam dua bentuk, kedua-duanya tersenarai di Tetapan → Kod benam: lalainya ialah butang yang mengarahkan ahli ke halaman log masuk yang dihoskan; menambah data-mode="inline" akan memaparkan medan e-mel terus pada halaman anda, tanpa lencongan.

Widget galeri foto

Widget galeri memaparkan galeri foto anda - galeri yang sama yang anda uruskan dalam ruang kerja - pada laman anda sendiri. Lalainya memaparkan seluruh galeri dengan satu tab bagi setiap bahagian; pemilih pada halaman Kod benam menulis semula cebisan itu untuk memaparkan satu bahagian sahaja. Susun atur, lajur dan kelakuan klik mengikut tetapan paparan galeri anda, jadi perubahan dalam Anggota turut mengubah sematannya.

Widget direktori

Widget Direktori meletakkan salah satu direktori anda pada laman anda: grid imej muka depan dengan penapis kategori dan carian langsung, setiap kad berpaut ke halaman penuh entrinya. Cebisannya muncul di Tetapan → Kod benam setelah direktori dihidupkan, sudah ditetapkan kepada warna aksen laman anda (data-accent-color), dan data-columns mengawal bilangan lajur grid pada desktop.

Setiap cebisan memaparkan satu direktori, yang ditentukan oleh data-directory="alamat-webnya". Jika anda ada lebih daripada satu direktori awam, pilih di Direktori mana di sebelah cebisan dan kodnya dikemas kini mengikutnya. Cebisan tanpa baris data-directory memaparkan direktori lalai anda (direktori perniagaan, jika ada), jadi cebisan yang ditampal sebelum boleh ada banyak direktori terus berfungsi.

Widget ini hanya berfungsi untuk direktori yang tetapan Siapa yang boleh melihatnya ialah Awam - direktori ahli sahaja enggan terpapar pada laman luaran.

Widget Portal ahli

Widget Portal ahli (data-checkout="member-portal") memberi ahli yang telah log masuk panel akaun mereka sendiri pada laman anda, dengan empat tab:

• Keahlian - peringkat dan status mereka, dengan butang Baharui sekarang apabila pembaharuan matang
• Acara saya - acara yang telah mereka daftari
• Invois - invois mereka dan status bayaran setiap satu
• Profil - nama pertama, nama akhir, telefon dan organisasi, yang boleh mereka ubah sendiri

Widget ini hanya tentang mereka, jadi ia sengaja tidak memaparkan acara akan datang atau derma (itu tugas widget lain).

Pelawat yang belum log masuk hanya melihat mesej ringkas dan pautan Log masuk di sini, jadi widget ini selamat diletakkan pada halaman awam.

Widget borang hubungi

Widget Borang hubungi (data-checkout="contact") meletakkan borang pertanyaan pada laman anda. Pertanyaan masuk melalui e-mel dan balasan terus kembali kepada orang yang menulis. Anda menentukan ke mana pertanyaan itu mendarat di Tetapan → Kod benam → Tetapan hubungi, dan di situ anda juga boleh menambah pilihan subjek kalau mahu pertanyaan diasingkan.

Ahli yang telah log masuk

Sebaik seorang ahli log masuk melalui mana-mana widget Anggota, widget lain mengenali mereka untuk 24 jam berikutnya, pada domain anda sahaja:

• Butang sertai berhenti menawarkan peringkat yang sudah mereka miliki. Sebaliknya, ia memaparkan Baharui apabila pembaharuan matang, menandakan pelan semasa mereka, atau mengajak mereka menghubungi anda untuk bertukar pelan.
• Borang tiba sudah terisi dengan butiran mereka, dengan e-mel dikunci pada akaun tempat mereka log masuk.

Membawa ahli kembali ke laman anda

Beberapa langkah (membayar dengan kad, arahan pembayaran luar talian, borang pendaftaran yang lebih panjang) diserahkan kepada halaman Anggota yang dihoskan. Beritahu Anggota di mana laman anda berada supaya halaman itu boleh menghantar orang pulang semula:

1. Buka Tetapan → Kod benam.
2. Di bahagian Laman web utama, masukkan alamat laman anda (mestilah salah satu origin yang anda benarkan).
3. Simpan.

Selepas itu, pautan "Kembali ke…" menuju laman anda, bukan laman yang dihoskan Anggota, dan ahli yang menyelesaikan pembayaran akan melihat halaman terima kasih yang beberapa saat kemudian mengembalikan mereka ke halaman tepat tempat mereka bermula.

Tip: anda bebas menggayakan halaman di sekelilingnya sesuka hati - widget dipaparkan di dalam <div> yang anda letakkan, jadi ia menyatu kemas dengan susun atur anda sendiri.

Seterusnya: lebih suka halaman siap pakai? Lihat laman web Anggota anda.