Panduan Operasional CMS Kepri

Modul Pelatihan

Operasional CMS Kepri

Program Magang ASN — DIGI-GO Internship 2026

Diskominfo Provinsi Kepulauan Riau

Edisi: Juni 2026

Kata Pengantar

Penulis: Agam Yusliman, S.Kom — Tenaga Ahli Programmer Diskominfo Kepri

Di era transformasi digital pemerintahan, website resmi Organisasi Perangkat Daerah (OPD) bukan sekadar "kartu nama digital". Website OPD adalah jendela utama masyarakat untuk mengakses informasi publik, memantau kinerja pemerintahan, dan berpartisipasi dalam pembangunan daerah. Amanat Undang-Undang Nomor 14 Tahun 2008 tentang Keterbukaan Informasi Publik menegaskan bahwa setiap badan publik wajib menyediakan, mengumumkan, dan mendokumentasikan informasi secara proaktif kepada masyarakat.

Pemerintah Provinsi Kepulauan Riau melalui Dinas Komunikasi dan Informatika telah mengembangkan platform Satu CMS Kepri sebagai solusi terpadu pengelolaan website seluruh OPD di lingkungan Pemprov Kepri. Dalam rangka penguatan kompetensi ASN sebagai pengelola informasi publik, Program DIGI-GO Internship 2026 hadir sebagai bagian dari Corporate University Pemprov Kepri — sebuah ekosistem pembelajaran berbasis pengalaman nyata yang membekali ASN dengan keterampilan operasional di bidang teknologi informasi pemerintahan.

Modul ini disusun sebagai panduan praktis bagi peserta program magang ASN dalam mengelola konten website OPD melalui platform Satu CMS Kepri. Kami berharap modul ini tidak hanya menjadi referensi selama pelatihan, tetapi juga menjadi pegangan kerja sehari-hari bagi para pengelola website di masing-masing instansi. Dengan pengelolaan website yang baik, Kepulauan Riau akan semakin dekat menuju predikat Provinsi Informatif dalam penilaian Komisi Informasi.

Daftar Isi

Gunakan sidebar navigasi di sebelah kiri untuk berpindah antar bab. Berikut struktur modul ini:

BabJudulSub-Bab
IPendahuluanLatar Belakang, Landasan Hukum, Tujuan Modul, Peran Admin Web OPD
IIMengenal Satu CMS KepriKonsep & Filosofi Platform, Manfaat vs Website Mandiri, Struktur Fitur, Cara Login
IIIPengaturan Dasar PortalIdentitas Portal, Tampilan Visual, Kata Sambutan Pimpinan, Pengaturan Fitur
IVPengelolaan KontenMenu, Editor, Pustaka Tabel, Berita, Pengumuman, Agenda, Dokumen, Halaman, Galeri, Banner, Layanan
VLayanan TerintegrasiSurvei Kepuasan Masyarakat (SKM), PPID (Coming Soon)
VIPenutupPenutup

I Pendahuluan

1.1 Latar Belakang

Website OPD: Dari Formalitas Menuju Kewajiban Konstitusional

Selama lebih dari satu dekade, website OPD di berbagai daerah dikelola sebatas memenuhi kewajiban administratif — ada, tapi tidak diperbarui. Konten stagnan, informasi kadaluarsa, dan tidak ada yang merasa bertanggung jawab terhadap pemutakhiran data. Kondisi ini berubah drastis ketika Komisi Informasi mulai melakukan monitoring dan evaluasi (E-Monev) terhadap keterbukaan informasi badan publik secara terstruktur dan berbasis bukti.

Berdasarkan hasil penilaian E-Monev Keterbukaan Informasi Komisi Informasi Provinsi Kepulauan Riau Tahun 2025, sebagian besar OPD di lingkungan Pemprov Kepri masih berada pada predikat "Tidak Informatif" dan "Kurang Informatif". Kondisi ini bukan semata karena kurangnya informasi yang dimiliki OPD, melainkan karena informasi tersebut tidak dikelola, tidak didokumentasikan, dan tidak dipublikasikan melalui kanal resmi — termasuk website.

Pemerintah Provinsi Kepulauan Riau telah mengambil langkah strategis dengan menghadirkan platform Satu CMS Kepri — sebuah sistem manajemen konten terpadu yang memungkinkan seluruh OPD mengelola website resminya secara mandiri, terstandar, dan terintegrasi. Dengan platform ini, hambatan teknis yang selama ini menjadi alasan tidak terkelolanya website OPD dapat dieliminasi. Yang dibutuhkan adalah komitmen dan kapasitas SDM — inilah yang dijawab oleh DIGI-GO Internship 2026.

Fakta E-Monev KI Kepri 2025

Pada penilaian E-Monev KI Kepri 2025, dari seluruh OPD yang dinilai, hanya sebagian kecil yang meraih predikat "Informatif". Sebagian besar masih di bawah nilai 60 dari skala 100. Artinya, masih banyak pekerjaan rumah yang harus diselesaikan oleh setiap OPD.

1.2 Landasan Hukum

Dasar Regulasi Pengelolaan Informasi Publik

Pengelolaan website OPD bukan kegiatan sukarela — ia memiliki pijakan hukum yang kuat dan berjenjang dari level konstitusi hingga peraturan teknis. Berikut regulasi utama yang melandasi kewajiban badan publik dalam mengelola dan mempublikasikan informasi:

NoRegulasiTentangRelevansi Langsung
1UUD 1945 Pasal 28FHak atas informasi sebagai hak asasiDasar konstitusional KIP
2UU No. 14 Tahun 2008Keterbukaan Informasi PublikKewajiban badan publik menyediakan informasi; dasar hukum PPID
3PP No. 61 Tahun 2010Pelaksanaan UU KIPTata cara pengelolaan, penyimpanan, dan pendokumentasian informasi
4Perpres No. 95 Tahun 2018Sistem Pemerintahan Berbasis Elektronik (SPBE)Integrasi layanan digital pemerintah; website OPD sebagai kanal SPBE
5Perki No. 1 Tahun 2021Standar Layanan Informasi Publik (SLIP)Standar teknis penilaian E-Monev; basis seluruh pertanyaan SAQ
6Permendagri No. 3 Tahun 2017Pengelolaan PPID di Kemendagri dan PemdaStruktur PPID di OPD Pemerintah Daerah

UU No. 14 Tahun 2008 — Fondasi Utama

UU KIP mewajibkan setiap badan publik untuk:
1. Menyediakan dan mengumumkan informasi secara proaktif (tanpa harus diminta)
2. Memberikan informasi kepada pemohon secara cepat, tepat, dan biaya ringan
3. Membentuk dan mengangkat Pejabat Pengelola Informasi dan Dokumentasi (PPID)
4. Membuat dan memutakhirkan Daftar Informasi Publik (DIP) secara berkala

Catatan Perki 1/2021

Peraturan Komisi Informasi No. 1 Tahun 2021 adalah regulasi paling teknis yang langsung berdampak pada penilaian E-Monev. Perki ini mengatur standar layanan informasi publik secara rinci, termasuk format DIP, mekanisme permohonan, dan standar penanganan keberatan. Seluruh pertanyaan dalam SAQ E-Monev merujuk langsung pada Perki ini.

1.3 Tujuan Modul

Apa yang Akan Anda Bisa Lakukan Setelah Pelatihan Ini?

Modul ini dirancang berbasis pendekatan competency-based training — artinya setiap bagian memiliki target kompetensi yang terukur dan dapat langsung dipraktikkan di lingkungan kerja peserta.

Tujuan Umum

Setelah menyelesaikan pelatihan ini, peserta mampu mengelola website OPD secara mandiri menggunakan platform Satu CMS Kepri untuk mendukung pemenuhan kewajiban keterbukaan informasi publik sesuai peraturan yang berlaku.

Kompetensi yang Dicapai

NoSetelah pelatihan, peserta mampu...Modul Terkait
1Menjelaskan kewajiban OPD dalam KIP dan dasar hukumnyaBAB I
2Login dan mengakses panel admin Satu CMS KepriBAB II
3Mengatur identitas, tampilan, dan fitur dasar portal OPDBAB III
4Membuat dan mempublikasikan berita, pengumuman, dan artikelBAB IV
5Mengelola dokumen publik, halaman statis, dan galeriBAB IV
6Mengoperasikan modul SKM dan membaca laporan IKMBAB V
7Mengidentifikasi konten yang dibutuhkan untuk E-Monev KIBAB IV + V
8Melakukan pemeliharaan rutin website OPD secara mandiriBAB VI

Metodologi: Learning by Doing

Modul ini menggunakan pendekatan learning by doing — setiap bab dilengkapi dengan panduan langkah demi langkah (step-by-step) dan latihan mandiri. Peserta dianjurkan memiliki akses ke akun CMS OPD masing-masing selama pelatihan berlangsung.

1.4 Peran Admin Web OPD

ASN sebagai Garda Terdepan Keterbukaan Informasi

Admin Website OPD adalah ASN yang diberi tugas dan wewenang untuk mengelola konten website resmi instansinya. Dalam struktur PPID, admin website berperan sebagai Petugas Pelayanan Informasi — yang memastikan informasi publik tersedia, akurat, dan dapat diakses masyarakat kapan saja.

