Butang & Ikon

Menggunakan Butang & Pautan, anda boleh menambah apa-apa jenis pautan (1) kepada seksyen. Anda boleh menambah Butang/Pautan Teks/Pautan Imej/Ikon/Pemisah.

Anda boleh Pendua (2), Edit (3), atau Padam (4) butang/pautan sedia ada.

Dalam artikel ini:

1. Tambah Butang/Pautan
2. Butang/Pautan Gaya

---

Tambah Butang/Pautan

• Untuk menambah sebarang jenis pautan ke bahagian, klik pada + Butang Tambah pilihan.

. + Butang Tambah pilihan menyediakan empat cara untuk menambah pautan. Selain daripada ini, anda juga boleh menambah Pemisah untuk menambah ruang antara butang/pautan. Berikut ialah pilihan:

• Butang
• Gaya Butang
• Pautan Teks
• Image
• Icon
• pemisah

---

Butang

Tambahkan butang pada item senarai.

Anda akan dapat mengemas kini:

1. Label Butang – Nyatakan teks yang kelihatan pada butang anda. Inilah yang pengguna akan lihat dan klik pada.
2. Pautan Butang – Nyatakan URL atau tindakan butang harus dicetuskan apabila diklik.
3. Tetingkap Sasaran – Pilih sama ada pautan dibuka dalam tab yang sama atau tab baru.
4. Gaya Butang – Pilih gaya butang untuk menjadi lalai (ditetapkan dalam Butang dan Pautan tab bahagian Reka Bentuk), Pepejal, Rangka atau Pautan Teks.

• • default: Ikut tetapan tema tapak anda.
  • Pepejal: Butang tebal dan penuh.
  • Rangka: Latar belakang lutsinar dengan sempadan.
  • Pautan Teks: Gaya teks sahaja yang ringkas dan bersih (tiada kotak butang).

5. Bentuk Butang – Tetapkan a bentuk tersuai untuk setiap butang individu dalam bahagian. Ini membolehkan anda mengatasi bentuk butang global yang ditakrifkan di bawah Tetapan reka bentuk, memberi anda lebih kawalan ke atas cara setiap butang muncul. Bentuk yang tersedia ialah Segi Empat, Bulat dan Pil.
6. Warna Butang – Sesuaikan skema warna butang:

• • default: Mewarisi tetapan tema.
  • Songsangkan: Membalikkan warna teks/latar belakang butang.
  • Custom: Membolehkan anda memilih teks dan warna latar belakang tertentu.

7. Button Text - Sekiranya menggunakan Warna butang tersuai, anda boleh menetapkan warna teks (label). dari sini.
8. Latar Belakang Butang – Juga tersedia di bawah Custom, ini menetapkan warna latar belakang butang. Pasangkan ini dengan warna teks untuk kebolehbacaan dan gaya maksimum.
9. Ikon Butang – Tambahkan ikon di sebelah label butang anda. Anda boleh memilih daripada pelbagai pilihan ikon.
10. Susun atur – Kawal peletakan ikon berhubung dengan label. Pilihan susun atur yang tersedia ialah:

• • Label + Ikon: Teks muncul dahulu, diikuti dengan ikon.
  • Ikon + Label: Ikon muncul dahulu, kemudian teks.
  • Label + Ikon (Lebar): Teks dan ikon disusun dengan lebih banyak pelapik, sesuai untuk butang yang lebih lebar.
  • Ikon + Label (Lebar): Ikon pertama, susun atur padding yang lebih luas.

11. Warna Ikon – Pilih warna ikon butang. Anda boleh menetapkannya sama ada kepada Button Text warna atau Jenama warna.

---

Tetapan Gaya Butang

Anda akan menemui tetapan ini di bawah Tab gaya daripada bahagian. Tetapan ini membolehkan anda memperhalusi penampilan, jarak dan susun atur butang pada tapak Pixpa anda untuk kawalan reka bentuk dan responsif yang lebih baik:

1. Saiz Butang – Pilih saiz butang (cth, Kecil, Sederhana, Besar). Ini melaraskan padding dan saiz fon agar sesuai dengan reka bentuk anda.
2. Ruang Antara Butang – Mengawal jarak mendatar antara berbilang butang. Anda boleh menggunakan unit vw (lebar viewport) untuk jarak responsif.
3. Ruang Di Atas Butang – Menambah jarak menegak di atas butang. Ini membantu memisahkannya daripada kandungan di atas, diukur dalam %.
4. Pautan Teks – Laraskan saiz fon untuk pautan teks butang (terutamanya berguna apabila menggunakan gaya “Pautan Teks” dan bukannya butang tradisional).
5. Imej sebagai Butang (Saiz) – Jika anda menggunakan imej dan bukannya butang tradisional, tetapan ini mentakrifkan saiz paparan imej (dalam piksel).
6. Lebar Butang – Pilih sejauh mana lebar butang harus muncul:

• • default: Lebar standard berdasarkan kandungan butang
  • Besar / X-Besar: Butang yang lebih lebar untuk lebih penekanan
  • Kelebaran penuh: Butang meregangkan seluruh lebar bekas

---

Pautan Teks

Tambah pautan teks kepada item senarai.

Anda akan dapat mengemas kini:

1. Menetapkan label teks.
2. nyatakan pautan teks.
3. Tetingkap Sasaran – Pilih untuk membuka halaman dalam tetingkap yang sama atau baharu.

---

Image

Tambahkan imej dan pautkannya ke mana-mana halaman.

• Sebaik sahaja anda telah memuat naik imej, ia akan muncul dengan cara ini. Klik pada pautan untuk mengeditnya.

• Dari sini, anda boleh:
  1. Upload/Tukar imej.
  2. Pautan Butang – Nyatakan pautan.
  3. Tetingkap Sasaran – Pilih untuk membuka halaman dalam tetingkap yang sama atau baharu.

---

Ikon Sosial

• Tambahkan ikon sosial pada item senarai.

Anda boleh menguruskan:

1. Ikon sosial untuk dipautkan.
2. Tentukan laluan profil sosial anda yang berkaitan.
3. Tetingkap Sasaran – Pilih untuk membuka halaman dalam tetingkap yang sama atau baharu.

---

pemisah

. pemisah pilihan membolehkan anda memasukkan jarak antara butang atau pautan.

Ini berguna untuk mencipta pemisahan visual antara butang yang diletakkan berdekatan. Anda boleh menambah pemisah daripada Butang & Pautan panel sama seperti anda menambah butang lain.

• Ruang antara butang dikawal oleh Padding – Atas tetapan dalam Pemisah. Melaraskan nilai ini menambah atau mengurangkan jarak menegak antara butang yang diletakkan rapat.

 

---

Pilihan Gaya untuk Butang & Pautan

. pilihan gaya akan hadir di bawah Style tab semasa menguruskan bahagian.

Anda akan mempunyai berbilang pilihan gaya untuk Butang & Pautan seperti berikut:

Butang & Pautan

1. nyatakan Ruang Antara Butang/Pautan yang telah ditambah.
2. nyatakan Ruang Di Atas Butang/Pautan.
3. pilih Kesan hover untuk Butang/pautan.

Saiz Butang 

---

Contoh

Sebagai contoh, anda telah menambah pautan sosial Amazon dalam Butang/Pautan, dan dinyatakan warna ikon sebagai Merah dan warna latar belakang ikon sebagai Hijau, maka ikon akan muncul seperti di bawah: