
{"id":706,"date":"2025-09-21T18:35:30","date_gmt":"2025-09-21T10:35:30","guid":{"rendered":"https:\/\/press.poltradabali.ac.id\/?page_id=706"},"modified":"2025-09-21T19:29:46","modified_gmt":"2025-09-21T11:29:46","slug":"alur-submisi","status":"publish","type":"page","link":"https:\/\/press.poltradabali.ac.id\/index.php\/alur-submisi\/","title":{"rendered":"Petunjuk Pengguna"},"content":{"rendered":"\n<!DOCTYPE html>\n<html lang=\"id\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n  \n    <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/dashicons\/0.9.0\/css\/dashicons.min.css\">\n    <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n    <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@400;500;600;700&#038;display=swap\" rel=\"stylesheet\">\n    <style>\n        body {\n            font-family: 'Poppins', sans-serif;\n            background-color: #f4f7fc;\n            color: #495057;\n            margin: 0;\n            padding: 50px 20px;\n        }\n        .infographic-container {\n            max-width: 900px;\n            margin: 0 auto;\n        }\n        .infographic-title {\n            text-align: center;\n            font-size: 2.8em;\n            font-weight: 700;\n            color: #0d2a53;\n            margin-bottom: 50px;\n        }\n        \n       \/* ===== GAYA BARU UNTUK NAVIGASI TAB (FINAL) ===== *\/\n        .infographic-tabs-nav {\n            display: flex;\n            justify-content: center;\n            margin-bottom: 40px;\n            gap: 15px;\n            margin-top: 20px;\n        }\n        .tab-link {\n            padding: 12px 25px !important;\n            cursor: pointer !important;\n            font-size: 1.1em !important;\n            font-weight: 600 !important;\n            border-radius: 8px !important;\n            border: 1px solid #dee2e6 !important;\n            background-color: #f8f9fa !important; \/* Latar abu-abu sangat muda *\/\n            color: #6c757d !important; \/* Teks abu-abu *\/\n            transition: all 0.2s ease-in-out !important;\n            box-shadow: 0 2px 4px rgba(0,0,0,0.05) !important;\n        }\n        .tab-link:hover {\n            color: #0d2a53 !important; \/* Teks biru tua *\/\n            background-color: #fffbeb !important; \/* Latar kuning pucat (warna aksen) *\/\n            border-color: #f7b731 !important; \/* Border kuning emas *\/\n            transform: translateY(-2px) !important;\n            box-shadow: 0 4px 10px rgba(0,0,0,0.1) !important;\n        }\n        .tab-link.active {\n            color: white !important; \/* Teks putih *\/\n            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important; \/* Latar GRADIENT ungu\/biru *\/\n            border-color: transparent !important;\n            transform: translateY(-2px) !important;\n            box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4) !important;\n        }\n        \/* ===== GAYA UNTUK KONTEN TAB ===== *\/\n        .tab-pane {\n            display: none; \/* Sembunyikan semua panel secara default *\/\n        }\n        .tab-pane.active {\n            display: block; \/* Tampilkan hanya yang aktif *\/\n        }\n\n        .timeline {\n            position: relative;\n            padding: 20px 0;\n        }\n        .timeline::after {\n            content: '';\n            position: absolute;\n            width: 3px;\n            background-color: #e0e0e0;\n            top: 0;\n            bottom: 0;\n            left: 50%;\n            margin-left: -1.5px;\n        }\n        .timeline-item {\n            padding: 10px 40px;\n            position: relative;\n            background-color: inherit;\n            width: 50%;\n            box-sizing: border-box;\n        }\n        .timeline-item .timeline-dot {\n            content: '';\n            position: absolute;\n            width: 20px;\n            height: 20px;\n            right: -10px;\n            background-color: white;\n            border: 4px solid #f7b731;\n            top: 35px;\n            border-radius: 50%;\n            z-index: 1;\n        }\n        .timeline-item.purchase .timeline-dot {\n            border-color: #28a745;\n        }\n        .timeline-item.left { left: 0; padding-right: 30px; }\n        .timeline-item.right { left: 50%; padding-left: 30px; }\n        .timeline-item.left .timeline-content::before {\n            content: \" \"; height: 0; position: absolute; top: 32px; width: 0; z-index: 1;\n            right: -10px; border: medium solid white; border-width: 10px 0 10px 10px;\n            border-color: transparent transparent transparent white;\n        }\n        .timeline-item.right .timeline-content::before {\n            content: \" \"; height: 0; position: absolute; top: 32px; width: 0; z-index: 1;\n            left: -10px; border: medium solid white; border-width: 10px 10px 10px 0;\n            border-color: transparent white transparent transparent;\n        }\n        .timeline-item.right .timeline-dot { left: -10px; }\n        .timeline-content {\n            padding: 25px;\n            background-color: white;\n            position: relative;\n            border-radius: 8px;\n            box-shadow: 0 5px 20px rgba(0,0,0,0.08);\n        }\n        .step-header {\n            display: flex;\n            align-items: center;\n            gap: 15px;\n            margin-bottom: 15px;\n            border-bottom: 2px solid #f0f0f1;\n            padding-bottom: 15px;\n        }\n        .step-icon { font-size: 28px; color: #0d2a53; }\n        .step-title { font-size: 1.3em; font-weight: 600; color: #0d2a53; margin: 0; }\n        .step-description { font-size: 0.95em; line-height: 1.7; margin: 0; }\n        .profile-view {\n            margin-top: 15px;\n            padding: 15px;\n            background-color: #f8f9fa;\n            border-left: 3px solid #667eea;\n            border-radius: 4px;\n        }\n        .profile-view strong {\n            display: block;\n            margin-bottom: 5px;\n            font-size: 0.9em;\n            color: #333;\n        }\n        .profile-view p { margin: 0; font-size: 0.85em; }\n        .status-badge { display: inline-block; padding: 2px 8px; border-radius: 10px; font-size: 0.75em; font-weight: bold; color: white; }\n        .status-pending, .status-menunggu-verifikasi, .status-menunggu-kalkulasi, .status-menunggu-va, .status-menunggu-pembayaran { background-color: #ffc107; color: #333; }\n        .status-approved, .status-selesai { background-color: #28a745; }\n        .status-redaksi, .status-telah-dikirim { background-color: #17a2b8; }\n        .status-revisi { background-color: #fd7e14; }\n        .status-terpublikasi { background-color: #6610f2; }\n\n        @media screen and (max-width: 768px) {\n            .timeline::after { left: 19px; }\n            .timeline-item { width: 100%; padding-left: 50px; padding-right: 15px; }\n            .timeline-item.left, .timeline-item.right { left: 0%; }\n            .timeline-item .timeline-dot { left: 9px; }\n            .timeline-item.left .timeline-content::before, .timeline-item.right .timeline-content::before {\n                left: -10px; border-width: 10px 10px 10px 0; border-color: transparent white transparent transparent;\n            }\n        }\n    <\/style>\n<\/head>\n<body>\n\n    <div class=\"infographic-container\">\n\n        <div class=\"infographic-tabs-nav\">\n            <button class=\"tab-link active\" data-tab=\"penerbitan\">Alur Penerbitan<\/button>\n            <button class=\"tab-link\" data-tab=\"pembelian\">Alur Pembelian<\/button>\n        <\/div>\n\n        <div class=\"infographic-tab-content\">\n\n            <div id=\"penerbitan\" class=\"tab-pane active\">\n                <div class=\"timeline\">\n                    <div class=\"timeline-item left\">\n                        <div class=\"timeline-dot\"><\/div>\n                        <div class=\"timeline-content\">\n                            <div class=\"step-header\"><span class=\"dashicons dashicons-id step-icon\"><\/span><h3 class=\"step-title\">1. Pendaftaran &#038; Pengajuan<\/h3><\/div>\n                            <p class=\"step-description\">Anda mendaftar\/login, lalu mengisi Formulir Pengajuan dengan detail naskah Anda.<\/p>\n                            <div class=\"profile-view\"><strong>Tampilan di Profil Anda:<\/strong><p>Pengajuan baru muncul di tab &#8220;Riwayat Pengajuan&#8221; dengan status <span class=\"status-badge status-pending\">Pending<\/span>.<\/p><\/div>\n                        <\/div>\n                    <\/div>\n                    <div class=\"timeline-item right\">\n                        <div class=\"timeline-dot\"><\/div>\n                        <div class=\"timeline-content\">\n                            <div class=\"step-header\"><span class=\"dashicons dashicons-thumbs-up step-icon\"><\/span><h3 class=\"step-title\">2. Persetujuan &#038; Tagihan<\/h3><\/div>\n                            <p class=\"step-description\">Admin meninjau pengajuan Anda. Jika disetujui, tagihan biaya penerbitan akan dikirim ke email Anda.<\/p>\n                            <div class=\"profile-view\"><strong>Tampilan di Profil Anda:<\/strong><p>Notifikasi titik merah muncul di tab. Status berubah menjadi <span class=\"status-badge status-approved\">Approved<\/span>. Tombol &#8220;Konfirmasi Pembayaran&#8221; ditampilkan.<\/p><\/div>\n                        <\/div>\n                    <\/div>\n                    <div class=\"timeline-item left\">\n                        <div class=\"timeline-dot\"><\/div>\n                        <div class=\"timeline-content\">\n                            <div class=\"step-header\"><span class=\"dashicons dashicons-money-alt step-icon\"><\/span><h3 class=\"step-title\">3. Konfirmasi Pembayaran<\/h3><\/div>\n                            <p class=\"step-description\">Anda melakukan pembayaran sesuai tagihan, lalu mengunggah bukti pembayaran melalui Formulir Pembayaran.<\/p>\n                            <div class=\"profile-view\"><strong>Tampilan di Profil Anda:<\/strong><p>Status berubah menjadi <span class=\"status-badge status-menunggu-verifikasi\">Menunggu Verifikasi<\/span>. Tombol aksi hilang sementara.<\/p><\/div>\n                        <\/div>\n                    <\/div>\n                    <div class=\"timeline-item right\">\n                        <div class=\"timeline-dot\"><\/div>\n                        <div class=\"timeline-content\">\n                            <div class=\"step-header\"><span class=\"dashicons dashicons-admin-page step-icon\"><\/span><h3 class=\"step-title\">4. Proses Naskah<\/h3><\/div>\n                            <p class=\"step-description\">Setelah admin memverifikasi pembayaran, Anda akan menerima email berisi template untuk mulai menulis naskah lengkap.<\/p>\n                            <div class=\"profile-view\"><strong>Tampilan di Profil Anda:<\/strong><p>Status berubah menjadi <span class=\"status-badge status-redaksi\">Redaksi<\/span>. Tombol &#8220;Submit Naskah&#8221; muncul.<\/p><\/div>\n                        <\/div>\n                    <\/div>\n                    <div class=\"timeline-item left\">\n                        <div class=\"timeline-dot\"><\/div>\n                        <div class=\"timeline-content\">\n                            <div class=\"step-header\"><span class=\"dashicons dashicons-search step-icon\"><\/span><h3 class=\"step-title\">5. Review &#038; Revisi<\/h3><\/div>\n                            <p class=\"step-description\">Anda mengunggah naskah yang sudah jadi. Tim editor akan meninjau. Jika ada perbaikan, Anda akan diberitahu.<\/p>\n                            <div class=\"profile-view\"><strong>Tampilan di Profil Anda:<\/strong><p>Jika ada perbaikan, notifikasi muncul dan status menjadi <span class=\"status-badge status-revisi\">Revisi<\/span>. Anda diminta mengunggah ulang.<\/p><\/div>\n                        <\/div>\n                    <\/div>\n                    <div class=\"timeline-item right\">\n                        <div class=\"timeline-dot\"><\/div>\n                        <div class=\"timeline-content\">\n                            <div class=\"step-header\"><span class=\"dashicons dashicons-book step-icon\"><\/span><h3 class=\"step-title\">6. Buku Terbit!<\/h3><\/div>\n                            <p class=\"step-description\">Setelah naskah final disetujui, tim kami akan memproses layout, desain, ISBN, hingga buku siap terbit di katalog.<\/p>\n                            <div class=\"profile-view\"><strong>Tampilan di Profil Anda:<\/strong><p>Status akhir berubah menjadi <span class=\"status-badge status-terpublikasi\">Terpublikasi<\/span>. Tombol &#8220;Lihat di Katalog&#8221; muncul.<\/p><\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n\n            <div id=\"pembelian\" class=\"tab-pane\">\n                <div class=\"timeline\">\n                    <div class=\"timeline-item right purchase\">\n                        <div class=\"timeline-dot\"><\/div>\n                        <div class=\"timeline-content\">\n                            <div class=\"step-header\"><span class=\"dashicons dashicons-store step-icon\"><\/span><h3 class=\"step-title\">1. Pilih Buku &#038; Format<\/h3><\/div>\n                            <p class=\"step-description\">Anda menemukan buku di katalog, lalu menekan tombol &#8220;Beli PDF&#8221; atau &#8220;Beli Fisik&#8221;.<\/p>\n                            <div class=\"profile-view\"><strong>Tampilan di Profil Anda:<\/strong><p>Belum ada perubahan. Anda akan diarahkan ke Formulir Pembelian.<\/p><\/div>\n                        <\/div>\n                    <\/div>\n                    <div class=\"timeline-item left purchase\">\n                        <div class=\"timeline-dot\"><\/div>\n                        <div class=\"timeline-content\">\n                            <div class=\"step-header\"><span class=\"dashicons dashicons-list-view step-icon\"><\/span><h3 class=\"step-title\">2. Permintaan Pembelian<\/h3><\/div>\n                            <p class=\"step-description\">Anda mengisi formulir pembelian, memilih format dan metode pembayaran, lalu mengirim permintaan.<\/p>\n                            <div class=\"profile-view\"><strong>Tampilan di Profil Anda:<\/strong><p>Pesanan baru muncul di tab &#8220;Riwayat Pesanan Buku&#8221; dengan status awal (<span class=\"status-badge status-menunggu-kalkulasi\">Menunggu Kalkulasi<\/span>, <span class=\"status-badge status-menunggu-va\">Menunggu VA<\/span>, dll).<\/p><\/div>\n                        <\/div>\n                    <\/div>\n                    <div class=\"timeline-item right purchase\">\n                        <div class=\"timeline-dot\"><\/div>\n                        <div class=\"timeline-content\">\n                            <div class=\"step-header\"><span class=\"dashicons dashicons-email-alt step-icon\"><\/span><h3 class=\"step-title\">3. Terima Instruksi &#038; Bayar<\/h3><\/div>\n                            <p class=\"step-description\">Anda akan menerima instruksi pembayaran (detail rekening, total tagihan, atau nomor VA) melalui email dan juga di halaman profil.<\/p>\n                            <div class=\"profile-view\"><strong>Tampilan di Profil Anda:<\/strong><p>Notifikasi muncul di tab pesanan. Status menjadi <span class=\"status-badge status-menunggu-pembayaran\">Menunggu Pembayaran<\/span>. Detail pembayaran dan tombol &#8220;Konfirmasi Pembayaran&#8221; ditampilkan.<\/p><\/div>\n                        <\/div>\n                    <\/div>\n                    <div class=\"timeline-item left purchase\">\n                        <div class=\"timeline-dot\"><\/div>\n                        <div class=\"timeline-content\">\n                            <div class=\"step-header\"><span class=\"dashicons dashicons-cloud-upload step-icon\"><\/span><h3 class=\"step-title\">4. Konfirmasi Pembayaran<\/h3><\/div>\n                            <p class=\"step-description\">Setelah membayar, Anda mengunjungi halaman konfirmasi (via profil) dan mengunggah bukti pembayaran.<\/p>\n                            <div class=\"profile-view\"><strong>Tampilan di Profil Anda:<\/strong><p>Status berubah menjadi <span class=\"status-badge status-menunggu-verifikasi\">Menunggu Validasi<\/span>. Anda tinggal menunggu proses dari admin.<\/p><\/div>\n                        <\/div>\n                    <\/div>\n                     <div class=\"timeline-item right purchase\">\n                        <div class=\"timeline-dot\"><\/div>\n                        <div class=\"timeline-content\">\n                            <div class=\"step-header\"><span class=\"dashicons dashicons-archive step-icon\"><\/span><h3 class=\"step-title\">5. Pesanan Diproses<\/h3><\/div>\n                            <p class=\"step-description\">Admin memvalidasi pembayaran Anda. Untuk buku fisik, pesanan akan dikemas dan dikirim. Untuk PDF, akses akan langsung diberikan.<\/p>\n                             <div class=\"profile-view\"><strong>Tampilan di Profil Anda:<\/strong><p>Untuk fisik, status berubah menjadi <span class=\"status-badge status-telah-dikirim\">Telah Dikirim<\/span> dan No. Resi muncul. Untuk PDF, status langsung menjadi <span class=\"status-badge status-selesai\">Selesai<\/span>.<\/p><\/div>\n                        <\/div>\n                    <\/div>\n                     <div class=\"timeline-item left purchase\">\n                        <div class=\"timeline-dot\"><\/div>\n                        <div class=\"timeline-content\">\n                            <div class=\"step-header\"><span class=\"dashicons dashicons-yes-alt step-icon\"><\/span><h3 class=\"step-title\">6. Pesanan Selesai<\/h3><\/div>\n                            <p class=\"step-description\">Untuk buku fisik, Anda menekan tombol &#8220;Buku Diterima&#8221; di profil setelah pesanan sampai. Untuk PDF, Anda bisa langsung men-download buku dari profil.<\/p>\n                             <div class=\"profile-view\"><strong>Tampilan di Profil Anda:<\/strong><p>Status akhir adalah <span class=\"status-badge status-selesai\">Selesai<\/span>. Notifikasi hilang, dan tombol Download PDF (jika ada) akan tersedia.<\/p><\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n\n        <\/div>\n    <\/div>\n\n    <script>\n        document.addEventListener('DOMContentLoaded', function() {\n            const tabs = document.querySelectorAll('.tab-link');\n            const panes = document.querySelectorAll('.tab-pane');\n\n            tabs.forEach(tab => {\n                tab.addEventListener('click', function() {\n                    const targetId = this.getAttribute('data-tab');\n                    \n                    \/\/ Nonaktifkan semua tab dan panel\n                    tabs.forEach(t => t.classList.remove('active'));\n                    panes.forEach(p => p.classList.remove('active'));\n                    \n                    \/\/ Aktifkan tab dan panel yang diklik\n                    this.classList.add('active');\n                    document.getElementById(targetId).classList.add('active');\n                });\n            });\n        });\n    <\/script>\n\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Alur Penerbitan Alur Pembelian 1. Pendaftaran &#038; Pengajuan Anda mendaftar\/login, lalu mengisi Formulir Pengajuan dengan detail naskah Anda. Tampilan di Profil Anda: Pengajuan baru muncul&hellip;<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-706","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/press.poltradabali.ac.id\/index.php\/wp-json\/wp\/v2\/pages\/706","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/press.poltradabali.ac.id\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/press.poltradabali.ac.id\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/press.poltradabali.ac.id\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/press.poltradabali.ac.id\/index.php\/wp-json\/wp\/v2\/comments?post=706"}],"version-history":[{"count":9,"href":"https:\/\/press.poltradabali.ac.id\/index.php\/wp-json\/wp\/v2\/pages\/706\/revisions"}],"predecessor-version":[{"id":720,"href":"https:\/\/press.poltradabali.ac.id\/index.php\/wp-json\/wp\/v2\/pages\/706\/revisions\/720"}],"wp:attachment":[{"href":"https:\/\/press.poltradabali.ac.id\/index.php\/wp-json\/wp\/v2\/media?parent=706"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}