Tanggung Jawab Utama

  • Keakuratan informasi — memastikan konten yang dipublikasikan benar, relevan, dan tidak menyesatkan
  • Ketepatan waktu — memperbarui informasi sesuai jadwal (laporan keuangan setiap awal tahun, program kegiatan setiap semester, dll.)
  • Kelengkapan dokumen — memastikan seluruh dokumen yang diwajibkan oleh regulasi tersedia dan dapat diunduh publik
  • Keamanan akun — menjaga kerahasiaan kredensial login dan tidak berbagi akses tanpa otorisasi

Admin Web dalam Ekosistem PPID

Admin website bukan bekerja sendiri. Ia adalah bagian dari ekosistem PPID yang melibatkan:

PeranTanggung Jawab
Atasan PPID (Kepala OPD)Menetapkan kebijakan dan memberikan persetujuan
PPID UtamaMengoordinasikan seluruh pengelolaan informasi
PPID PelaksanaMengelola informasi di masing-masing bidang/seksi
Admin WebsiteMempublikasikan informasi yang sudah disetujui ke kanal digital

Tips Profesional

Buat kalender konten bulanan. Catat tanggal-tanggal penting — kapan harus upload laporan keuangan, kapan update program kegiatan, kapan refresh berita. Konsistensi lebih bernilai daripada konten yang sporadis.

II Mengenal Satu CMS Kepri

2.1 Konsep & Filosofi Platform

Satu Ekosistem, Banyak Portal — Mengapa Ini Berbeda?

Analogi: "Satu Mal, Banyak Toko"

Bayangkan sebuah mal modern. Ratusan toko beroperasi di dalamnya — masing-masing dengan identitas, produk, dan tampilannya sendiri. Namun semuanya berbagi infrastruktur yang sama: gedung, listrik, sistem keamanan, dan manajemen mal. Pengunjung bisa bergerak bebas dari satu toko ke toko lainnya dalam satu ekosistem terintegrasi.

Inilah konsep Satu CMS Kepri. Platform ini adalah "mal digital" Pemprov Kepri, di mana:

  • Setiap OPD memiliki portal websitenya sendiri (toko) dengan identitas, logo, dan kontennya yang khas
  • Semua portal berbagi infrastruktur yang sama — server, sistem keamanan, fitur standar
  • Ada satu pintu masuk (admin panel) yang bisa diakses oleh pengelola di masing-masing OPD
  • Diskominfo bertindak sebagai pengelola mal — menyediakan infrastruktur, standar, dan dukungan teknis

Filosofi Dasar Platform

PrinsipPenjelasan
TerpaduSatu platform untuk semua OPD — konsistensi standar, mudah dimonitor
MandiriSetiap OPD mengelola kontennya sendiri tanpa perlu vendor IT khusus
TerstandarFitur yang tersedia sesuai kebutuhan KIP dan E-Monev
TerintegrasiTerhubung dengan PPID, SKM, dan layanan Pemprov lainnya
BerkelanjutanDidukung dan dipelihara oleh Diskominfo — tidak bergantung pada vendor eksternal

Sebelum platform ini hadir, OPD di Kepri mengelola website masing-masing secara mandiri — dengan vendor yang berbeda-beda, standar yang tidak seragam, dan biaya pemeliharaan yang bervariasi. Banyak website tidak diperbarui karena vendor tidak responsif, kontrak habis, atau tidak ada anggaran pemeliharaan. Satu CMS Kepri hadir untuk memutus siklus masalah ini dengan menyediakan satu platform terpusat yang dikelola secara profesional oleh Diskominfo.

2.2 Manfaat vs Website Mandiri

Mengapa Beralih ke Satu CMS Kepri?

Pertanyaan yang sering muncul: "Kenapa tidak pakai WordPress saja? Atau buat website sendiri?" Tabel berikut menjawabnya secara objektif.

AspekWebsite Mandiri (Lama)Satu CMS Kepri
Biaya AwalTinggi — perlu pengadaan vendorGratis — difasilitasi Diskominfo
Biaya PemeliharaanTergantung kontrak vendorDitanggung Pemprov
KeamananBergantung pada kapabilitas vendorDikelola tim IT Diskominfo
Pembaruan KontenTergantung akses vendorLangsung oleh admin OPD
Standar KIPTidak selalu sesuai E-MonevDirancang khusus untuk E-Monev
Integrasi PPIDPerlu pengembangan khususSudah built-in
Dukungan TeknisBerbayar, respon lambatHelpdesk Diskominfo
KesinambunganRentan putus saat kontrak habisTerjamin sepanjang digunakan
Domain ResmiPerlu beli dan kelola sendiriSubdomain kepriprov.go.id
Update FiturBerbayarOtomatis dari Diskominfo

Keunggulan Utama

Satu CMS Kepri adalah satu-satunya platform yang fitur-fiturnya dirancang langsung mengacu pada indikator penilaian E-Monev Komisi Informasi. Artinya, jika Anda menggunakan semua fiturnya dengan optimal, separuh pekerjaan persiapan E-Monev sudah selesai.

2.3 Struktur Fitur

Apa Saja yang Bisa Dilakukan di Satu CMS Kepri?

Platform Satu CMS Kepri terdiri dari tiga lapisan fitur utama yang saling mendukung:

Lapisan 1 — Portal Web OPD (Tampilan publik yang dilihat masyarakat)

FiturFungsi
Halaman BerandaTampilan utama portal — banner, berita terkini, pengumuman, sambutan pimpinan
Profil OPDVisi-misi, sejarah, struktur organisasi, tupoksi
Berita & ArtikelPublikasi kegiatan, informasi layanan, program terkini
PengumumanPemberitahuan resmi dengan masa tayang otomatis
GaleriFoto dan video kegiatan OPD
Menu NavigasiSusunan menu yang dapat dikustomisasi sesuai kebutuhan

Lapisan 2 — Kustomisasi & Identitas (Pengaturan tampilan dan identitas OPD)

FiturFungsi
Identitas PortalNama OPD, alamat, kontak, media sosial, embed Google Maps
Tampilan VisualUpload logo, favicon, warna tema (kode HEX)
Sambutan PimpinanFoto Kepala Dinas + teks sambutan resmi
Banner SliderGambar slider beranda, drag-drop urutan
AksesibilitasGoogle Translate, widget difabel (tuna netra, tuna rungu)
Fitur Aktif/NonaktifNyalakan/matikan fitur sesuai kebutuhan OPD

Lapisan 3 — Layanan Terintegrasi (Fitur interaktif dan konektivitas layanan publik)

FiturFungsiIndikator E-Monev
Modul PPIDDaftar Informasi Publik, permohonan online, register pemohon, keberatan onlineC, D, F
Dokumen PublikRepositori dokumen terklasifikasi (keuangan, pengadaan, regulasi, dll.)A, B
Halaman StatisKonten tetap: profil PPID, SOP, maklumat pelayananD
SKM (Survei Kepuasan)Formulir survei + laporan IKM otomatis
Helpdesk ITSistem tiket dukungan teknis ke Diskominfo

Diagram Arsitektur Fitur

SATU CMS KEPRI
├── Portal Web OPD (Tampilan Publik)
│   ├── Beranda + Banner
│   ├── Berita & Artikel
│   ├── Pengumuman
│   ├── Galeri Foto & Video
│   └── Menu Navigasi
│
├── Panel Admin (Pengelola OPD)
│   ├── Pengaturan Identitas
│   ├── Manajemen Konten
│   └── Pengaturan Fitur
│
└── Layanan Terintegrasi
    ├── Modul PPID
    ├── Dokumen Publik
    ├── Halaman Statis
    └── SKM & Helpdesk

Pemahaman atas struktur fitur ini penting sebelum masuk ke praktik operasional. Pada bab-bab berikutnya, setiap fitur akan dijelaskan secara rinci beserta langkah-langkah penggunaannya. Yang perlu diingat: tidak semua fitur harus digunakan sekaligus. Mulailah dari fitur dasar, pastikan konten-konten wajib E-Monev terpenuhi, baru kemudian kembangkan ke fitur-fitur lanjutan.

2.4 Cara Login (Email & SSO Google)

Akses Panel Admin Satu CMS Kepri

Informasi Akun

Akun CMS diberikan oleh Diskominfo melalui koordinator DIGI-GO. Setiap peserta magang mendapatkan satu akun admin dengan hak akses penuh ke portal praktik masing-masing. Gunakan akun sesuai nomor peserta Anda.

Daftar Akun Praktik

NoNama AdminEmail LoginPasswordSubdomain Web Praktik
1Admin Magang 01magang01@digi.go12345678magang-01.kepri.web.id
2Admin Magang 02magang02@digi.go12345678magang-02.kepri.web.id
3Admin Magang 03magang03@digi.go12345678magang-03.kepri.web.id
4Admin Magang 04magang04@digi.go12345678magang-04.kepri.web.id
5Admin Magang 05magang05@digi.go12345678magang-05.kepri.web.id
6Admin Magang 06magang06@digi.go12345678magang-06.kepri.web.id
7Admin Magang 07magang07@digi.go12345678magang-07.kepri.web.id
8Admin Magang 08magang08@digi.go12345678magang-08.kepri.web.id
9Admin Magang 09magang09@digi.go12345678magang-09.kepri.web.id
10Admin Magang 10magang10@digi.go12345678magang-10.kepri.web.id

Catatan Password

