manual book penggunaan cms website sma negeri 3 cibinong ... filewebsite dengan alamat url ......

Manual Book Penggunaan CMS Website

SMA Negeri 3 Cibinong

(Untuk Administrator)

M a n u a l B o o k C M S S M A N 3 C i b i n o n g W e b s i t e

Page 1

Penjelasan Umum

CMS (Content Management System) merupakan fasilitas yang disediakan untuk mempermudah

pengelolaan data/konten website. Setelah melakukan login melalui form yang tampil pada halaman

website dengan alamat url http://sman3cibinong.sch.id/index.php/login , Anda akan di arahkan secara

otomatis ke halaman Administrator. Pada halaman Administrator inilah pengelolaan data dilakukan,

cara serta langkah - langkahnya akan dipaparkan melalui bahasan berikut ini :

1. Login

Sebelum memasuki halaman Administrator, Anda diharuskan melakukan login terlebih dahulu. Untuk

melakukannya, ikuti langkah berikut :

o Buka aplikasi browser yang ada pada komputer Anda Contohnya : Firefox, Internet Explorer,

Opera, Google Chrome, Safari, dll.

o Ketikkan alamat url http://sman3cibinong.sch.id/index.php/login pada address bar.

Gambar URL yang diketikkan pada address bar aplikasi browser.

o Tekan tombol Enter, maka form login untuk mengakses halaman Administrator akan tampil.

Setelah tampil form login, isikan admin pada kotak isian username dan 12345 pada kotak isian

password. (username dan password tersebut bersifat sementara, Anda bisa merubahnya di menu

Pengguna yang ada pada halaman Administrator).

Gambar tampilan form login untuk mengakses halaman Administrator

http://sman3cibinong.sch.id/index.php/login

http://sman3cibinong.sch.id/index.php/


Page 2

o Jika tidak ada kesalahan pada username / password yang Anda isikan pada form login, maka

secara otomatis Anda akan diarahkan ke halaman Administrator. Berikut tampilan dan sedikit

penjelasan dari setiap bagian tampilannya.

*cat: Ketika Anda selesai mengupdate data/website dan keluar dari aplikasi tanpa logout,

kemudian akan masuk kembali dalam waktu yang cukup lama atau dihari yang berbeda secara

otomatis sistem akan me-logout aplikasi sendiri. Namun, ketika Anda melakukan login kembali

akan tetapi aplikasi tidak merespon apapun maka hal itu dikarenakan aplikasi telah menyimpan

data Anda (session login) dan agar tidak membiarkan orang lain dengan mudah masuk ke aplikasi

yang sebelumnya belum di logout tersebut. Penyelesaiannya agar admin bisa/diperbolehkan

masuk/login yaitu dengan cara mengetikkan pada address bar browser, link berikut:

http://sman3cibinong.sch.id/index.php/beranda/view_shortcut. Otomatis admin akan dialihkan

kembali ke halaman login dan sekarang admin dapat melakukan login dengan menginputkan

username dan password seperti biasa.

Gambar tampilan dari halaman Administrator dan bagian-bagiannya

DATA MANAGEMENT AREA

Profil User

Menu Bar

Notifikasi Bar

http://sman3cibinong.sch.id/index.php/beranda/view_shortcut


Page 3

Notifikasi Bar

Berisikan dua icon, yang memiliki beberapa fungsi yang berbeda.

Icon ini akan menunjukan ada tidaknya sebuah kontak yang dikirim oleh pengunjung.

Icon ini akan menunjukan sebuah komentar artikel/post yang telah dikirim oleh pengunjung.


Page 4

Profil User

Berisi username, level admin dan short link untuk mempermudah kinerja admin (profile dan

logout).

Menu Bar

Berisikan menu-menu dari data yang akan dikelola yang dikelompokan dalam beberapa kategori.

Diantaranya :

o Dashboard

Home

Log Aktifitas

o Konfigurasi Situs, sub menu-nya terdiri dari :

