Pengalaman komponen web klasik dan modern

Komponen web di SharePoint telah memungkinkan pengguna dari semua tingkat pengalaman untuk menambahkan fungsionalitas yang canggih dan dapat dikustomisasi ke halaman mereka.  Komponen web modern dirancang agar lebih mudah digunakan, siap pakai seluler, dan tampilan yang bagus.

Banyak komponen web modern memenuhi tujuan yang sama seperti komponen web klasik, tetapi Anda akan melihat perbedaan dalam tampilan dan fungsionalitas.

Penting untuk diperhatikan bahwa halaman modern hanya bisa menggunakan komponen web modern dan halaman klasik hanya bisa menggunakan komponen web klasik. Pengecualiannya adalah komponen web kustom yang dirancang khusus untuk digunakan pada halaman modern. Untuk pengembang, SharePoint Framework memungkinkan pembuatan komponen web modern kustom yang muncul langsung di kotak alat komponen web. Pengembang juga dapat menemukan panduan dan alat di Memodernisasi situs SharePoint klasik Anda. 

Penting untuk diperhatikan bahwa, untuk alasan keamanan, komponen web modern tidak memungkinkan penyisipan kode seperti JScript.

Membandingkan komponen web modern dan klasik

Tidak ada pemetaan komponen web klasik ke modern 1:1, tetapi ada komponen web yang memiliki tujuan serupa.  Berikut adalah beberapa komponen web yang umum digunakan berdasarkan tujuannya, dan beberapa perbedaan dalam komponen web modern.

