`

1

Bu k u Ma n u a l Web Si t e SKPD 2016

Pem er in t a h Ka bu pa t en Ma l a n g

Situs web Satuan Kerja Perangkat Daerah Pemerintah Kabupaten Malang didesain

untuk bisa dirubah atau diupdate secara mudah menggunakan content management

system yang telah disiapkan. Dokumen ini merupakan petunjuk/acuan bagaimana

cara melakukan maintenance pada situs web Satuan Kerja Perangkat Daerah

Pemerintah Kabupaten Malang.

A. Sekilas Struktur Halaman Web

Situs web Satuan Kerja Perangkat Daerah Pemerintah Kabupaten Malang berfungsi

sebagai sarana untuk menginformasikan profil, program dan event yang ada di

Satuan Kerja Perangkat Daerah. Untuk melakukan fungsi ini, desain halaman situs

dibuat simple dengan fungsi yang maksimal, contoh sebagai berikut:

`

2

Setruktur Tampilan Depan Website SKPD

Header Website Navigasi Menu

Slide Show

Banner

Info Beranda

Berita

Footer Website

Preview Galeri

Tombol Pengaduan

Lokasi Kantor

`

3

B. Mengganti Konten Halaman

Hampir seluruh bagian halaman situs bisa diedit melalui halaman administrator.

Untuk bisa melakukan ini, anda harus memiliki hak atau memiliki salah satu otoritas

sebagai operator, editor, atau administrator. Untuk menuju ke halaman

administrator, tuliskan alamat berikut di address bar dari browser.

http://alamatsitus/admin-namaSKPD

(misal http:// namaSKPD.malangkab.go.id/admin- namaSKPD)

Layar browser akan menampilkan form untuk login, seperti gambar berikut.

Bila berhasil, anda akan berada di halaman administrator, seperti gambar berikut.

Masukkan username dan password yang telah anda terima, lalu tekan Enter atau

klik Login.

“Untuk Username dan Password jika anda lupa silahkan Hubungi PDE(only operator

SKPD)”

`

4

B.1 Mengganti Data Spesifik Situs

Yang pertama kali perlu dilakukan adalah mengganti data utama dari situs SKPD

yaitu nama, alamat, email, teks pada header dan footer. Untuk melakukan ini, pilih

Lihat/Ubah Data Situs pada bagian Data Menu & Halaman.

Data Umum: berisi identitas situs. Edit isian nama unit, alamat dan yang

lainnya pada kotak input yang disediakan. Akhiri langkah ini dengan klik tombol

Simpan.

Admin online: berisi identitas mail yahoo untuk fasilitas chating (masukkan id

user yahoo mail saja tanpa domain misal: bejo bukan bejo@yahoo.com). Akhiri

langkah ini dengan klik tombol Simpan.

B.2. Mengedit dan Membuat Halaman Baru

Yang berikutnya setelah data spesifik situs diedit, adalah mengedit halaman atau

membuat halaman baru. Untuk melakukan ini, pilih Lihat/Ubah Isi Halaman kemudian

pilih link yang sesuai.

Untuk mengedit sebuah halaman , klik link Edit Halaman, di sebelah kanan judul

halaman yang akan diedit. Anda akan masuk ke halaman editor. Anda bisa mengedit

judul, kemudian konten halaman. Editor konten halaman merupakan rich text editor

sehingga bisa digunakan untuk mengatur tampilan font, memasukkan gambar/foto,

atau menampung konten dari program Microsoft Word, misalnya (melalui fasilitas

Copy – Paste).

`

5

Secara umum, penggunaannya sama dengan aplikasi pengolah kata yang umum

(ex: Microsoft Office). Anda bisa melakukan teks formatting atau paragraph

formatting melalui toolbar yang ada di bagian atas editor.

Untuk memaksimalkan ukuran editor (atau mengembalikan ke ukuran

semula)

Klik tombol

Untuk memasukkan gambar / foto:

1. Posisikan kursor pada tempat dimana foto akan ditempatkan.

2. Klik ikon pada toolbar. Akan terlihat kotak dialog seperti gambar berikut

3. Klik pada tab Upload, sehingga tampilan kotak dialog menjadi seperti gambar

berikut.

9

`

6

4. Klik tombol Browse, lalu tunjuk file foto yang akan dimasukkan, klik Open. Akhiri dengan klik pada tombol Send it to the Server.

12

8