Semua akun menggunakan password awal yang sama: 12345678. Segera ganti password setelah login pertama melalui menu Profil → Keamanan.

Login dengan Email

  1. Buka halaman login CMS di https://cms.kepriprov.go.id
  2. Masukkan email dan password yang diberikan
  3. Klik tombol Masuk
  4. Jika login berhasil, Anda akan diarahkan ke halaman Dashboard

Login dengan Google (SSO)

  1. Pada halaman login, klik tombol Login dengan Google
  2. Pilih akun Google Anda (gunakan email resmi OPD)
  3. Berikan izin akses jika diminta
  4. Anda akan otomatis masuk ke Dashboard

Keamanan Akun

Jangan bagikan password dengan siapa pun. Gunakan password yang kuat (minimal 8 karakter, kombinasi huruf, angka, dan simbol). Selalu Logout setelah selesai menggunakan CMS, terutama di komputer bersama. Jika lupa password, gunakan fitur Lupa Password di halaman login.

III Pengaturan Dasar Portal

Apa itu Pengaturan Portal?

Menu Pengaturan → Pengaturan Portal (URL: /sys/portal/settings) digunakan untuk mengelola identitas, tampilan visual, sambutan pimpinan, dan fitur tambahan website OPD Anda. Halaman ini terdiri dari 4 tab: Umum, Tampilan, Sambutan, dan Fitur.

Tab 1 — Umum (Informasi Dasar & Kontak)

Tab ini mengatur informasi dasar identitas portal yang memengaruhi tampilan judul browser (title tag), SEO Google, serta informasi kontak di footer website.

Informasi Portal

FieldPenjelasan & Contoh
Judul Portal *Judul utama yang muncul di tab browser dan hasil pencarian Google. Contoh: Dinas Komunikasi dan Informatika Provinsi Kepulauan Riau
Sub Judul *Tagline singkat portal. Contoh: Website Resmi Diskominfo Kepri
Deskripsi *Deskripsi singkat instansi untuk keperluan meta description SEO. Ringkas, informatif, dan mengandung kata kunci relevan (maksimal 160 karakter disarankan).

Informasi Kontak

Data ini muncul di halaman kontak dan footer website. Seluruh field berikut tersedia:

Nama Instansi

Nama resmi instansi (wajib).

Nama Pendek

Singkatan nama instansi.

Telepon / Fax

Nomor telepon dan fax resmi.

Email / WhatsApp

Email aktif dan nomor WA layanan.

Website

Alamat situs resmi instansi.

Alamat Lengkap

Alamat fisik kantor secara detail.

Peta & Media Sosial

  • URL Embed Google Maps — Masukkan kode iframe atau tautan embed dari Google Maps lokasi kantor Anda.
  • Profil Media Sosial — Isi tautan ke akun resmi: Facebook, Instagram, Twitter/X, YouTube, TikTok. Pastikan setiap URL diawali https://.
Tab Umum Pengaturan Portal
Gambar: Tampilan Tab Umum — identitas portal, kontak, peta, dan media sosial

Tab 2 — Tampilan (Branding & Warna)

Tab ini mengatur identitas visual: logo, ikon browser, palet warna tema, dan footer.

Aset Branding

  • Ikon Browser (Favicon)

    Unggah gambar kecil — direkomendasikan 32×32 piksel format PNG — yang muncul di tab browser.

  • Logo Navbar

    Unggah logo utama instansi. Direkomendasikan format PNG transparan. Logo ini tampil di header (pojok kiri atas) website.

  • Tipe Logo Navbar

    Pilih Hanya Logo atau Logo + Teks. Jika memilih Logo + Teks, isi kolom Teks Utama dan Teks Pendamping (contoh: "Provinsi Kepulauan Riau").