Tujuan	Klasik	Modern
Menambahkan teks dan konten lainnya	Komponen web editor konten, Menambahkan teks dan konten lain secara langsung ke halaman Wiki	Komponen web teks Komponen web Teks memungkinkan Anda menambahkan dan memformat teks dan tabel di halaman dengan mudah. Ini memiliki toolbar pemformatan di mana Anda bisa memformat teks, mengubah gaya, dan lainnya. Tidak seperti komponen web editor konten, Anda tidak bisa mengedit HTML di dalam komponen web. Tabel bertumpuk belum didukung. Sintaks Wiki, seperti yang digunakan untuk membuat link dari dan ke halaman, tidak didukung pada halaman atau di komponen web Teks, tetapi mudah untuk membuat link di dalam komponen web Teks. Belum dimungkinkan untuk menambahkan gambar sebaris di dalam komponen web Teks, tetapi Anda bisa menambahkan gambar di samping komponen web teks dengan menggunakan komponen web Gambar.
Memperlihatkan pustaka dokumen	Perpustakaan	Pustaka dokumen Saat Anda membuat pustaka di situs klasik, komponen web pustaka dibuat secara otomatis, dan Anda bisa memilih untuk memperlihatkannya di halaman. Saat Anda menggunakan komponen web pustaka dokumen modern, Anda bisa memilih pustaka untuk diperlihatkan, dan memperlihatkan tampilan pustaka tertentu atau bahkan folder di dalam pustaka. Pengguna dengan izin yang sesuai bisa menambahkan, menampilkan atau mengedit file langsung dari komponen web. Pengguna juga dapat menyematkan dokumen ke bagian atas pustaka, mengunduh, menghapus, dan mengganti nama file. Selain itu, file bisa diperlihatkan dalam tampilan detail atau tampilan ubin, dan pemformatan kolom dan folder bertumpuk yang dibuat dalam daftar sumber diperlihatkan.
Memperlihatkan daftar	Daftar	Daftar Saat Anda membuat daftar di situs klasik, komponen web daftar secara otomatis dibuat untuk daftar itu, dan Anda bisa memilih untuk memperlihatkannya di halaman. Komponen web daftar modern memungkinkan Anda memilih daftar, dan mengkustomisasinya dengan judul, tampilan, dan bahkan ukuran Anda sendiri. Pengguna bisa menampilkan, memfilter, mengurutkan, dan mengelompokkan daftar. Selain itu, kolom yang diformat dan grup bertumpuk yang dibuat dalam daftar sumber diperlihatkan di komponen web.
Memperlihatkan file	Penampil halaman	Penampil file Komponen web penampil File modern memungkinkan Anda menyematkan lebih dari 270 tipe file termasuk tidak hanya file Word, Excel, dan PowerPoint yang sudah tidak asing lagi, tetapi juga tipe file tingkat lanjut seperti model 3D dan gambar medis. Catatan: Di SharePoint 2019, tipe file yang bisa disisipkan terbatas pada Word, Excel, dan PowerPoint (khususnya .doc, .docx,. xls, .xlsx, .pot, .potx, .ppt dan .pptx).Sematkan komponen web Komponen web Sematkan memungkinkan Anda menampilkan konten di halaman Anda dari situs yang memungkinkan penyematan (seperti YouTube, misalnya). Bergantung pada situs web, Anda bisa menggunakan alamat web situs atau kode semat yang disediakan situs.
Menambahkan kontak	Komponen web detail kontak	komponen web People Komponen web detail Kontak klasik memungkinkan Anda menambahkan satu kontak secara manual dalam satu waktu. Komponen web People modern memungkinkan Anda menambahkan beberapa kontak dari profil pengguna bersama dengan informasi visual dan organisasi. Tampilan detail kontak dapat diubah dari ringkas menjadi deskriptif, yang berarti detail selengkapnya tentang kontak bisa diperlihatkan langsung di halaman.
Tambahkan gambar	Komponen web gambar, Komponen web editor konten, Pustaka gambar	Komponen web gambar Komponen web Gambar menambahkan sumber tambahan untuk gambar: terbaru, pencarian web, dan OneDrive. Ukuran gambar dapat dimodifikasi menjadi rasio standar dan kustom. Komponen web galeri gambar Komponen web Galeri gambar memungkinkan Anda menambahkan gambar dalam ubin atau tata letak karoseri. Sementara dalam tata letak carousel gambar dapat diatur ke ukuran rasio yang tak asing lagi. Gambar yang lebih kecil akan diberi ukuran hingga rasio isian, tetapi gambar yang lebih besar tidak akan diubah ukurannya. Komponen web hero Komponen web Hero dapat diatur untuk menampilkan hingga 5 elemen dalam susunan ubin atau lapisan, membawa fokus ke elemen individual sesuai kebutuhan. Elemen individual dapat memiliki judul, gambar tertentu, dan teks alternatif. Anda juga dapat menyusun elemen sesuai kebutuhan. Penampil file Gunakan penampil File untuk memperlihatkan model 3D. Ini sangat berguna untuk model medis.
Memperlihatkan video di halaman	Komponen web media	Penampil file Komponen web Penampil File memungkinkan Anda menampilkan video lokal dari situs SharePoint Anda (seperti . MOV, .MP4, dan . WMV). Sematkan komponen web Dengan komponen web Sematkan, Anda bisa menampilkan video (atau konten lain) di halaman Anda dari situs yang memungkinkan penyematan (seperti YouTube, misalnya). Bergantung pada situs web tempat Anda menyematkan, Anda bisa menggunakan alamat web situs atau kode semat yang disediakan situs. Hanya SharePoint di Microsoft 365. video Stream Komponen web video Stream memutar video dari layanan Microsoft Stream sebagai beberapa format video yang disebut saluran atau sebagai video tunggal. Ini menambahkan pengaturan pemutaran sosial dan tingkat lanjut terbaru seperti menyukai, mengubah kecepatan pemutaran, menonton dengan subtitel yang dihasilkan (hanya dalam bahasa Inggris dan Spanyol), dan membuat daftar putar. Tidak diperlukan plugin browser tambahan. Metadata dan izin tertentu video diatur dalam layanan Microsoft Stream. Komponen web YouTube Komponen web YouTube memungkinkan Anda menyematkan video YouTube langsung di halaman Anda, termasuk kemampuan untuk mengatur waktu mulai dan menampilkan kontrol pemutar.
Memperlihatkan tanggal dan waktu rapat dan acara mendatang	Kalender	Acara Komponen web Acara menampilkan acara dalam format kartu rentang tanggal atau kartu film yang dapat dikustomisasi. Data kejadian yang diperluas juga bisa memiliki gambar acara, peta Bing, dan data rapat. Anda bisa mengunduh rapat dengan . Format ICS, tapi komponen web Acara tidak bisa tersambung atau dibaca dari layanan kalender Exchange. Komponen web Acara menggunakan daftar yang sama seperti komponen web Calendar, tapi kolom yang dikustomisasi tidak ditampilkan di komponen web Acara. Kalender grup Komponen web kalender Grup menggunakan aplikasi kalender grup Microsoft 365 untuk penyimpanan acara. Acara grup baru tidak bisa ditambahkan dengan komponen web Kalender grup. Acara ditampilkan dalam format daftar untuk memaksimalkan setiap detail acara yang diperluas. Anda bisa menentukan jumlah acara yang diperlihatkan di setiap halaman dan menggulir halaman. Hanya SharePoint di Microsoft 365.
Memperlihatkan tautan ke konten lain	Tautan yang dipromosikan, Tautan, Komponen web editor konten, Pengumuman, Tautan Ringkasan	Tautan cepat Komponen web Tautan cepat dapat diatur untuk ditampilkan sebagai format carousel yang disebut format ringkas film atau yang lebih kecil. Setiap tautan dalam format ringkas dapat disusun dan ditampilkan dengan atau tanpa gambar. Belum dimungkinkan untuk mengisi tautan Cepat berdasarkan daftar. Link Komponen web Link memperlihatkan satu tautan URL lengkap, dan menambahkan kemampuan untuk memperlihatkan atau menyembunyikan panel pratinjau dengan target tautan. Hanya SharePoint di Microsoft 365. Komponen web teks Di komponen web Teks, Anda bisa menambahkan link di dalam konten Anda menggunakan toolbar.
Mencari dan menampilkan konten	Kueri konten, Pencarian konten	Konten yang disorot Dengan komponen web Konten yang disorot, banyak opsi pencarian/kueri tingkat lanjut dan membingungkan telah diganti dengan opsi kueri yang disederhanakan. Namun, tidak seperti rekan-rekan klasiknya, Anda tidak dapat menggunakan templat tampilan kustom.
Mengumumkan berita kepada tim Anda	Pengumuman	Berita Komponen web Pengumuman klasik menggunakan daftar untuk memperlihatkan pengumuman di halaman Anda. Komponen web Berita adalah sistem distribusi konten luas yang menggunakan halaman yang kaya, diformat atau tautan ke berita, dan menggulung postingan berita di situs laman, situs, dan hub SharePoint. Komponen web bisa dikustomisasi untuk menampilkan hasil dalam beberapa cara berbeda. Ini memberikan pengalaman yang lebih kaya dan lebih dinamis melalui daftar pengumuman statis.
Melacak proyek	Daftar tugas	Planner Komponen web Planner modern berfungsi dengan grup Microsoft 365 dan layanan Planner Microsoft 365. Paket disimpan di layanan Perencana Microsoft 365 yang memungkinkan kustomisasi yang lebih besar. Garis waktu default dihapus untuk opsi tampilan yang lebih fleksibel yang menyertakan dasbor gambaran umum baca-saja yang disebut papan atau tata letak Kanban yang disebut wadah. Menggunakan tata letak wadah memungkinkan pengelompokan menurut wadah, ditetapkan ke, kemajuan, tanggal jatuh tempo, dan kategori label. Selain itu tata letak Bucket memungkinkan penambahan dan pengubahan tugas secara langsung dalam paket yang disimpan di layanan Planner Microsoft 365. Komponen web ini hanya tersedia di SharePoint di Situs Tersambung Grup Microsoft 365.
Memperlihatkan situs dan tautan di halaman	Agregator situs	Situs Komponen web agregator Situs klasik difokuskan pada tampilan situs yang disederhanakan secara visual. Dengan komponen web Situs, daftar panjang file diganti dengan kartu informasi yang menampilkan file terakhir ditampilkan, terakhir diubah, dan paling populer. Situs dapat ditampilkan sebagai kartu atau dalam tata letak sfilm menggunakan mekanisme carousel untuk menggulir menelusuri situs yang dipilih. Hanya SharePoint di Microsoft 365.
Memperlihatkan percakapan di halaman Anda	Umpan situs	Komponen web Yammer Ada dua komponen web Yammer yang tersedia: Komponen web Percakapan Yammer memungkinkan pengguna berpartisipasi dalam percakapan Yammer untuk grup atau topik tertentu tanpa meninggalkan halaman SharePoint Anda. Komponen web Sorotan Yammer menampilkan percakapan tertentu, teratas, atau terbaru. Karena Yammer telah menggantikan fitur SharePoint Newsfeed, komponen web Yammer modern menggantikan komponen web umpan Situs klasik.
Memperlihatkan konten dari halaman lain	Penampil halaman	Embed Komponen web penampil Halaman dan komponen web Sematkan memungkinkan Anda menampilkan konten dari situs lain yang memungkinkan penyematan. Kode semat harus berbasis iframe, dan kode yang menggunakan <tag skrip> tidak didukung. Selain itu, hanya situs web aman yang dapat disematkan.
Mengumpulkan dan menampilkan data dari formulir	Formulir InfoPath	PowerApps Dengan PowerApps, Anda dapat menyusun formulir canggih untuk mengumpulkan, menyimpan, dan menampilkan data tanpa menggunakan kode. Anda juga bisa menggunakan PowerApps untuk mengkustomisasi formulir untuk daftar SharePoint. Hanya SharePoint di Microsoft 365. Microsoft Forms Dengan komponen web Microsoft Forms, Anda bisa menambahkan formulir atau hasil formulir ke halaman Anda. Anda juga bisa menampilkan hasil ringkasan dalam bagan langsung di halaman. Hanya SharePoint di Microsoft 365.