`

7

5. Bila diperlukan, tentukan ukuran lebar dan tinggi foto (dalam pixel), pada isian

Width dan Height, jarak dari foto ke teks (HSpace dan VSpace), dan posisi foto

(Align).

6. Klik OK untuk menutup kotak dialog dan menempatkan foto ke editor. Klik

Simpan di bagian bawah halaman untuk menyimpan halaman tersebut.

B.2.2 Membuat Halaman Baru

Untuk membuat halaman baru, klik link Tambah Halaman Baru, kemudian

masukkan judul, dan konten halaman yang diinginkan. Seperti saat mengedit isi

halaman, editor konten halaman juga merupakan rich text editor sehingga bisa

digunakan untuk mengatur tampilan font, memasukkan gambar/foto.

Catatan: Agar halaman yang baru dibuat ini bisa tampil, pastikan membuat menu

(lihat bahasan di bawah) yang menunjuk ke halaman tersebut.

B.3 Membuat / Mengedit Menu Navigasi (pulldown)

Setelah halaman dibuat, yang berikutnya adalah memastikan halaman tersebut bisa

tampil melalui menu atau submenu navigasi (di bagian atas halaman). Untuk

mengedit menu navigasi ini, klik link Lihat/Ubah Menu Navigasi Atas.

B.3.1 Mengedit Menu atau Submenu untuk halaman

Setelah link Lihat/Ubah Menu Navigasi Atas dipilih, akan terlihat daftar menu (dan

submenu) yang ada sekarang.

Pada gambar di atas, setiap item menu memiliki kode yang unik. Sebuah sub menu

memiliki kode awal yang sama dengan kode menu di atasnya. Untuk mengedit

sebuah menu, klik link [Edit] di sebelah kanan menu.

`

8

Anda bisa mengedit teks menu (yang akan terlihat pada menu atau sub menu di

bagian atas halaman), menjadikan menu tersebut main atau sub menu (opsi Level

dan Punya sub menu), atau menyembunyikan dan menampilkan (opsi Aktif?).

Bagian Link digunakan untuk menentukan halaman apa yang akan ditampilkan (bila

menu tersebut dipilih)

B.3.2 Menambahkan Submenu baru

Untuk bisa menambahkan sub menu baru, klik link Tambah Sub menu baru.

Pilih pada menu utama yang mana sub menu tersebut akan ditempatkan, ketikkan

teks Sub Menu, dan pilih Link yang sesuai (yaitu judul halaman yang sudah

dibuat/disiapkan sebelumnya).

Catatan: anda tidak bisa membuat menu utama baru. Jumlah menu utama adalah

10. Pada awalnya yang ditampilkan hanya 9. Satu menu disembunyikan

(Cadangan). Tampilkan menu Cadangan dan ganti teksnya sesuai kebutuhan, bila

diperlukan.

B.4 Mengedit Data Umum

Data umum yang dimaksud di sini adalah data berita, galleri foto, buku tamu dan

polling.

13

3

8

14

8

`

9

B.4.1 Mengedit Berita atau menambahkan Berita baru

Untuk mengedit berita, klik link Lihat/Ubah Berita di halaman depan Administrator.

Setelah daftar berita terlihat, klik Ubah di kanan berita yang akan diedit. Lakukan

editing seperti halnya anda mengedit isi/konten halaman.

Catatan:

Pengantar berita adalah bagian berita yang terlihat saat berita tersebut ditampilkan bersama berita lainnya (misal pada box berita terkini di sebelah kiri halaman), dan dibatasi maksimal 255 karakter.

Detail berita adalah konten berita yang lengkap (lanjutan dari pengantar berita). Editor untuk berita ini sama dengan editor untuk konten halaman (lihat halaman 4).

Untuk menambahkan berita baru, klik link Tambah berita baru di halaman depan

Administrator. Lakukan entry berita seperti saat anda mengedit berita.

B.4.2 Mengedit Pengaduan / Buku tamu

Untuk mengedit buku tamu, klik link Lihat/Ubah Buku tamu di halaman depan

Administrator.

15

8

16

`

10

Setelah daftar isian buku tamu terlihat, klik Edit di kanan isian yang akan diedit, atau

klik Del (hapus) untuk menghapus item buku tamu.

Yang perlu dicatat disini adalah, anda bisa memberikan jawaban/komentar pada

pesan yang disampaikan, melalui kotak teks Tanggapan.

B.4.3 Mengedit Galeri Foto

