WordPress,yang pada awalnya dirancang sebagai platform blogging,kini telah mengalami perkembangan signifikan dan menjadi sistem manajemen konten (CMS) yang mampu memenuhi berbagai kebutuhan.
WordPress menawarkan beberapa fitur utama yang menjadikannya CMS yang sangat fleksibel dan dapat disesuaikan dengan berbagai kebutuhan:
Dalam project pengurusan surat ini,fitur-fitur WordPress di atas diimplementasikan sebagai berikut:
Berikut adalah contoh tangkapan layar dan penjelasan singkat tentang modifikasi yang kami lakukan.
Homepage
Untuk memastikan hanya pengguna dengan peran (User Role) tertentu yang dapat mengakses halaman spesifik, kami menggunakan kode berikut:
//Cek apakah user login atau tidak
if (!is_user_logged_in()) {
wp_safe_redirect(home_url());
exit;
}
//Cek apakah user adalah Warga / Pengurus RT / Pengurus RW
if (is_user_logged_in()) {
$user = wp_get_current_user();
$user_roles = (array) $user->roles;
if (!current_user_can('administrator') && !in_array('pengurus-rt', $user_roles)) {
wp_safe_redirect(home_url('/dashboard/'));
exit;
}
} else {
wp_safe_redirect(home_url());
exit;
}
//Redirect user yang login ke Dashboard
function redirect_logged_in_users_to_dashboard()
{
if (is_user_logged_in() && is_front_page()) {
$dashboard_page_id = 321; // Replace 123 with the actual ID of your "Dashboard" page
wp_redirect(get_permalink($dashboard_page_id));
exit;
}
}
add_action('template_redirect', 'redirect_logged_in_users_to_dashboard');
//Buat WP Dashboard hanya bisa diakses oleh Admin utama (user id 1)
function restrict_admin_access()
{
$current_user = wp_get_current_user();
// Check if the user is in the admin area and not user ID 1
if (is_admin() && $current_user->ID != 1) {
wp_redirect(home_url()); // Redirect to the homepage
exit; // Prevent further execution
}
}
add_action('admin_init', 'restrict_admin_access');
Pada halaman ini, kami menampilkan ringkasan biodata pengguna, berita singkat dari admin, serta daftar permohonan yang telah mereka ajukan.
Dashboard
Layanan
<?php
//Apabila user login, tampilkan link untuk ke halaman submit Form
if (is_user_logged_in()) {
global $current_user;
get_currentuserinfo(); ?>
<?php
$relatedForms = get_field('form');
if ($relatedForms) {
$relatedForm = $relatedForms[0];
$permalink = get_permalink($relatedForm->ID);
$title = get_the_title($relatedForm->ID);
?> <span class="layPengantar">
<a href="<?php echo esc_url($permalink); ?>">Buat Pengantar</a>
</span>
<?php } ?>
<?php } ?>
<?php
//Apabila Post type Layanan ada Field PDF, tampilkan link Download
if (get_field('pdfLink')) : ?>
<span class="layDownload">
<a href="<?php the_field('pdfLink'); ?>" target="_blank">Download</a></span>
</span>
<?php endif; ?>
Pada halaman pengajuan permohonan, warga akan melihat kembali informasi profil mereka dan persyaratan yang diperlukan. Untuk memastikan permohonan dapat diakses oleh pengurus RT/RW yang sesuai, kami menggunakan taksonomi (kategori) RT dan RW pada post “Submission”. Taksonomi ini bersifat tersembunyi (hidden field) dan akan diperbarui secara otomatis berdasarkan informasi RT dan RW yang terdapat pada profil warga.
Form Layanan
Kami menggunakan fungsi ACF Form dari plugin Advanced Custom Fields untuk menampilkan grup field ACF di bagian depan (frontend) situs, sehingga warga dapat mengisi formulir permohonan dengan mudah.
//Ambil USER ID dan tampilkan data-data yang diperlukan
$user_ID = get_current_user_id();
$rt = get_field('rt', 'user_' . $user_ID);
$rw = get_field('rw', 'user_' . $user_ID);
$alamat = get_field('alamat', 'user_' . $user_ID);
$tempatlahir = get_field('tempat_lahir', 'user_' . $user_ID);
$tanggallahir = get_field('tgl_lahir', 'user_' . $user_ID);
//Update sehingga tanggal yang ditampilkan berformat tanggal Indonesia
setlocale(LC_TIME, 'id_ID');
$formatted_date = strftime('%d %B %Y', strtotime($tanggallahir));
$gender = get_field('gender', 'user_' . $user_ID);
$agama = get_field('agama', 'user_' . $user_ID);
//data lainnya panggil disini...
acf_form_head();
Kami menambahkan kode JavaScript agar secara otomatis menambahkan setiap permohonan surat (post) yang dipublikasikan ke dalam taksonomi RT/RW yang sesuai.
window.onload = function () {
const radioRTs = document.querySelectorAll('[data-taxonomy="rt"] ul.acf-checkbox-list li label input[type="radio"]');
const chooseuserRT = document.getElementById("userRT");
const radioRWs = document.querySelectorAll('[data-taxonomy="rw"] ul.acf-checkbox-list li label input[type="radio"]');
const chooseuserRW = document.getElementById("userRW");
function setRTRadio(text) {
for (const radioRT of radioRTs) {
const labelText = radioRT.nextElementSibling.textContent.trim();
if (labelText === text) {
radioRT.checked = true;
return;
}
}
console.warn("Option text not found in radio button group:", text);
}
setRTRadio(chooseuserRT.textContent);
function setRWRadio(text) {
for (const radioRW of radioRWs) {
const labelTextRW = radioRW.nextElementSibling.textContent.trim();
if (labelTextRW === text) {
radioRW.checked = true;
return;
}
}
console.warn("Option text not found in radio button group:", text);
}
setRWRadio(chooseuserRW.textContent);
};
Setelah permohonan surat dihubungkan dengan taksonomi RT/RW, sistem dapat memfilter permohonan berdasarkan taksonomi tersebut. Hal ini memungkinkan pengurus RT/RW untuk melihat daftar permohonan yang relevan dengan wilayah mereka di dashboard WordPress.
Pada halaman ini, kami menampilkan daftar permohonan yang diajukan oleh pengguna yang sedang login. Untuk itu, kami menggunakan query WordPress untuk mengambil data permohonan (post type “Submission”) yang relevan.
Agar tampilan lebih optimal dan mudah digunakan, kami menambahkan beberapa fitur:
Submission List
Query Utama
<div class="listWrapper">
<?php
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$args = array(
'post_type' => 'submission', // Replace 'submission' with your actual custom post type
'author' => $user_id,
'posts_per_page' => 20,
'paged' => $paged
);
if (!empty($selected_status)) {
$args['meta_compare'] = '=';
$args['meta_key'] = 'status';
$args['meta_value'] = $selected_status;
}
$the_query = new WP_Query($args);
if ($the_query->have_posts()) :
while ($the_query->have_posts()) : $the_query->the_post();
get_template_part('part/listItem'); // Ensure this template part handles your custom post type
endwhile;
if ($the_query->max_num_pages > 1) :
echo '<div class="pagination">';
echo paginate_links(array(
'base' => get_pagenum_link(1) . '%_%', // Adjust as needed
'format' => '?paged=%#%', // Adjust as needed
'current' => max(1, get_query_var('paged')),
'total' => $the_query->max_num_pages,
'prev_text' => __('Previous'),
'next_text' => __('Next'),
));
echo '</div>';
endif;
else :
_e('Tidak ada pengajuan Surat Pengantar.'); // Adjust message as needed
endif;
wp_reset_postdata();
?>
</div>
Kode tambahan (menghitung post berdasarkan status dan Dropdown untuk memfilter status)
<div id="PostHeading">
<div class="subStatus">
<?php
$status_counts = array(
'review' => 0,
'revisi' => 0,
'jadwal' => 0,
'tolak' => 0
);
$count_args = array(
'post_type' => 'submission',
'posts_per_page' => -1,
'tax_query' => array(
array(
'taxonomy' => 'rt',
'field' => 'slug',
'terms' => $rt
)
),
'fields' => 'ids',
);
$count_query = new WP_Query($count_args);
// Count posts with each status
if ($count_query->have_posts()) {
foreach ($count_query->posts as $post_id) {
$status = get_post_meta($post_id, 'status', true);
if (array_key_exists($status, $status_counts)) {
$status_counts[$status]++;
}
}
}
wp_reset_postdata();
echo "<div><span class='statReview'>" . $status_counts['review'] . "</span> review</div>";
echo "<div><span class='statRevisi'>" . $status_counts['revisi'] . "</span> revisi</div>";
echo "<div><span class='statJadwal'>" . $status_counts['jadwal'] . "</span> terjadwal</div>";
echo "<div><span class='statTolak'>" . $status_counts['tolak'] . "</span> ditolak</div>";
$selected_status = isset($_GET['status']) ? $_GET['status'] : '';
?>
</div>
<div class="subFilter">
<form method="get">
<select name="status" onchange="this.form.submit()">
<option value="">Semua Status</option>
<option value="review" <?php selected('review', $selected_status); ?>>Belum direview</option>
<option value="revisi" <?php selected('revisi', $selected_status); ?>>Harap Revisi</option>
<option value="jadwal" <?php selected('jadwal', $selected_status); ?>>Dijadwalkan</option>
<option value="tolak" <?php selected('tolak', $selected_status); ?>>Ditolak</option>
</select>
</form>
</div>
</div>
Query Pengurus RT/RW
Submission RT/RW
Daftar permohonan pada halaman pengurus RT/RW menampilkan permohonan yang relevan dengan wilayah mereka. Untuk mencapai hal ini, kami memodifikasi query WordPress agar memfilter permohonan berdasarkan taksonomi RT, bukan berdasarkan ID pengguna seperti pada halaman pengguna biasa.
$rt_args = array(
'post_type' => 'submission',
'posts_per_page' => -1,
'tax_query' => array(
array(
'taxonomy' => 'rt',
'field' => 'slug',
'terms' => $rt
)
),
'fields' => 'ids',
);
$rt_query = new WP_Query($rt_args);
Selanjutnya, pengurus RT/RW dapat mengedit permohonan surat yang diajukan warga. Mereka memiliki opsi untuk mengubah status permohonan.
Edit Submission
Pada permohonan yang sudah dijadwalkan, kami menyediakan tautan (link) “Cetak” dan “Unduh PDF” yang dapat diakses oleh warga dan pengurus. Tautan ini memudahkan warga untuk mencetak atau menyimpan surat pengantar dalam format PDF. Selain itu, pengurus juga diberikan tautan pintasan (shortcut) ke halaman wa.me untuk berkomunikasi dengan warga melalui WhatsApp.
Halaman cetak permohonan merupakan tampilan khusus dari permohonan tunggal (single-submission). Halaman ini menampilkan data warga yang mengajukan permohonan, termasuk informasi pribadi dan detail permohonan. Selain itu, terdapat tombol yang memungkinkan pengguna untuk mencetak permohonan tersebut dalam format fisik.
Submission Print
Kami menggunakan plugin Document Engine untuk menghasilkan dokumen PDF dari permohonan surat.
Submission PDF
Demikianlah studi kasus tentang bagaimana WordPress, dengan fitur Custom Post Type, User Level, dan plugin gratis, dapat mempermudah proses pengurusan surat keterangan.
Ingin tahu lebih banyak tips dan trik seputar WordPress, UI/UX, marketing, dan sosial media? Jangan lupa ikuti halaman Facebook kami untuk mendapatkan informasi terbaru!
Mari berdiskusi dan jajaki peluang kerja sama.
Mari berdiskusi dan jajaki peluang kerja sama.