Konfigurasi Umum

Menu

Media


Page 5

o Konten, menu-menunya terdiri dari :

Page

Kategori Post

Post

Album

Photo

Guru & Staff

o Komponen, menu-menunya terdiri dari :

Banner

Sosial Media

Kontak

o Pengguna

o Bantuan

Data Management Area

Pada bagian ini, data yang ada ditampilkan dan pengelolaan data dilakukan. Setelah Anda memilih

salah satu list di notifikasi bar atau menu pada menu bar, maka data yang akan dikelola akan

tampil pada bagian ini.

Penjelasan dari Setiap Menu

Dalam bahasan ini, akan dipaparkan langkah demi langkah dalam mengelola data (menambah,

mengubah atau mengahapus data) dari setiap menu yang ada.

1. Log Aktifitas

Data yang dikelola dari menu ini adalah data mengenai log / histori kegiatan yang telah admin

lakukan baik itu dalam menambahkan data, mengubah, dan menghapus data.


Page 6

2. Konfigurasi Umum

Data yang dikelola dari menu ini adalah data informasi umum dari website Anda yang terdiri dari:

Nama Kotak Isian Keterangan

Header Header website Anda. (Header ini akan dijadikan sebagai gambar utama website pada bagian atas dibawah menu)

Judul Situs Judul website Anda.

Deskripsi Situs

Data yang berisikan penjabaran singkat tentang website Anda (data ini juga diperuntukan untuk peng-indeks-an website Anda pada search engine ).

Kata kunci

Data kata kunci pencarian (kata kunci ini diperlukan untuk meng-indeks-kan website Anda pada search engine seperti Google.com, Yahoo.com, dll ).

Alamat Email Data yang berupa alamat email. Alamat email ini akan dijadikan alamat email tujuan dari kontak kami dan kirim komentar.

Footer

Data yang akan ditampilkan pada bagian bawah halaman website yang dilihat pengunjung. (Bisa disikan dengan statement copyright atau alamat perusahaan Anda atau data lainnya)

Latitude / Longitude Latitude dan Longitude sebuah peta untuk mengetahui titik lokasi (alamat) Anda. Ini bisa Anda dapatkan pada Google Map.

Judul Kontak Judul dari kontak yang akan ditampilkan di halaman Kontak Kami.

Deskripsi Kontak Deskripsi mengenai kontak, bisa di isi dengan alamat atau yang lain.

No Telepon Nomor telepon admin yang dapat dihubungi.

Album, Kategori Post 1, dan Kategori Post 2 (home)

Data ini akan digunakan untuk mengatur tampilan data album dan post berdasarkan kategori di halaman awal/beranda/home.


Page 7

o Langkah untuk mengubah data konfigurasi situs :

Sorot menu Konfigurasi Situs lalu Klik menu Konfigurasi Umum, setelah menu di klik

maka form yang menampilkan data konfigurasi umum Anda akan tampil pada bagian data

management area halaman Administrator.

Lakukan perubahan data yang anda kehendaki, setelah selesai klik tombol Simpan.

3. Menu

Pada sub menu – Menu ini, jika Anda klik menu Konfigurasi Situs Menu, maka pada bagian

data management area akan tampil seluruh data menu yang ada, termasuk grup menu utama (no

parent) maupun data menu megamenu.

Data yang dikelola dari menu ini adalah sebagai berikut:


Label Menu Label dari menu yang akan ditampilkan.

Menu Induk Kotak isian ini diperlukan jika menu yang sedang dikelola akan dijadikan sub menu, jika tidak maka hiraukan kotak isian ini (biarkan bernilai Menu Induk).

Urutan Urutan dari posisi menu. Menu akan ditampilkan di halaman depan website berdasarkan urutan dari yang terkecil sampai yang terbesar (1 - ~ ).

Link URL

Tautan dari menu tersebut jika menu di klik. 1. Anda juga dapat mengisi Link ini dengan mengacu pada “Saran