Galeri foto berisi kumpulan foto yang dikelompokkan berdasarkan kategori-kategori

yang telah ditetapkan sebelumnya. Anda bisa mengedit kategori foto, dan mengedit

foto-foto yang ada pada masing-masing kategori.

Untuk mengedit galleri foto, klik link Lihat / Edit Galeri Foto pada halaman depan

Administrator.

17 18

`

11

Mengedit Kategori Foto

Anda bisa merubah nama kategori yang sudah ada, menghapus, atau

menambahkan kategori baru. Untuk melakukan ini, klik link:

[Edit Kategori] di kanan nama kategori untuk mengedit kategori tersebut

Ketikkan nama kategori yang baru pada kotak teks yang ada, lalu klik Change

Category Name.

[Hapus Kategori] di kanan nama kategori untuk menghapus kategori

tersebut

[Buat Kategori baru] di bagian atas daftar kategori untuk membuat kategori

baru

Mengedit Foto pada masing-masing kategori

Anda bisa menghapus, menambahkan foto, atau mengatur posisi foto untuk setiap

kategori. Untuk melakukan ini, klik link: Edit foto -> yang ada di sebelah kanan baris

kategori.

Untuk menambahkan foto, klik tombol Browse (Telusuri) pada bagian atas

halaman, pilih file foto yang telah disiapkan, berikan keterangan foto

seperlunya, lalu klik Upload.

19 20

`

12

Untuk menghapus foto yang sudah ada, klik tombol Hapus (di bawah Update

Info).

Untuk mengganti posisi (urutan) foto klik tombol Naik atau Turun seperlunya.

Mengedit Konfigurasi umum galeri foto

Anda bisa merubah beberapa seting dasar dari galeri foto, seperti jumlah kolom

tampilan foto, ukuran thumbnail/foto, ukuran maksimal file foto yang bisa diupload,

dan lain-lain. Untuk melakukan ini, klik link Atur Konfigurasi.

Klik link Home untuk kembali ke halaman depan administrasi galleri foto.

`

13

B.4.4 Mengedit Data Polling

Polling atau jajak pendapat ditampilkan di kolom kiri halaman. Untuk merubah data

polling ini, pilih link Lihat / Edit Polling di halaman depan Administrator.

Anda bisa mengedit teks pertanyaan, item jawaban, dan nilai pilihan dari masing-

masing jawaban.

B.5 Mengedit Data Download

Data Download yang dimaksud di sini adalah data kategori file yang bisa

didownload, dan data file-file yang bisa didownload.

B.5.1 Mengedit Kategori file

Untuk mengedit kategori file, klik link Lihat/Ubah Kategori File di halaman depan

Administrator. Setelah daftar kategori file terlihat, klik Edit di kanan nama kategori

yang akan diedit. Lakukan editing seperti halnya saat anda mengedit menu navigasi.

Catatan: Pastikan anda telah membuat sampai kategori level dua (Sub kategori 1) untuk memastikan nama kategori ini tampil di halaman download.

21

`

14

Membuat Kategori Baru

Untuk membuat kategori baru, klik link Entry Kategori File pada halaman depan

Administrator. Masukkan kode, level, kategori dan sub kategori 1 (minimal).

Catatan: Pastikan kode yang digunakan merupakan kombinasi kode kategori level

atasnya plus dua angka baru untuk memastikan nama kategori ini tampil di halaman

download. Misal anda memiliki kategori Artikel dengan kode 01, untuk membuat

kategori Sosial Budaya yang berada di bawah Artikel, anda bisa menggunakan kode

0101, atau 0102, dst. Level diisi angka 1 (untuk kategori utama), 2 (untuk sub

kategori 1), 3 (untuk sub kategori 2).

B.5.2 Mengedit file data (yang didownload)

Untuk mengedit file data, klik link Lihat/Ubah File Data di halaman depan

Administrator.

Setelah daftar kategori file terlihat, klik [Edit] di kanan nama file yang akan diedit.

Catatan:

Kategori harus minimal kategori level 2 (sub kategori 1) agar bisa tampil di halaman

download

File Gambar digunakan hanya untuk file image, yaitu untuk menampilkan ukuran

kecil (thumb) dari file image yang akan didownload.

Menambahkan File Baru

Untuk menambahkan file baru, klik link Entry File Data pada halaman depan

Administrator.

23

25 26