Warna Tema & Footer

  • Warna Tema

    6 kode warna HEX yang dapat disesuaikan: Primary, Secondary, Success, Info, Warning, Danger. Sesuaikan dengan identitas korporat instansi Anda. Klik color picker atau masukkan kode HEX langsung (contoh: #1E40AF).

  • Konfigurasi Footer

    Atur Judul Footer dan Deskripsi Footer yang tampil di area terbawah setiap halaman website.

Tab Tampilan — Branding dan Warna
Gambar: Tampilan Tab Tampilan — upload logo, favicon, palet warna HEX, dan footer

Tab 3 — Sambutan (Kepala Dinas)

Tab ini mengelola konten Sambutan Kepala Dinas yang tampil di halaman beranda (homepage). Fitur ini memberikan sentuhan personal dan memperkuat citra kepemimpinan.

A. Nama Kepala *

Nama lengkap beserta gelar. Contoh: Dr. H. Ahmad Syahrial, M.Si

B. Foto Kepala

Unggah foto resmi dengan rasio proporsional. Disarankan latar belakang bersih, format JPG/PNG, resolusi minimal 400×600 piksel.

C. Foto Background

Gambar landscape untuk latar belakang area sambutan. Rasio lebar disarankan 16:9.

D. Kata Sambutan *

Tulis pesan sambutan yang profesional, singkat, dan jelas. Idealnya 2-4 paragraf yang mencakup: ucapan selamat datang, visi singkat, dan ajakan berpartisipasi.

Tab Sambutan Kepala Dinas
Gambar: Tampilan Tab Sambutan — nama, foto, background, dan teks sambutan

Tab 4 — Fitur (Toggle & Aksesibilitas)

Tab ini mengontrol fitur-fitur opsional yang dapat diaktifkan/dinonaktifkan pada portal publik.

Banner Popup

Menampilkan popup pengumuman (overlay) saat pengunjung pertama kali membuka website. Anda perlu mengunggah Gambar Popup dan mengisi Tautan Popup (opsional — mengarahkan pengunjung ke halaman tertentu saat gambar diklik). Cocok untuk pengumuman mendesak atau event penting.

Google Translate

Menambahkan widget terjemahan otomatis di website. Pengunjung dapat memilih bahasa tujuan melalui dropdown yang muncul di halaman. Berguna untuk wisatawan asing dan investor internasional yang mengakses informasi OPD.

Widget Aksesibilitas

Mengaktifkan alat bantu disabilitas di website publik: text-to-speech (pembaca teks otomatis), mode kontras tinggi, dan penyesuaian ukuran teks. Anda dapat memilih Suara Pemandu (Wanita atau Pria) untuk fitur text-to-speech. Fitur ini penting untuk kepatuhan terhadap standar aksesibilitas dan inklusivitas layanan publik.

Tab Fitur — Toggle Banner, Translate, Aksesibilitas
Gambar: Tampilan Tab Fitur — toggle Banner Popup, Google Translate, dan Widget Aksesibilitas

Menyimpan Perubahan

  1. Periksa kembali seluruh isian dan file gambar di setiap tab.
  2. Klik tombol Simpan Perubahan di bagian bawah layar.
  3. Gunakan tombol Lihat Web untuk membuka portal publik di tab baru dan melihat hasil perubahan.

Perubahan Belum Terlihat?

Jika logo, ikon, atau warna baru belum muncul di website publik, bersihkan cache browser dengan menekan Ctrl+F5 (Windows) atau Cmd+Shift+R (Mac).

IV Pengelolaan Konten

4.1 Menu Navigasi Dinamis

Fitur Menu Navigasi (diakses melalui Pengaturan Portal → Menu Navigasi) digunakan untuk mengelola struktur tautan dan navigasi pada website OPD. Anda dapat menambah, mengubah urutan, dan mengatur visibilitas menu tanpa menyentuh kode.

1. Menambah Menu Baru

  1. Login ke panel admin CMS.
  2. Buka Pengaturan Portal → Menu Navigasi.
  3. Klik tombol Tambah Menu Baru (ikon +).
  4. Isi formulir yang muncul (lihat penjelasan di bawah).
Daftar Menu Navigasi
Gambar: Halaman daftar Menu Navigasi — drag & drop untuk mengatur urutan

2. Mengisi Formulir Menu

FieldPenjelasan
Judul *Teks yang ditampilkan di navigasi. Gunakan istilah jelas: Profil, Struktur Organisasi, Berita.
Menu IndukTentukan posisi dalam hierarki. Pilih Root (Tingkat Atas) untuk menu utama di navbar. Pilih menu lain untuk menjadikannya sub-menu (dropdown).
Tipe *Jenis tautan: Halaman — memilih langsung dari daftar halaman statis yang sudah ada di CMS; URL — memasukkan tautan manual (internal maupun eksternal).
ReferensiMuncul berdasarkan pilihan Tipe. Jika Tipe = Halaman, dropdown akan menampilkan seluruh halaman statis yang tersedia — pilih langsung tanpa perlu menyalin URL. Jika Tipe = URL, masukkan tautan secara manual (contoh: /profil/sejarah untuk internal, https://sirup.lkpp.go.id untuk eksternal).
Target_self — buka di tab yang sama (disarankan untuk internal). _blank — buka di tab baru (disarankan untuk eksternal).
Status AktifToggle switch: Aktif = menu tampil di website. Nonaktif = menu disembunyikan sementara tanpa menghapus data.
Formulir Menu Navigasi
Gambar: Dialog tambah/edit menu — field Tipe dan Referensi memudahkan pemilihan halaman tanpa perlu menyalin URL

3. Mengatur Urutan (Drag & Drop)

  • Temukan ikon pegangan (titik-titik vertikal/grip) di sebelah kiri judul menu pada halaman daftar.
  • Klik, tahan, lalu geser (drag) menu ke atas atau bawah sesuai urutan yang diinginkan, kemudian lepaskan (drop).
  • Perubahan urutan diterapkan secara otomatis di tampilan website publik.

Catatan: Menu Induk & Sub-Menu

Jika Anda memindahkan sebuah Menu Induk (drag & drop), seluruh sub-menu yang terikat di bawahnya akan otomatis ikut berpindah ke posisi baru. Ini memastikan struktur dropdown tetap utuh.

4.2 Rich Text Editor

Di Mana Editor Ini Digunakan?

Editor teks berbasis TipTap (ProseMirror) digunakan di seluruh modul CMS: Berita, Pengumuman, Agenda, Halaman Statis, Layanan Publik, dan Konten PPID. Semua tempat yang membutuhkan penulisan konten panjang menggunakan editor yang sama.

Toolbar Rich Text Editor TipTap
Gambar: Toolbar Rich Text Editor — seluruh tombol pemformatan

Toolbar: Setiap Tombol Dijelaskan

GrupIkonTombolFungsi & Shortcut
Teks DasarBBoldMenebalkan teks. Ctrl+B
IItalicMemiringkan teks. Ctrl+I
UUnderlineGaris bawah. Ctrl+U
StrikethroughTeks tercoret untuk menunjukkan revisi atau koreksi.
Clear FormattingMenghapus semua format dari teks terpilih. Berguna setelah copy-paste dari Word/website lain.
Heading & ParagrafH1Heading 1Judul utama. Gunakan hanya satu H1 per konten.
H2Heading 2Sub-judul untuk membagi konten menjadi bagian logis.
H3Heading 3Sub-sub-judul untuk detail lebih dalam.
ParagraphTeks normal (body text). Default saat mengetik.
"BlockquoteKutipan — teks dengan indentasi dan garis kiri.
AlignmentAlign LeftRata kiri (default).
Align CenterRata tengah.
Align RightRata kanan.
Align JustifyRata kiri-kanan. Tampilan rapi seperti koran.
Daftar (List)Bullet ListDaftar dengan bullet point untuk item tidak berurutan.
1.Ordered ListDaftar bernomor untuk langkah-langkah atau urutan.
Indent / OutdentMenaikkan/menurunkan level indentasi untuk sub-list bertingkat.
Media & Objek🖼Insert ImageMenyisipkan gambar. Klik ikon → pilih file (JPG, PNG, WebP) → gambar diunggah dan tampil di editor.
📎Insert File/PDFMelampirkan file dokumen (PDF, DOCX, XLSX) sebagai link unduhan.
Embed VideoMenyematkan video YouTube. Tempel URL → otomatis menjadi video player.
Tabel & TautanInsert TableMembuat tabel data. Pilih jumlah baris × kolom. Sel mendukung semua format teks.
🔗Insert LinkHyperlink pada teks. Pilih teks → klik ikon → masukkan URL. Ctrl+K
UnlinkMenghapus hyperlink tanpa menghapus teksnya.
Fitur Lanjutan</>Source CodeLihat/edit HTML mentah. Untuk pengguna mahir yang ingin kontrol penuh atas markup.
FullscreenEditor layar penuh. Tekan Esc untuk keluar.
UndoBatalkan perubahan. Ctrl+Z
RedoUlangi perubahan yang dibatalkan. Ctrl+Y

Praktik Terbaik Menulis Konten

Gunakan Heading untuk Struktur

Bagi konten panjang dengan H2 dan H3. Jangan gunakan bold besar sebagai pengganti heading — ini menyulitkan pembaca dan mesin pencari (SEO).

Hindari Copy-Paste dari Word

Microsoft Word menyisipkan banyak markup HTML tidak terlihat yang merusak tampilan. Jika terpaksa, gunakan Clear Formatting setelah paste, lalu format ulang di editor.

Optimalkan Gambar Sebelum Upload

Kompres gambar ke ukuran yang wajar (maksimal 500KB per gambar) sebelum diunggah. Gambar terlalu besar memperlambat loading halaman.

Gunakan Tabel untuk Data, Bukan Layout

Tabel di editor ditujukan untuk data terstruktur (seperti jadwal, daftar harga, perbandingan). Jangan gunakan tabel untuk mengatur tata letak halaman.

Tips: Preview Sebelum Publish

Setelah selesai menulis, selalu klik Preview (jika tersedia) atau simpan sebagai Draft terlebih dahulu, lalu lihat tampilannya di halaman publik sebelum menerbitkan. Pastikan semua gambar muncul, link berfungsi, dan format teks sesuai yang diharapkan.

4.3 Pustaka Tabel

Apa itu Pustaka Tabel?

Modul Pustaka → Pustaka Tabel (route: /sys/portal/tables) digunakan untuk membuat, mengelola, dan menyematkan tabel data terstruktur ke dalam halaman statis atau konten berita. Modul ini mendukung impor data dari file Excel/CSV, pengeditan sel secara langsung, dan ekspor data.

1. Halaman Daftar Pustaka Tabel

Halaman ini menampilkan seluruh tabel yang telah dibuat. Anda dapat mencari, membuat baru, atau mengelola tabel yang sudah ada.

Halaman Daftar Pustaka Tabel
Gambar: Halaman daftar Pustaka Tabel — dengan fitur pencarian, filter, dan kolom aksi

Fitur pada Halaman Daftar:

Pencarian Judul

Cari tabel berdasarkan nama/judul yang telah diberikan.

Tombol + Tabel Baru

Membuat tabel data baru dari awal.

Edit / Hapus

Kolom aksi untuk mengubah struktur/data tabel atau menghapusnya.

Embed / Copy ID

Mendapatkan kode semat (embed code) untuk menampilkan tabel di halaman konten.

2. Membuat & Mengedit Tabel

Klik Tambah Baru untuk membuka editor tabel. Anda dapat membuat struktur tabel (kolom dan baris) lalu mengisi data.

Editor Pustaka Tabel
Gambar: Tampilan editor Pustaka Tabel — pengaturan kolom, impor data, dan grid editor

Struktur Tabel:

FieldPenjelasan
Judul Tabel *Nama tabel untuk identifikasi di daftar. Contoh: "Data Realisasi Anggaran 2024".
DeskripsiPenjelasan singkat tentang isi dan tujuan tabel (opsional).
Kolom (Columns)Definisikan setiap kolom: Nama Kolom (header) dan Tipe Data (teks, angka, tanggal). Anda dapat menambah, menghapus, atau mengubah urutan kolom.
Baris (Rows)Data aktual dalam tabel. Setiap sel dapat diisi langsung di grid editor. Gunakan + Tambah Baris untuk menambah baris baru.

3. Impor Data dari CSV / Excel

Fitur ini memungkinkan Anda mengimpor data dalam jumlah besar tanpa harus mengetik manual satu per satu. Sangat berguna untuk data statistik, laporan keuangan, atau data kependudukan yang sudah ada dalam bentuk spreadsheet.

Langkah Impor:

  1. Pada halaman editor tabel, klik tombol Impor CSV (atau Import).
  2. Pilih file dari komputer Anda. Format yang didukung: .csv (Comma-Separated Values) dan .xlsx (Microsoft Excel).
  3. Sistem akan membaca file dan menampilkan pratinjau (preview) data yang akan diimpor. Periksa apakah kolom sudah sesuai.
  4. Jika ada ketidakcocokan kolom, Anda dapat menyesuaikan pemetaan (mapping) kolom di langkah ini.
  5. Klik Konfirmasi Impor. Data akan dimasukkan ke dalam tabel.

Persiapan File CSV/Excel

Pastikan baris pertama file berisi nama kolom (header). Data harus rapi — tidak ada baris kosong di tengah, tidak ada sel yang digabung (merged cells). Simpan spreadsheet dalam format CSV UTF-8 agar karakter khusus (seperti tanda baca Indonesia) tidak rusak. Untuk file Excel (.xlsx), gunakan sheet pertama (Sheet1).

4. Menyematkan Tabel ke Konten (Embed)

Setelah tabel dibuat, Anda dapat menyematkannya ke dalam Halaman Statis atau Berita menggunakan fitur Table Selector.

Cara Embed:

  1. Buka editor konten (Halaman Statis atau Berita) — editor Rich Text (TipTap).
  2. Pada toolbar editor, cari dan klik tombol Insert Table from Pustaka (ikon tabel dengan database).
  3. Sebuah dialog akan muncul menampilkan daftar tabel yang telah Anda buat di Pustaka Tabel.
  4. Pilih tabel yang ingin disematkan, lalu klik Sisipkan.
  5. Editor akan menyisipkan shortcode atau placeholder tabel. Saat konten dipublikasikan, placeholder ini akan diganti dengan tabel data interaktif yang dapat di-sort dan di-search oleh pengunjung.

Keunggulan Embed vs Tabel Manual

Tabel dari Pustaka Tabel bersifat dinamis — jika Anda memperbarui data di Pustaka Tabel, perubahan otomatis tercermin di semua halaman yang menyematkan tabel tersebut. Ini jauh lebih efisien daripada mengedit tabel satu per satu di setiap halaman. Selain itu, tabel Pustaka mendukung pencarian, pengurutan (sort), dan paginasi yang tidak tersedia pada tabel statis biasa.

5. Ekspor Data

Data di Pustaka Tabel dapat diekspor untuk keperluan pelaporan atau analisis lebih lanjut:

  • Ekspor CSV — Format teks universal yang dapat dibuka di Excel, Google Sheets, atau aplikasi spreadsheet lainnya.
  • Ekspor Excel (.xlsx) — Format asli Microsoft Excel dengan styling dasar.
  • Copy ke Clipboard — Salin seluruh data tabel untuk ditempelkan (paste) ke aplikasi lain.

Tombol ekspor tersedia di halaman editor masing-masing tabel.

4.4 Modul Berita & Artikel

Route: /sys/portal/{opsi}/news

Modul Konten → Berita digunakan untuk membuat dan mengelola berita, artikel, dan siaran pers yang akan tampil di halaman depan portal OPD.

1. Halaman Daftar Berita

Halaman Daftar Berita
Gambar: Daftar berita — dengan filter, pencarian, dan status publish/draft
Pencarian & Filter

Cari berita berdasarkan judul, filter berdasarkan status (Publish/Draft) dan kategori.

Status Badge

Publish — terlihat publik. Draft — hanya admin.

Headline

Tandai berita sebagai headline agar tampil di posisi utama halaman depan. Lihat bagian 5.

Created By

Setiap berita mencatat penulis. Admin dapat mengisi nama penulis secara manual. Lihat bagian 6.

2. Membuat / Mengedit Berita

Form Berita
Gambar: Form pembuatan/edit berita — isi konten, thumbnail, kategori, dan pengaturan publikasi
FieldPenjelasan
Judul *Judul berita. Usahakan singkat, jelas, dan informatif. Maksimal 120 karakter untuk SEO.
Slug *URL halaman berita. Otomatis dari judul (dapat diubah). Format: /berita/judul-berita
Ringkasan / ExcerptTeks pendek (1-2 kalimat) yang tampil di daftar berita halaman depan. Jika tidak diisi, sistem mengambil paragraf pertama konten.
ThumbnailGambar utama berita. Ukuran ideal: 1200×630px (rasio 1.91:1 untuk sosial media). Format: JPG, PNG, WebP. Ukuran file maksimal 1MB.
Kategori *Kategori berita untuk pengelompokan. Lihat bagian 3.
Konten *Isi berita menggunakan Rich Text Editor (TipTap). Gunakan Heading untuk sub-judul, sisipkan gambar dan video sesuai kebutuhan.
Tanggal PublikasiTanggal dan waktu berita diterbitkan. Dapat diisi mundur untuk berita lama atau maju untuk menjadwalkan publikasi.
StatusPublish — berita langsung tampil di portal. Draft — simpan tanpa menampilkan.
Penulis (Created By)Nama penulis berita. Dapat diisi manual atau otomatis dari akun yang login. Lihat bagian 6.

3. Kategori Berita

Kategori Berita
Gambar: Manajemen kategori berita — tambah, edit, hapus kategori

Kategori mengelompokkan berita berdasarkan tema. Setiap kategori punya nama dan slug. Jangan pakai nama modul lain sebagai kategori — "Pengumuman", "Agenda", "Layanan" adalah modul terpisah, bukan kategori berita. Kategori berita khusus untuk mengelompokkan artikel/berita di dalam modul Berita saja.

Kategori ≠ Modul

Pengumuman, Agenda, Dokumen, Galeri, dan Layanan adalah modul tersendiri di CMS. Jangan membuat kategori berita dengan nama yang sama — ini membingungkan admin lain dan membuat konten tumpang tindih.

Contoh Kategori Berita — 5 Instansi Peserta Bimtek

Berikut rekomendasi kategori berita berdasarkan instansi peserta Bimbingan Teknis CMS Kepri. 3–5 kategori sudah cukup. Sesuaikan dengan kebutuhan konten masing-masing.

InstansiRekomendasi Kategori
Dinas Kelautan dan Perikanan Berita UtamaProgram & KebijakanKegiatan & EventPotensi KelautanSosialisasi & EdukasiStatistik & Data PerikananInformasi Pelabuhan & TPIKerjasama & Kemitraan
RSUD Raja Ahmad Tabib Berita UtamaLayanan KesehatanKegiatan RSPromosi KesehatanInfo PasienInovasi & PenelitianSumber Daya ManusiaKerjasama & Kemitraan
Dinas Pendidikan Berita UtamaProgram & KebijakanKegiatan & EventPrestasi & InovasiInformasi SekolahLiterasi & PerpustakaanData & Statistik PendidikanKerjasama & Kemitraan
Badan Pengembangan SDM Berita UtamaDiklat & PelatihanPengembangan KompetensiKegiatan & EventInformasi KepegawaianInovasi PembelajaranLaporan KinerjaKerjasama & Kemitraan
Biro Kesejahteraan Rakyat Berita UtamaProgram & KebijakanKegiatan & EventLaporan & KoordinasiInformasi PublikData & StatistikLayanan MasyarakatKerjasama Lintas Daerah

Tips Kategori

5–8 kategori cukup untuk mencakup jenis konten OPD. Pilih yang paling relevan — tidak harus pakai semua. Nama kategori harus jelas dan berbeda dari nama modul CMS lain. Jika ragu, mulai dengan "Berita Utama" dulu, tambah kategori lain setelah konten bertambah.

4. Headline Berita

Pengaturan Headline Berita
Gambar: Pengaturan headline — pilih berita yang akan ditampilkan di posisi utama

Headline adalah berita yang ditampilkan di posisi paling atas atau paling menonjol di halaman depan portal. Anda dapat menandai beberapa berita sebagai headline. Urutan headline biasanya berdasarkan tanggal publikasi terbaru, namun dapat diatur melalui pengaturan Portal → Fitur.

5. Penulis Berita (Created By)

Pengaturan Penulis Berita
Gambar: Pengisian nama penulis — dapat diisi manual atau otomatis

Setiap berita dapat menampilkan nama penulisnya. Nama penulis dapat diisi secara manual di form berita, atau diambil otomatis dari nama akun admin yang login. Fitur ini berguna ketika beberapa staf berkontribusi menulis konten dan perlu dicatat siapa penulisnya.

6. Praktik Terbaik Menulis Berita

Judul Informatif, Bukan Clickbait

Judul harus mencerminkan isi berita secara akurat. Contoh baik: "Bupati Resmikan Pasar Rakyat Pulau Tujuh". Contoh buruk: "Anda Tidak Akan Percaya Apa yang Terjadi di Pasar!"

Gunakan Piramida Terbalik

Informasi terpenting di awal (5W+1H), detail pendukung di tengah, informasi tambahan di akhir. Pembaca online cenderung membaca paragraf pertama saja.

Sisipkan Gambar Relevan

Setiap berita sebaiknya memiliki minimal 1 gambar yang relevan dengan isi. Gambar membuat berita lebih menarik dan meningkatkan engagement.

Gunakan Sub-Heading

Pecah berita panjang dengan Heading 2 dan Heading 3. Ini memudahkan pembaca melakukan scanning dan lebih SEO-friendly.

Hak Cipta Gambar

Pastikan gambar yang diunggah bukan milik orang lain tanpa izin. Gunakan foto dokumentasi OPD sendiri atau gambar dari sumber bebas lisensi. Jangan mengambil gambar dari Google Images atau website berita lain tanpa izin.

4.5 Pengumuman Resmi

Route: /sys/portal/{opsi}/announcements

Modul Konten → Pengumuman digunakan untuk membuat pengumuman resmi OPD. Berbeda dengan berita, pengumuman memiliki tanggal mulai dan tanggal selesai (masa berlaku) serta dapat dikategorikan berdasarkan prioritas.

1. Halaman Daftar Pengumuman

Halaman Daftar Pengumuman
Gambar: Daftar pengumuman — dengan status, masa berlaku, dan prioritas

Daftar menampilkan seluruh pengumuman. Yang membedakan dari daftar berita: setiap pengumuman memiliki tanggal mulai dan tanggal selesai (masa berlaku). Pengumuman yang sudah melewati tanggal selesai otomatis tidak tampil di portal publik, meskipun statusnya Publish.

2. Membuat / Mengedit Pengumuman

Form Pengumuman
Gambar: Form pengumuman — dengan pengaturan tanggal berlaku dan prioritas
FieldPenjelasan
Judul *Judul pengumuman. Singkat dan jelas, misalnya: "Pengumuman Seleksi PPPK Tahap II".
Slug *URL otomatis dari judul. Dapat diubah manual.
RingkasanDeskripsi singkat pengumuman (1-2 kalimat).
Konten *Isi lengkap pengumuman menggunakan Rich Text Editor.
LampiranUnggah file lampiran (PDF, DOC, XLS) yang menyertai pengumuman, misalnya surat resmi, formulir, atau daftar nama.
Tanggal Mulai *Tanggal pengumuman mulai berlaku dan tampil di portal.
Tanggal Selesai *Tanggal pengumuman berakhir. Setelah tanggal ini, pengumuman otomatis disembunyikan dari portal publik.
PrioritasTingkat kepentingan: Normal, Penting, Sangat Penting. Mempengaruhi tampilan pengumuman di portal (warna, posisi).
StatusPublish atau Draft. Pengumuman Publish tetap tunduk pada masa berlaku — tidak akan tampil di luar rentang tanggal mulai-selesai.

3. Perbedaan Pengumuman vs Berita

Meskipun tampak mirip, pengumuman dan berita memiliki kegunaan yang berbeda:

AspekBeritaPengumuman
Masa TayangPermanen (selalu tampil)Terbatas (ada tanggal selesai)
TujuanInformasi dan dokumentasi kegiatanPemberitahuan resmi dengan batas waktu
LampiranTidak utamaSering disertai lampiran (surat, formulir)
Contoh"Bupati Hadiri Pelantikan Pejabat""Pengumuman Hasil Seleksi CPNS 2024"

4.6 Agenda Kegiatan

Route: /sys/portal/{opsi}/events

Modul Konten → Agenda digunakan untuk membuat dan mengelola kalender kegiatan OPD. Agenda menampilkan jadwal kegiatan dengan tanggal, waktu, lokasi, dan status kegiatan.

1. Halaman Daftar Agenda

Halaman Daftar Agenda
Gambar: Daftar agenda — tampilan kalender dan list kegiatan

Daftar agenda menampilkan seluruh kegiatan yang telah dijadwalkan. Setiap entri menunjukkan tanggal kegiatan, waktu, lokasi, dan status (Terjadwal / Selesai). Anda dapat memfilter berdasarkan bulan atau status kegiatan.

2. Membuat / Mengedit Agenda

Form Agenda Kegiatan
Gambar: Form agenda kegiatan — pengisian tanggal, waktu, lokasi, dan konten
FieldPenjelasan
Judul *Nama kegiatan. Contoh: "Rapat Koordinasi Pembangunan Daerah".
Slug *URL otomatis. Dapat diubah manual.
Tanggal Mulai *Tanggal kegiatan dimulai.
Tanggal Selesai *Tanggal kegiatan berakhir. Untuk kegiatan satu hari, isi tanggal yang sama.
Waktu MulaiJam mulai kegiatan (format 24 jam). Contoh: 08:00.
Waktu SelesaiJam selesai kegiatan.
Lokasi *Tempat kegiatan. Contoh: "Ruang Rapat Utama Lt. 3".
KontenDeskripsi kegiatan, susunan acara, peserta, dan informasi lain menggunakan Rich Text Editor.
ThumbnailGambar untuk agenda (opsional).
StatusTerjadwal — kegiatan belum berlangsung. Selesai — kegiatan telah berlangsung. Status dapat diubah manual.

3. Tips Pengelolaan Agenda

Isi Lokasi dengan Spesifik

Cantumkan nama ruangan dan alamat lengkap. "Ruang Rapat Utama Lt. 3, Kantor Bupati" lebih baik daripada sekadar "Kantor".

Update Status Secara Berkala

Setelah kegiatan selesai, ubah status menjadi "Selesai". Ini membantu pengunjung membedakan agenda yang sudah dan belum berlangsung.

Gunakan Konten untuk Detail

Tambahkan susunan acara, daftar peserta, atau link materi di bagian konten. Ini membuat halaman agenda lebih informatif.

Kegiatan Multi-Hari

Untuk kegiatan yang berlangsung beberapa hari, isi tanggal mulai dan selesai yang berbeda. Sistem akan menampilkan rentang tanggal.

4.7 Repositori Dokumen Publik

Route: /sys/portal/{opsi}/documents

Modul Konten → Dokumen digunakan untuk mengunggah dan mengelola dokumen publik seperti laporan tahunan, peraturan, SK, panduan, formulir, dan dokumen resmi lainnya yang dapat diunduh oleh pengunjung portal.

1. Halaman Daftar Dokumen

Halaman Daftar Dokumen
Gambar: Daftar dokumen publik — dengan kategori, tipe file, dan jumlah unduh

Daftar menampilkan seluruh dokumen yang diunggah. Setiap entri menampilkan judul dokumen, kategori, tipe file (PDF, DOCX, XLSX), ukuran file, dan jumlah unduh oleh pengunjung.

2. Mengunggah / Mengedit Dokumen

Form Unggah Dokumen
Gambar: Form unggah/edit dokumen — pengisian metadata dan file
FieldPenjelasan
Judul *Nama dokumen. Contoh: "Laporan Kinerja Instansi Pemerintah (LKjIP) 2024".
Slug *URL otomatis dari judul.
DeskripsiRingkasan isi dokumen (opsional tetapi disarankan).
Kategori *Kategori dokumen. Lihat bagian 3.
File Dokumen *Unggah file dokumen. Format yang didukung: PDF, DOC, DOCX, XLS, XLSX, PPT, PPTX. Ukuran maksimal: 50MB.
Thumbnail / CoverGambar sampul dokumen (opsional). Berguna untuk katalog dokumen.
Tanggal DokumenTanggal dokumen diterbitkan (dapat berbeda dari tanggal unggah).
StatusPublish — dokumen dapat diunduh publik. Draft — hanya admin.

Optimalkan Nama File PDF

Beri nama file yang deskriptif sebelum mengunggah. Contoh: LKjIP-Dinkes-2024.pdf lebih baik daripada dokumen_final_rev3.pdf.

3. Kategori Dokumen

Daftar Kategori Dokumen
Gambar: Manajemen kategori dokumen
Form Kategori Dokumen
Gambar: Form tambah/edit kategori dokumen

Kategori membantu mengelompokkan dokumen agar mudah ditemukan. Setiap kategori memiliki nama dan slug. Di bawah ini 10 kategori yang direkomendasikan — disusun berdasarkan kebutuhan e-Monev KIP. ⚡ SAQ = item yang dinilai verifikator. Contoh menggunakan Dinas Pendidikan.

#Nama KategoriContoh Dokumen (Dinas Pendidikan)⚡ SAQ
1Laporan Kinerja & KeuanganLKjIP 2024, LRA 2024, Neraca 2024, Laporan Keuangan Audited (Opini BPK WTP), Ringkasan EksekutifA, B
2Program & KegiatanRencana Strategis 2024–2026, Rencana Kerja Tahunan 2025, DIPA Petikan 2025 (Rp 1.12T), RKA-KL 2025A, B
3Pengadaan Barang & JasaPer Paket Pengadaan: KAK, HPS, Spesifikasi Teknis, Gambar Rencana, Kontrak, SPMK, BAST, Berita Acara Serah Terima, dll. (33 jenis dokumen). Contoh: Paket RKB SMA 1 Tg. Pinang Rp 2.1M, Laptop Guru 250 unit Rp 850jtA, B
4Peraturan & KebijakanPergub Kepri No. 12/2024 (BOSDA), SE Kadis No. 5/2025 (PPDB Online), SK Kadis No. 8/2025 (Tim Kurikulum), Perda No. 3/2023 (Sistem Pendidikan Daerah)B
5Surat Perjanjian / MoUMoU dengan Universitas Maritim Raja Ali Haji (Kampus Mengajar), Kontrak Swakelola Pembangunan RKB, Surat Penugasan Tim Teknis PPDB, Daftar Kontrak 2025B
6PerizinanSK Izin Operasional SMA Islam Terpadu Bintan No. 421/088/2025, SK Izin SMK Kesehatan Batam No. 421/092/2025, Rekomendasi Teknis Pendirian SekolahB
7Putusan / Sengketa HukumPutusan PTUN Tg. Pinang No. 12/G/2025 (sengketa kepegawaian — dimenangkan OPD), Putusan Perdata terkait aset sekolahA, B
8SOP & Standar Layanan4 SOP: (1) Permohonan Informasi, (2) Uji Konsekuensi, (3) Penyusunan DIP, (4) Pendokumentasian. Masing-masing PDF bertanda tangan Kadis.D
9Profil PPID & KomitmenSK Penetapan PPID No. 10/2025, Maklumat Pelayanan (bertanda tangan Kadis), Struktur PPID, Surat Tugas PPIDD
10Formulir & TemplateFormulir Permohonan Informasi, Formulir Pengaduan, Formulir Keberatan, Template LHKPN, Template LHKSNC, F

Tips: Buat 10 Kategori Ini Dulu

Buka Konten → Dokumen → Kategori. Buat 10 kategori di atas — copy-paste nama kategori dari tabel. Setelah semua kategori tersedia, baru upload dokumen satu per satu ke kategori yang sesuai. Dengan 10 kategori ini, Anda sudah mencakup mayoritas dokumen yang dinilai SAQ e-Monev.

FieldPenjelasan
Nama Kategori *Nama kategori, contoh: "Laporan Kinerja".
SlugURL path kategori. Otomatis dari nama.
DeskripsiPenjelasan singkat tentang kategori (opsional).

4. Tips Pengelolaan Dokumen

Gunakan Format PDF

Konversi dokumen ke PDF sebelum diunggah. PDF memastikan tampilan dokumen konsisten di semua perangkat dan tidak mudah diubah.

Beri Metadata Lengkap

Isi judul, deskripsi, dan tanggal dengan benar. Ini membantu pengunjung memahami isi dokumen sebelum mengunduh.

Periksa Ukuran File

Kompres PDF jika melebihi 10MB. File terlalu besar memberatkan pengunjung dengan koneksi lambat. Gunakan tool online seperti SmallPDF atau ILovePDF.

Perbarui Dokumen Secara Berkala

Pastikan dokumen yang ditampilkan adalah versi terbaru. Hapus atau arsipkan dokumen versi lama.

4.8 Halaman Statis

Route: /sys/portal/{opsi}/pages

Modul Konten → Halaman Statis digunakan untuk membuat halaman mandiri seperti "Profil OPD", "Visi & Misi", "Struktur Organisasi", "Tupoksi", dan halaman informasi lainnya yang bukan berita.

1. Halaman Daftar

Halaman Daftar Halaman Statis
Gambar: Daftar halaman statis — dengan pencarian, filter, dan status publish/draft

Daftar menampilkan seluruh halaman statis yang telah dibuat. Setiap baris menampilkan judul halaman, slug URL, status (publish/draft), dan tanggal pembaruan terakhir. Anda dapat mengedit atau menghapus halaman melalui kolom aksi.

2. Membuat / Mengedit Halaman Statis

Form Halaman Statis
Gambar: Form pembuatan/edit halaman statis — dengan Rich Text Editor
FieldPenjelasan
Judul *Judul halaman yang tampil di browser tab dan heading utama.
Slug *URL path halaman. Otomatis dari judul, dapat diubah manual. Contoh: /halaman/profil-opd
StatusPilih Publish untuk menampilkan halaman ke publik, atau Draft untuk menyimpan tanpa menampilkan.
Konten *Isi halaman menggunakan Rich Text Editor (TipTap). Mendukung teks format, gambar, tabel, video, dan embed Pustaka Tabel.
Tanggal PublikasiTanggal halaman diterbitkan. Dapat diatur mundur (backdate) atau maju (jadwalkan).

3. Tips Pengelolaan

Gunakan Slug Deskriptif

Contoh slug yang baik: /halaman/visi-dan-misi. Hindari slug terlalu panjang atau mengandung karakter khusus.

Simpan Draft untuk Revisi

Gunakan status Draft saat halaman masih dalam proses penulisan. Halaman draft hanya bisa dilihat oleh admin yang login.

Embed Pustaka Tabel

Untuk menampilkan data terstruktur (seperti daftar pegawai, data anggaran), gunakan fitur embed Pustaka Tabel di Rich Text Editor.

Gunakan Heading Bertingkat

Struktur konten dengan H2 dan H3 yang logis. Ini memudahkan pembaca dan juga baik untuk SEO.

4.9 Galeri Foto & Video

Route: /sys/portal/{opsi}/galleries

Modul Konten → Galeri digunakan untuk membuat album foto dan video kegiatan. Galeri menampilkan koleksi gambar dalam bentuk grid atau slider yang dapat dinikmati pengunjung portal.

1. Halaman Daftar Galeri

Halaman Daftar Galeri
Gambar: Daftar galeri — daftar album foto/video dengan thumbnail

Daftar menampilkan seluruh album galeri yang telah dibuat. Setiap album menampilkan judul, jumlah foto, dan tanggal pembuatan. Anda dapat membuka album untuk mengelola foto di dalamnya.

2. Membuat / Mengedit Album Galeri

Form Galeri
Gambar: Form pembuatan album galeri — upload foto, judul, dan metadata
FieldPenjelasan
Judul Album *Nama album galeri. Contoh: "Kunjungan Kerja ke Pulau Penyengat".
Slug *URL otomatis dari judul.
DeskripsiDeskripsi singkat isi album (opsional tetapi disarankan).
Tanggal KegiatanTanggal kegiatan yang didokumentasikan dalam album.
Thumbnail / CoverGambar sampul album. Gunakan foto terbaik sebagai cover.
Foto GaleriUnggah satu atau beberapa foto sekaligus. Format: JPG, PNG, WebP. Ukuran maksimal per foto: 5MB. Foto akan ditampilkan dalam grid di halaman galeri.
StatusPublish — album tampil di portal. Draft — hanya admin.

Upload Banyak Foto Sekaligus

Anda dapat memilih beberapa file foto sekaligus (multi-select) saat mengunggah. Gunakan Ctrl+Klik (Windows) atau Cmd+Klik (Mac) untuk memilih beberapa file di dialog file browser.

3. Mengelola Foto dalam Album

Setelah album dibuat, Anda dapat:

  • Menambah foto baru ke album yang sudah ada.
  • Menghapus foto individual dari album.
  • Mengubah urutan foto dengan drag & drop (jika didukung).
  • Memberi judul/keterangan pada setiap foto (caption).

4. Tips Galeri

Kompres Foto Sebelum Upload

Foto dari kamera modern bisa berukuran >5MB. Kompres dulu ke ukuran sekitar 500KB-1MB per foto menggunakan tool seperti TinyPNG atau ShortPixel.

Pilih Foto Berkualitas

Hanya unggah foto yang tajam, tidak blur, dan pencahayaannya baik. Foto buram mengurangi kredibilitas portal.

Beri Judul pada Setiap Foto

Judul/keterangan foto membantu pengunjung memahami konteks. Siapa yang ada di foto? Kegiatan apa?

Gunakan Video Embed

Untuk konten video, unggah ke YouTube terlebih dahulu, lalu embed di galeri atau konten berita. Tidak disarankan mengunggah file video langsung (ukuran besar).

4.10 Banner Slider

Fitur Banner Slider (diakses melalui Pengaturan Portal → Banner Slider) digunakan untuk mengelola gambar berjalan (slider) yang tampil di halaman depan (beranda) portal OPD.

Langkah 1: Mengakses Menu Banner

Login ke Admin OPD, lalu navigasikan ke Pengaturan Portal → Banner Slider. Anda akan melihat daftar banner yang sudah ada (jika ada).

Daftar Banner Slider
Gambar: Halaman daftar Banner Slider

Langkah 2: Menambah/Mengubah Banner

Klik Tambah Banner untuk membuat baru, atau klik Edit pada banner yang sudah ada.

Form Tambah Banner
Gambar: Formulir tambah/edit Banner Slider
FieldPenjelasan
Gambar Banner *Unggah gambar untuk slider. Disarankan rasio 4:1 (contoh: 1600×400 piksel). Maksimal ukuran file 20MB. Format yang didukung: JPG, PNG, WebP.
JudulTeks utama yang tampil pada banner. Contoh: "Selamat Datang di Dinas Pendidikan".
SubjudulTeks deskripsi singkat di bawah judul utama banner.
Tombol Link / TautanURL tujuan saat pengunjung mengklik banner (opsional). Harus format lengkap: https://...
Urutan (Order)Menentukan urutan tampil banner pada slider. Semakin kecil angka, semakin awal ditampilkan.
Status AktifToggle switch: aktifkan untuk menampilkan banner ke publik.

Langkah 3: Menyimpan

Setelah semua data dan gambar sesuai, klik Simpan. Sistem akan mengunggah gambar dan menerapkan banner pada halaman depan portal OPD.

Kualitas Gambar

Gunakan gambar berkualitas baik dengan resolusi yang disarankan (1600×400 piksel) agar tampilan beranda tetap tajam dan profesional di semua ukuran layar. Gambar yang terlalu kecil akan tampak pecah (pixelated) saat diregangkan oleh slider.

4.11 Layanan Publik

Route: /sys/portal/{opsi}/public-services

Modul Layanan → Layanan Publik digunakan untuk menampilkan informasi layanan publik OPD. Setiap layanan memiliki halaman detail sendiri dengan deskripsi, persyaratan, prosedur, biaya, dan waktu penyelesaian.

1. Halaman Daftar Layanan

Halaman Daftar Layanan Publik
Gambar: Daftar layanan publik — dengan ikon, deskripsi singkat, dan status

Daftar menampilkan seluruh layanan publik yang telah didaftarkan. Setiap entri menampilkan ikon layanan, judul, ringkasan, dan status. Pengunjung dapat mengklik layanan untuk melihat detail lengkap.

2. Membuat / Mengedit Layanan

Form Layanan Publik
Gambar: Form pembuatan/edit layanan publik — pengisian detail layanan
FieldPenjelasan
Nama Layanan *Nama layanan publik. Contoh: "Pembuatan KTP Elektronik" atau "Surat Izin Usaha Mikro".
Slug *URL otomatis dari nama layanan.
Ikon LayananGambar ikon yang mewakili layanan. Ukuran ideal: 200×200px. Format: PNG dengan background transparan.
Deskripsi Singkat *Ringkasan layanan (1-2 paragraf). Jelaskan secara singkat apa layanan ini dan untuk siapa.
PersyaratanDaftar persyaratan/dokumen yang harus dibawa pemohon. Gunakan bullet list agar mudah dibaca.
Prosedur / AlurLangkah-langkah mendapatkan layanan. Dapat berupa teks atau embed diagram/gambar.
BiayaInformasi biaya layanan. Tulis "Gratis" jika tidak dikenakan biaya, atau rincikan biaya jika ada.
Waktu PenyelesaianEstimasi waktu penyelesaian. Contoh: "3 hari kerja" atau "14 hari kerja".
Kontak / PetugasNama dan kontak petugas yang dapat dihubungi untuk informasi lebih lanjut (opsional).
StatusPublish — layanan tampil di portal. Draft — hanya admin.

3. Tips Layanan Publik

Tulis Persyaratan dengan Jelas

Gunakan bullet point untuk setiap persyaratan. Tulis spesifik: "Fotokopi KTP 2 lembar" bukan "fotokopi identitas".

Cantumkan Biaya dengan Transparan

Jika gratis, tulis "Tidak dikenakan biaya (Gratis)". Jika berbayar, rincikan dengan jelas dasar hukumnya (Perda/Perbup).

Update Informasi Secara Berkala

Persyaratan dan prosedur dapat berubah. Periksa dan perbarui informasi layanan minimal setiap 6 bulan.

Gunakan Bahasa Sederhana

Hindari jargon birokrasi yang sulit dipahami masyarakat umum. Gunakan bahasa Indonesia yang sederhana dan jelas.

4. Kategori Layanan

CMS mendukung pengelompokan layanan publik menggunakan kategori. Setiap layanan masuk ke dalam satu kategori. Pengunjung bisa memfilter layanan berdasarkan kategori di halaman depan portal.

Contoh Kategori Layanan — 5 Instansi Peserta Bimtek

Kategori layanan berbeda dengan kategori berita — ini khusus untuk mengelompokkan item di modul Layanan Publik. Pilih yang sesuai tupoksi OPD Anda.

Referensi Nyata: Dinas Pendidikan

Dinas Pendidikan Provinsi Kepri sudah mengimplementasikan kategori dan daftar layanan dengan baik. Lihat langsung di dinaspendidikan.kepriprov.go.id/layanan sebagai contoh halaman layanan publik yang sudah live.

InstansiRekomendasi KategoriContoh Item Layanan
Dinas Kelautan dan Perikanan Perizinan PerikananPengelolaan PesisirBantuan NelayanData & Informasi KelautanPembinaan Masyarakat PesisirKerjasama & KemitraanPengaduan SIUP perikanan, izin kapal < 30 GT, rekomendasi ruang laut, bantuan alat tangkap, statistik perikanan, pelatihan nelayan, kerjasama daerah, aduan destructive fishing
RSUD Raja Ahmad Tabib Rawat JalanRawat InapGawat DaruratPenunjang MedisFarmasiRekam MedisInformasi & Pengaduan Pendaftaran online, jadwal dokter, tarif kamar, IGD 24 jam, resep online, hasil lab & radiologi, visum, mutu layanan
Dinas Pendidikan Layanan Peserta DidikPerizinan & AkreditasiBantuan & BeasiswaData & Informasi PendidikanPembinaan Guru & TendikKerjasama & KemitraanPengaduan Pindah sekolah, izin pendirian, proposal BOS, Dapodik, sertifikasi guru, magang industri — sudah live di dinaspendidikan.kepriprov.go.id/layanan
Badan Pengembangan SDM Diklat & SertifikasiPengembangan KarierAdministrasi KepegawaianData & Informasi KepegawaianPenjaminan MutuKerjasama & KemitraanInformasi & Pengaduan Pendaftaran diklat, uji kompetensi, kenaikan pangkat, konsultasi karier ASN, akreditasi lembaga, MoU diklat
Biro Kesejahteraan Rakyat Data & InformasiRekomendasi TeknisKoordinasi Lintas SektorPembinaan KeagamaanPenanganan Bencana SosialPelaporan & MonitoringPengaduan Data kesejahteraan, rekomendasi bansos, koordinasi program keagamaan, haji/umroh, tanggap bencana, laporan KUB

Tips Kategori Layanan

5–8 kategori cukup untuk mencakup jenis layanan OPD. Pilih yang paling relevan dengan tupoksi — tidak harus pakai semua. Setiap kategori bisa berisi 1–5 item layanan. Jika satu kategori hanya 1 item, pertimbangkan gabung dengan kategori lain yang sejenis.

V Layanan Terintegrasi

5.1 Survei Kepuasan Masyarakat (SKM)

Route: /sys/skm/*

Modul SKM (Survei Kepuasan Masyarakat) adalah sistem survei terintegrasi untuk mengukur kepuasan pengguna layanan publik. Modul ini mencakup pengaturan periode survei, pembuatan kuesioner, pengumpulan respons responden, dan pelaporan hasil survei.

1. Periode Survei

Halaman Periode SKM
Gambar: Manajemen periode survei SKM — buat, edit, dan atur periode aktif

Periode menentukan rentang waktu berlangsungnya survei. Setiap periode memiliki tanggal mulai dan tanggal selesai. Hanya periode yang sedang aktif yang dapat menerima respons dari pengunjung.

FieldPenjelasan
Nama Periode *Nama periode, contoh: "SKM Semester 1 2025".
Tanggal Mulai *Tanggal survei mulai menerima respons.
Tanggal Selesai *Tanggal survei berakhir. Setelah tanggal ini, pengunjung tidak dapat mengisi survei.
StatusAktif — periode sedang berjalan. Hanya satu periode yang dapat aktif dalam satu waktu.

2. Kuesioner / Pertanyaan

Halaman Kuesioner SKM
Gambar: Manajemen pertanyaan kuesioner — tambah, edit, urutkan, dan atur tipe pertanyaan

Kuesioner adalah daftar pertanyaan yang akan dijawab oleh responden. Anda dapat membuat berbagai tipe pertanyaan dan mengatur urutannya.

FieldPenjelasan
Pertanyaan *Teks pertanyaan yang akan diajukan kepada responden.
Tipe PertanyaanJenis jawaban: Skala 1-4 (Sangat Tidak Puas s/d Sangat Puas), Pilihan Ganda, Isian Singkat, Uraian (esai/saran).
Wajib DiisiTandai jika pertanyaan ini tidak boleh dilewatkan responden.
UrutanNomor urut pertanyaan. Dapat diatur ulang dengan drag & drop.

Standar PermenPAN-RB

Sesuai PermenPAN-RB No. 14 Tahun 2017, survei SKM memiliki 9 unsur standar: persyaratan, prosedur, waktu penyelesaian, biaya/tarif, produk layanan, kompetensi petugas, perilaku petugas, sarana prasarana, dan penanganan pengaduan. Susun kuesioner Anda mencakup 9 unsur ini.

3. Data Responden

Halaman Data Responden SKM
Gambar: Data responden SKM — daftar pengisi survei dan jawaban mereka

Halaman ini menampilkan seluruh responden yang telah mengisi survei. Setiap entri menampilkan nama responden, tanggal pengisian, dan jenis layanan yang dinilai. Anda dapat melihat detail jawaban setiap responden.

Filter Data

Filter responden berdasarkan periode, tanggal, atau jenis layanan.

Ekspor Data

Ekspor data responden ke format Excel (.xlsx) untuk analisis lebih lanjut.

4. Laporan Hasil Survei

Halaman Laporan SKM
Gambar: Laporan hasil SKM — grafik IKM dan rekap per unsur

Laporan SKM menyajikan hasil survei dalam bentuk grafik dan tabel. Fitur yang tersedia:

  • Nilai IKM (Indeks Kepuasan Masyarakat) — nilai gabungan seluruh unsur.
  • Grafik per Unsur — nilai setiap unsur layanan (dari 9 unsur standar).
  • Rekapitulasi Responden — jumlah responden per periode, per jenis kelamin, per pendidikan, dll.
  • Kesimpulan dan Rekomendasi — analisis otomatis berdasarkan hasil survei.
  • Cetak / Unduh Laporan — ekspor laporan dalam format PDF.

5.2 PPID (Pejabat Pengelola Informasi dan Dokumentasi) Coming Soon

Fitur Mendatang

Modul PPID masih dalam tahap pengembangan. Fitur ini akan memungkinkan Admin OPD untuk mengelola informasi publik secara terstruktur sesuai amanat UU No. 14 Tahun 2008 tentang Keterbukaan Informasi Publik — meliputi daftar informasi publik, informasi berkala, informasi serta-merta, dan informasi dikecualikan. Kami akan menginformasikan lebih lanjut setelah fitur resmi dirilis.

VI Penutup

6.1 Penutup

Akhir dari Perjalanan, Awal dari Pengelolaan Mandiri

Demikian modul Operasional CMS Kepri — Program DIGI-GO Internship 2026 ini disusun. Seluruh materi — dari konsep dasar Satu CMS Kepri, pengaturan portal, pengelolaan konten, layanan terintegrasi, hingga praktik terbaik penulisan — telah dirancang untuk membekali setiap Admin OPD dengan kompetensi teknis yang dibutuhkan dalam mengelola website instansi masing-masing.

Pengelolaan website OPD bukanlah sekadar tugas administratif, melainkan wujud nyata komitmen pemerintah daerah dalam mewujudkan keterbukaan informasi publik sebagaimana diamanatkan oleh Undang-Undang Nomor 14 Tahun 2008. Setiap konten yang diterbitkan, setiap data yang diperbarui, dan setiap layanan yang dihadirkan melalui portal OPD adalah jembatan antara pemerintah dan masyarakat Kepulauan Riau menuju tata kelola pemerintahan yang transparan, partisipatif, dan akuntabel.

Kami berharap modul ini tidak hanya menjadi referensi selama pelatihan, tetapi juga menjadi pegangan kerja sehari-hari yang dapat dibuka kembali kapan pun dibutuhkan. Teruslah belajar, bereksplorasi, dan jangan ragu untuk mencoba fitur-fitur baru yang tersedia di platform Satu CMS Kepri.

Butuh Bantuan Teknis?

Jika Anda mengalami kendala teknis di luar materi pelatihan ini, silakan hubungi langsung:

0812-6195-4231
(Agam Yusliman — Tenaga Ahli Programmer)