Halaman”. Pilih salah satu saran halaman kemudian form link tersebut akan otomatis terisi dengan link dari saran halaman.

2. Saran Halaman terdiri dari : 3. – Page (lihat halaman Page) 4. – Album (lihat halaman Album) 5. – Kategori Post (lihat halaman kategori post) 6. – Post All 7. – Kontak 8. – Guru dan Staff Kami

Publikasikan Menu Pilihan untuk menampilkan atau tidak menampilkan data/menu.

Sebagai Megamenu?

Pilihan apakah menu akan dijadikan megamenu atau tidak. Opsi megamenu ini ditampilkan apabila menu yang akan dibuat adalah sebagai menu induk / sebagai parent. Cat: menu megamenu hanya menampilkan empat kolom pada halaman frontend/beranda website.


Page 8

Type Megamenu

Digunakan untuk memilih tipe dari isian/konten submenu. Form type megamenu akan muncul apabila memilih “menu Induk” yang juga sebagai “menu megamenu” maka form ini akan muncul otomatis. Ada tiga tipe mega menu yaitu : - Menu (standar), untuk membuat sub menu standar

seperti sub menu lain yang bukan sebagai menu megamenu.

- Album, untuk membuat sub menu yang mengacu pada data album

- Banner, untuk membuat sub menu yang dapat mengambil beberapa data banner yang ingin dijadikan dan tampil pada sub menu megamenu.

Pilih Data Album, Pilih Data Banner

Form yang akan muncul ketika form Type Megamenu dipilih baik itu “Album” ataupun “Banner”. Type megamenu “Album” maka akan menampilkan form “Pilih Data Album”, type megamenu “Banner” maka akan menampilkan form “Pilih Data Banner”.

Sebagai Menu Footer (bawah)?

Opsi yang diperuntukan bagi menu yang akan dijadikan menu footer yang ada dibagian paling bawah. Menu footer(bawah) tidak akan bisa muncul pada menu header(atas). Menu footer tidak bisa dijadikan menu megamenu atau sebaliknya.

*Cat: megamenu yaitu menu yang mempunyai konten didalam setiap submenunya.

Contoh gambar menu megamenu


Page 9

Berikut langkah-langkah untuk mengelola datanya :

o Langkah-langkah untuk menambah data:

Klik menu Konfigurasi Situs Menu, setelah menu di klik maka data yang ada akan

tampil pada bagian data management area.

Klik tombol Tambah Baru.

Isikan seluruh kotak isian yang ada (Label Menu, Menu Induk, Sebagai Megamenu (opsi),

Type Megamenu (opsi), Pilih Data Album (opsi), Pilih Data Banner (opsi), Pilih Urutan, Link

URL, Sebagai Menu Footer (bawah), Publikasikan Menu).

Lalu klik tombol Simpan.

o Langkah-langkah untuk mengubah data yang sudah ada:

Pada tampilan tabel yang menampilkan list data, klik link icon ubah pada kolom aksi.

Setelah link icon ubah di klik maka form ubah data akan tampil.

Lakukan pengubahan data yang Anda kehendaki. Jika pengubahan data telah selesai klik

tombol Simpan.

o Langkah untuk menghapus data adalah dengan me-klik link icon hapus pada kolom aksi.

Setelah link icon hapus di klik, maka akan muncul kotak dialog konfirmasi untuk melakukan

penghapusan data, pilih Ok untuk melanjutkan proses penghapusan data atau Cancel jika Anda

ingin membatalkan proses penghapusan data.


Page 10

Gambar list data dari sub menu Data Menu.

*)Ket : Fungsi seperti pada gambar diatas dapat berlaku untuk semua fitur atau menu yang ada pada

web.

Link untuk mengubah data

Link untuk menghapus data

Link untuk menambah data


Page 11

4. Media

Khusus untuk menu Media ini, merupakan fitur tambahan yang diberikan. Fungsi dari fitur ini