`

15

Pilih kategori (harus minimal level 2/sub kategori 1), nama atau deskripsi singkat dari

file, pilih file gambar (hanya untuk jenis file image, dan tidak harus diisi), dan pilih

file data yang akan diupload.

B.6 Mengedit Data Operator

Operator yang dimaksud di sini adalah orang yang melakukan proses update data /

maintenance situs. Berdasarkan haknya, operator dibedakan menjadi 3 macam:

administrator, editor, dan operator. Operator: memiliki hak untuk edit berita, galleri, buku

tamu, isi halaman & upload file, Editor: memiliki hak untuk edit berita, buku tamu & upload

file. Anda sebagai Administrator bisa menambahkan atau mengedit operator.

B.6.1 Mengedit Operator

Untuk mengedit data operator, klik link Lihat/Ubah Operator dii halaman depan

Administrator. Setelah daftar operator terlihat, klik [Edit] di kanan nama operator

yang akan diedit. Lakukan editing dengan cara yang sama seperti sebelumnya.

Catatan: bila seorang operator lupa password yang dimiliki, administrator hanya bisa

memberikan password baru, dengan mengganti password yang lama dengan yang

baru.

`

16

B.6.2 Menambahkan Operator Baru

Untuk mengedit data operator, klik link Tambah Operator di halaman depan

Administrator. Lakukan entry data operator dengan cara yang sama seperti

sebelumnya.

Catatan: Kode akan terisi dengan otomatis, memang tidak perlu diisi.

`

17

MENAMBAHKAN HALAMAN SAKIP BESERTA TABELNYA

1. Untuk menambahkan SAKIP tentunya harus ada menu SAKIP di halaman utama.

2. Langkah selanjutnya masuk ke Backend atau halaman administrator dan menuju ke

Lihat/Ubah Isi Halaman

*Cek apa halaman sakip sudah dibuatkan atau belum, jika belum tambah halaman baru

beri nama SAKIP 2XXX.

`

18

2.Jika sudah masuk ke halaman SAKIP yang telah dibuat tadi pilih tombol source biasanya

di sebelah kiri atas

3.ketikan script berikut ini :

<p>&nbsp;</p>

<h3 style="text-align: center;">DOKUMEN SAKIP<br />

BAGIAN PENGELOLA DATA ELEKTRONIK PEMERINTAH<br />

table border="1" cellspacing="1" cellpadding="0" width="100%" style="width:100.0%;border:solid windowtext

1.0pt;">

<tbody>

<tr>

<td style="border:solid windowtext 1.0pt;&#10; padding:.75pt .75pt .75pt .75pt">

<div align="center" style="margin-bottom: 0.0001pt;"><b><span style="font-size:12.0pt;Arial"

new="">NO</span></b></div>

</td>

<td style="border:solid windowtext 1.0pt;&#10; padding:.75pt .75pt .75pt .75pt">

<div align="center" style="margin-bottom: 0.0001pt;"><b><span style="font-size:12.0pt;Arial"

new="">DOKUMEN</span></b></div>

</td>

<td style="border:solid windowtext 1.0pt;&#10; padding:.75pt .75pt .75pt .75pt">

<div align="center" style="margin-bottom: 0.0001pt;"><b><span style="font-size:12.0pt;Arial"

new="">FILE</span></b></div>

</td>

<td style="border:solid windowtext 1.0pt;&#10; padding:.75pt .75pt .75pt .75pt">

<div align="center" style="margin-bottom: 0.0001pt;"><b><span style="font-size:12.0pt;Arial"

new="">KESESUAIAN</span></b></div>

</td>

</tr>

<tr>

<td style="border:solid windowtext 1.0pt;&#10; padding:.75pt .75pt .75pt .75pt">................

Tapi paling mudah anda bisa download file Script tabel Sakip di

http://bag-pde.malangkab.go.id/downloads/script%20tabel%20SAKIP.txt

atau di website bag-pde.malangkab.go.id > download > tutorial > eBook > Script Tabel Sakip

dan paste di menu source tadi

`

19

Tekan menu Source lagi maka akan terlihat Tabel yang sudah jadi

4.Untuk memasang tautan di text UNDUHAN anda harus mengunggah dulu file di download (lihat halaman 13).

`

20

5. Jika sudah terupload silahkan menuju halaman depan di menu DOWNLOAD > cari file yang akan ditautkan

> arahkan di download > klik kanan > copy link address

6. Kembali ke halaman skip di ruang administrator seleksi tulisan download

7. Jika benar text anda akan berubah warna, jika selesai semuanya silahkan simpan.