> ## Documentation Index
> Fetch the complete documentation index at: https://help.scribe-mail.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Ikhtisar editor

> Jelajahi editor tanda tangan Scribe dan lihat bagaimana panel pohon, kanvas, panel gaya, bilah atas, dan bilah tindakan bekerja sama untuk membuat tanda tangan.

Editor Scribe adalah tempat Anda merancang tanda tangan email. Editor ini mengikuti tata letak tiga panel yang serupa dengan alat desain seperti Figma atau Framer: [panel pohon](/id/editor/tree-panel) di kiri, [kanvas](/id/editor/canvas) di tengah, dan [panel penataan](/id/editor/styling-panel) di kanan.

<Frame>
  <img src="https://mintcdn.com/scribe/Z_G2D9X-Tlrxu_Eh/images/editor-overview-three-panel-layout.png?fit=max&auto=format&n=Z_G2D9X-Tlrxu_Eh&q=85&s=b921c9bfe8ba7ac80bfc5599c483157e" alt="Tata letak tiga panel editor Scribe dengan pohon, kanvas, dan panel penataan" width="3456" height="1928" data-path="images/editor-overview-three-panel-layout.png" />
</Frame>

## Tata letak

**Panel pohon (kiri)**: Menampilkan struktur hierarkis tanda tangan Anda sebagai pohon yang dapat diciutkan. Setiap blok dalam tanda tangan Anda muncul di sini: kolom, blok teks, gambar, banner. Anda dapat memilih, mengurutkan ulang, menggandakan, menyembunyikan, dan menghapus blok dari panel ini.

<Frame>
  <img src="https://mintcdn.com/scribe/Z_G2D9X-Tlrxu_Eh/images/editor-overview-tree-panel.png?fit=max&auto=format&n=Z_G2D9X-Tlrxu_Eh&q=85&s=e00a98504c39679c23f6b1a558016e7d" alt="Panel pohon kiri menampilkan hierarki blok tanda tangan" title="Panel pohon kiri menampilkan hierarki blok tanda tangan" className="mx-auto" style={{ width:"34%" }} width="728" height="1764" data-path="images/editor-overview-tree-panel.png" />
</Frame>

**Kanvas (tengah)**: Pratinjau langsung tanda tangan Anda yang diperbarui secara real-time saat Anda melakukan perubahan. Klik blok mana pun langsung di kanvas untuk memilihnya, atau gunakan panel pohon. Kanvas menampilkan data rekan tim yang sebenarnya dari Smartfield sehingga Anda dapat melihat tampilan tanda tangan yang sesungguhnya.

<Frame>
  <img src="https://mintcdn.com/scribe/Z_G2D9X-Tlrxu_Eh/images/editor-overview-canvas-center.png?fit=max&auto=format&n=Z_G2D9X-Tlrxu_Eh&q=85&s=5015dd3876200251071a928ce99ebeff" alt="Panel tengah kanvas editor menampilkan pratinjau tanda tangan langsung" title="Panel tengah kanvas editor menampilkan pratinjau tanda tangan langsung" className="mx-auto" width="2156" height="1746" data-path="images/editor-overview-canvas-center.png" />
</Frame>

**Panel penataan (kanan)**: Muncul saat Anda memilih sebuah blok. Menampilkan semua opsi penataan untuk blok tersebut, termasuk properti tata letak, format teks, warna, jarak, dan koneksi Smartfield. Opsi yang ditampilkan berubah tergantung jenis blok yang dipilih.

<Frame>
  <img src="https://mintcdn.com/scribe/Z_G2D9X-Tlrxu_Eh/images/editor-overview-styling-panel.png?fit=max&auto=format&n=Z_G2D9X-Tlrxu_Eh&q=85&s=e8248501203acf14c76286f788b4b7cf" alt="Panel penataan kanan menampilkan opsi konfigurasi blok" title="Panel penataan kanan menampilkan opsi konfigurasi blok" className="mx-auto" style={{ width:"33%" }} width="696" height="1766" data-path="images/editor-overview-styling-panel.png" />
</Frame>

## Bilah atas

[Bilah atas](/id/editor/editor-top-bar) menampilkan informasi dan tindakan utama:

* **Panah kembali**: Kembali ke halaman detail tanda tangan
* **Nama dan status tanda tangan**: Menampilkan nama tanda tangan, jumlah rekan tim yang ditugaskan, dan status saat ini (Draf atau Diterbitkan)
* **Templat**: Jelajahi pustaka templat untuk memulai dari desain siap pakai
* **Quality check**: Menjalankan pemeriksaan kompatibilitas pada desain tanda tangan Anda. Klik untuk melihat daftar periksa yang memastikan tanda tangan Anda beradaptasi secara responsif pada semua ukuran layar, berfungsi dengan semua klien email dan browser, bekerja di desktop/mobile/tablet, dimuat cepat dengan HTML ringan, ditampilkan dengan benar saat menulis email, dan mempertahankan proporsi gambar di semua platform. Semua pemeriksaan harus berwarna hijau sebelum diterbitkan.
* **Preview**: Buka modal pratinjau untuk melihat tampilan tanda tangan bagi setiap rekan tim
* **Publish**: Terapkan perubahan desain Anda secara langsung. Setelah diterbitkan, pembaruan otomatis dikirim ke semua rekan tim yang sudah memasang.

<Frame>
  <img src="https://mintcdn.com/scribe/Z_G2D9X-Tlrxu_Eh/images/editor-overview-top-bar.png?fit=max&auto=format&n=Z_G2D9X-Tlrxu_Eh&q=85&s=c72972192e2a0ce27e68763eee6cbed9" alt="Bilah atas editor dengan tindakan Templat, Quality check, Preview, dan Publish" width="3456" height="176" data-path="images/editor-overview-top-bar.png" />
</Frame>

## Bilah tindakan

Di bagian bawah kanvas, bilah tindakan menyediakan:

* **Undo / Redo**: Mundur atau maju melalui perubahan Anda
* **Drag handle**: Atur ulang posisi tampilan kanvas
* **Kontrol zoom**: Perbesar (+), perkecil (−), atau atur tingkat zoom tertentu (mis. 100%)

<Frame>
  <img src="https://mintcdn.com/scribe/Z_G2D9X-Tlrxu_Eh/images/editor-overview-action-bar.png?fit=max&auto=format&n=Z_G2D9X-Tlrxu_Eh&q=85&s=8ffc4d4f58a9e87a76920ddacdaed15a" alt="Bilah tindakan editor dengan kontrol undo, redo, dan zoom" title="Bilah tindakan editor dengan kontrol undo, redo, dan zoom" className="mx-auto" style={{ width:"66%" }} width="668" height="226" data-path="images/editor-overview-action-bar.png" />
</Frame>

## Artikel terkait

* [Bilah tindakan](/id/editor/action-bar)
* [Tambahkan blok](/id/editor/add-blocks)
* [Membangun tata letak dengan kolom dan baris](/id/editor/building-layouts-with-columns-and-rows)