sendiri adalah sebagai file manager, dimana Anda bisa mengupload data berupa

gambar(JPG/PNG/GIF), animasi(SWF), ataupun dokumen(Word, PDF, Excel,PPT,TXT). Dan fitur ini juga

diperlukan jika Anda hendak menautkan banner pada file PDF contohnya.

Berikut langkah-langkah untuk mengupload data pada menu ini :

1. Klik link upload

2. Klik tombol Browse pada form yang tampil.

3. Cari file yang akan diupload.

4. Dan klik link Upload.

Gambar tampilan dari fitur media penyimpanan data

Link untuk

mengupload data


Page 12

5. Page

Menu ini berfungsi sebagai pengelola data halaman statis. Data yang dikelola dari menu ini

terdiri dari :


Judul Judul dari halaman tersebut.

Deskripsi

Data yang berisikan penjabaran singkat tentang website Anda (data ini juga diperuntukan untuk peng-indeks-an website anda pada search engine).

Konten Data / content dari halaman .

Kata Kunci

Data kata kunci pencarian (kata kunci ini diperlukan untuk meng-indeks-kan website Anda pada search engine seperti Google.com, Yahoo.com, dll ).

Berikut langkah-langkah untuk mengelola datanya:


Klik menu Konten Page, setelah menu di klik maka data yang ada akan tampil pada

bagian data management area.


Isikan seluruh kotak isian yang ada (Judul, Deskripsi, Konten, Kata Kunci).



Pada tampilan tabel yang menampilkan list data, klik link icon ubah pada kolom aksi.

Setelah link icon ubah diklik maka form ubah data akan tampil.


tombol Simpan.



penghapusan data, pilih Ok untuk melanjutkan proses penghapusan data atau Cancel jika anda



Page 13

Gambar dari list data menu Halaman Statis.

*)Ket : Fungsi seperti pada gambar diatas dapat berlaku untuk semua fitur atau menu yang ada pada

web.

Link untuk mengubah data

Link untuk menghapus data

Link untuk menambah data


Page 14

6. Kategori Post

Menu ini berfungsi sebagai pengelola data kategori post. Data yang dikelola dari menu ini terdiri

dari:


Nama Kategori Kategori post itu sendiri.



Klik menu Konten Kategori Post, setelah menu di klik maka data yang ada akan tampil

pada bagian data management area.

Lalu, Isikan seluruh kotak isian yang ada di samping kanan list data kategori post (Nama

Kategori).

Lalu, klik tombol Simpan.


Pada tampilan tabel yang menampilkan list data kategori post, klik link icon ubah pada

kolom aksi. Setelah link icon ubah di klik maka form ubah data akan tampil.


tombol Simpan.






Page 15

7. Post

Pada menu Post ini, data yang akan dikelola adalah data keseluruhan artikel. Untuk data-data

yang akan dikelola pada menu ini adalah sebagai berikut.

Kotak Isian Keterangan

Judul Judul/teks dari data artikel.

Gambar Gambar default data artikel (gambar akan ditampilkan pada awal paragraf data posting dan sebagai thumbnail posting-an). Format: .png/jpg/jpeg

Kategori Post Memilih kategori post.

Konten Isi dari artikel tersebut.

Deskripsi Data yang berisikan penjabaran singkat tentang artikel (data ini juga diperuntukan untuk pengeindeks-an artikel Anda pada search engine).

Kata Kunci

Data kata kunci pencarian (kata kunci ini diperlukan untuk meng-indeks-kan artikel pada search engine seperti Google.com, Yahoo.com, dll ).

Tanggal Tanggal penginputan artikel atau bisa juga sebagai tanggal update artikel.

Izinkan Komentar Opsi/pilihan untuk menampilkan atau tidak menampilkan form komentar di halaman detail artikel.



Klik menu Konten Post, setelah menu di klik maka data yang ada akan tampil pada bagian

data management area.


Isikan seluruh kotak isian yang ada (Judul, Gambar, Kategori Post, Deskripsi, Kata Kunci,

Konten, Tanggal, Izinkan Komentar).



Pada tampilan tabel yang menampilkan list data, klik link ubah pada kolom aksi. Setelah link

ubah diklik maka form ubah data akan tampil.


Page 16


tombol Simpan.

o Langkah untuk menghapus data adalah dengan me-klik link hapus pada kolom aksi. Setelah link

hapus di klik, maka akan muncul kotak dialog konfirmasi untuk melakukan penghapusan data, pilih

Ok untuk melanjutkan proses penghapusan data atau Cancel jika Anda ingin membatalkan proses

penghapusan data.

8. Album

Pada menu Album ini, data yang akan dikelola adalah data seluruh album galeri. Untuk data

yang akan dikelola pada menu ini adalah sebagai berikut.


Nama Album Nama album galeri.



Klik menu Konten Album, setelah menu di klik maka data yang ada akan tampil pada


Isikan seluruh kotak isian yang ada pada form sebelah kanan Data Album (Nama Album).




ubah diklik maka form ubah data akan tampil.


tombol Simpan.


hapus di klik, maka akan muncul kotak dialog konfirmasi untuk melakukan penghapusan data,

pilih Ok untuk melanjutkan proses penghapusan data atau Cancel jika Anda ingin membatalkan

proses penghapusan data.


Page 17

9. Photo

Pada menu Photo, data yang akan dikelola adalah data seluruh photo berdasarkan album. Pilih

salah satu album yang sebelumya sudah dibuat (gambar yang muncul adalah gambar salah satu

photo yang sudah diinput akan tetapi jika belum ada sama sekali photo di album tersebut maka akan

menggunakan gambar default).

Untuk data yang akan dikelola pada menu photo ini adalah sebagai berikut.


Judu Foto Judul / caption dari foto tersebut.

Foto File foto tersebut.

Album Album dari foto tersebut.

Publikasikan Foto Opsi untuk menampilkan atau tidak menampilkan foto pada halaman galeri.



Klik menu Konten Photo, setelah menu di klik maka data yang ada akan tampil pada


Klik tombol Tambah Baru atau dengan meng-klik salah satu album. Lalu,

Isikan seluruh kotak isian yang ada (Judul Foto, Foto, Album, Publikasikan Foto).



Pada tampilan yang menampilkan list data foto berdasarkan album, klik link icon ubah.



tombol Simpan.

o Langkah untuk menghapus data adalah dengan me-klik link icon hapus pada tampilan list foto

berdasarkan album. Setelah link icon hapus di klik, maka akan muncul kotak dialog konfirmasi

untuk melakukan penghapusan data, pilih Ok untuk melanjutkan proses penghapusan data

atau Cancel jika Anda ingin membatalkan proses penghapusan data.


Page 18

10. Guru & Staff

Pada menu Guru & Staff ini, data yang akan dikelola adalah data guru dan staff TU. Berikut data

yang akan dikelola pada menu guru & staff:


Nama Nama staff pengajar atau staff TU.

Bidang Studi Mata pelajaran yang diajarkan (oleh guru terkait).

Photo File Photo.

No Telp

No telp/HP. Data tidak akan ditampilkan untuk umum hanyak diperuntukan oleh admin untuk kepentingan sekolah. *ket: 089620013xxx

Alamat Guru staff pengajar atau staff TU

Email Email staff pengajar atau staff TU.


Page 19

Berikut langkah-langkah untuk mengelola datanya :


Klik menu Konten Guru & Staff, setelah menu di klik maka data yang ada akan tampil

pada bagian data management area. Lalu pilih tombol Tambah Baru.

Isikan seluruh kotak isian yang ada (Nama, Photo, Bidang Studi, No Telp, Alamat, Email).



Pada tampilan tabel yang menampilkan list data guru & staff, klik link ubah. Setelah link

ubah di klik maka form ubah data akan tampil.


tombol Simpan.





11. Banner

Menu ini berfungsi sebagai pengelola data gambar-gambar yang akan dijadikan banner. Data

yang dikelola dari menu ini terdiri dari:


Caption Teks yang akan ditampilkan, jika gambar tidak tampil atau bisa juga sebagai caption gambar.

Image File gambar banner.

Url Link (Tautan) URL tujuan, jika gambar banner di klik.

Urutan Urutan dalam menampilkan banner.

Posisi Banner

Penempatan banner : BannerOpsi_1 Posisi Iklan Sidebar (disamping) BannerOpsi_2 Posisi Iklan Footer (dibawah) (lihat gambar: Posisi banner frontend/tampilan depan)


Page 20

Publikasikan Banner Pilihan untuk menampilkan atau tidak menampilkan gambar banner.



Klik menu Komponen Banner, setelah menu di klik maka data yang ada akan tampil pada


Lalu, Isikan seluruh kotak isian yang ada di samping kiri list data banner (Caption, Image, Url,

Urutan, Posisi Banner, Publikasikan Banner).



Pada tampilan tabel yang menampilkan list data banner, klik link icon ubah pada kolom aksi.



tombol Simpan.






Page 21

Gambar list data banner


Page 22

Gambar posisi banner frontend/tampilan depan

BannerOpsi_1 Iklan

Sidebar

BannerOpsi_2 Iklan

Footer


Page 23

12. Sosial Media

Menu ini berfungsi sebagai pengelola data medsos (Media Sosial) seperti facebook, twitter,

youtube, dll. Data yang dikelola dari menu ini terdiri dari:


Nama Sosmed Nama Sosial Media, misal Facebook.

Icon Icon social media. Anda bias melihat beberapa icon yang tersedia di sebelah kanan form, copy text icon kemudian paste ke form inputan icon.

Url Link alamat sosmed Anda.

Publikasikan Sosmed Pilihan untuk menampilkan atau tidak menampilkan data.



Klik menu Komponen Sosial Media, setelah menu di klik maka data yang ada akan tampil

pada bagian data management area. Lalu, Klik button Tambah Baru.

Isikan seluruh kotak isian yang ada (Nama Sosmed, Icon, Url, Publikasikan Sosmed).






tombol Simpan.






Page 24

13. Kontak

Data yang telah dikirimkan pengunjung website untuk menghubungi admin. Kontak kami dapat

berupa saran, kritik atau pertanyaan pengunjung. Di sini admin dapat membalas kontak tersebut dan

mengirimkannya ke email pengirim secara langsung.

Berikut langkah-langkah untuk membalas kontak.

o Langkah-langkah untuk mengirimkan balasan:

Klik menu Komponen Kontak, setelah menu di klik maka data yang ada akan tampil pada

bagian data management area. Lalu Klik button Reply pada salah satu list kontak yang

dikirim.

Kemudian klik tombol icon balas dan tuliskan balasan pada form yang tersedia.

Lalu klik tombol Kirim jika sudah yakin dengan balasan Anda.





14. Pengguna

Menu ini berfungsi sebagai pengelola data admin. Data yang dikelola dari menu ini terdiri dari:


Nama Lengkap Nama admin atau user.

Username Username admin yang akan digunakan ketika melakukan login.

Password Password admin yang juga akan digunakan ketika melakukan login.

Level Sudah baku tidak dapat dirubah (superadmin).

Status Status admin/user, aktif atau tidak aktif.


Page 25



Klik menu Pengguna, setelah menu di klik maka data yang ada akan tampil pada bagian data

management area. Lalu pilih Tab Menu Tambah Pengguna.

Isikan seluruh kotak isian yang ada (Nama Lengkap, Username, Password, Status).






tombol Simpan.





====== AKHIR HALAMAN =====

manual book penggunaan cms website sma negeri 3 cibinong ... filewebsite dengan alamat url ......

Documents