{"id":8713,"date":"2025-10-11T15:34:42","date_gmt":"2025-10-11T08:34:42","guid":{"rendered":"https:\/\/kegiatanbelajardanmengajar.id\/?p=8713"},"modified":"2025-10-11T15:36:23","modified_gmt":"2025-10-11T08:36:23","slug":"tes","status":"publish","type":"post","link":"https:\/\/kegiatanbelajardanmengajar.id\/index.php\/2025\/10\/11\/tes\/","title":{"rendered":"Tes"},"content":{"rendered":"<p>        body {<br \/>\n            font-family: &#8216;Poppins&#8217;, sans-serif;<br \/>\n            background-color: #f0f4f8;<br \/>\n        }<br \/>\n        .bg-gradient-header {<br \/>\n            background-image: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 50%, #2563eb 100%);<br \/>\n        }<br \/>\n        .card {<br \/>\n            transition: transform 0.3s ease, box-shadow 0.3s ease;<br \/>\n            cursor: pointer;<br \/>\n        }<br \/>\n        .card:hover {<br \/>\n            transform: translateY(-10px);<br \/>\n            box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);<br \/>\n        }<br \/>\n        .modal-backdrop {<br \/>\n            transition: opacity 0.3s ease-in-out;<br \/>\n        }<br \/>\n        .modal-content {<br \/>\n            transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;<br \/>\n            max-height: 90vh;<br \/>\n        }<br \/>\n        .modal-hidden {<br \/>\n            pointer-events: none;<br \/>\n            opacity: 0;<br \/>\n        }<br \/>\n        .modal-hidden .modal-content {<br \/>\n            transform: translateY(-50px);<br \/>\n            opacity: 0;<br \/>\n        }<br \/>\n        .pdf-viewer {<br \/>\n            width: 100%;<br \/>\n            height: 60vh;<br \/>\n            border-radius: 0.5rem;<br \/>\n        }<\/p>\n<p>    <!-- Header Section --><\/p>\n<header class=\"bg-gradient-header text-white p-8 shadow-lg rounded-b-3xl\">\n<div class=\"container mx-auto text-center\">\n<h1 class=\"text-4xl md:text-5xl font-bold mb-2\">DASHBOARD PENGIMBASAN<\/h1>\n<h2 class=\"text-2xl md:text-3xl font-light\">Digitalisasi Sekolah SMAN 66 Jakarta<\/h2>\n<p class=\"mt-4 text-lg\">Jumat, 10 Oktober 2025 | 13:00 &#8211; 15:00 WIB | Aula B<\/p>\n<\/p><\/div>\n<\/header>\n<p>    <!-- Main Content Grid --><br \/>\n    <main class=\"container mx-auto p-4 md:p-8\"><\/p>\n<div class=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8\">\n            <!-- Card CV --><\/p>\n<div class=\"card bg-white p-6 rounded-2xl shadow-md flex flex-col items-center text-center border-t-4 border-blue-500\">\n                <i data-lucide=\"user-circle-2\" class=\"w-16 h-16 text-blue-500 mb-4\"><\/i><\/p>\n<h3 class=\"text-xl font-bold text-gray-800 mb-2\">CV Narasumber<\/h3>\n<p class=\"text-gray-600\">Profil singkat narasumber kegiatan ini.<\/p>\n<\/p><\/div>\n<p>            <!-- Card Susunan Acara Pengimbasan --><\/p>\n<div class=\"card bg-white p-6 rounded-2xl shadow-md flex flex-col items-center text-center border-t-4 border-orange-500\">\n                <i data-lucide=\"clipboard-list\" class=\"w-16 h-16 text-orange-500 mb-4\"><\/i><\/p>\n<h3 class=\"text-xl font-bold text-gray-800 mb-2\">Acara Pengimbasan<\/h3>\n<p class=\"text-gray-600\">Rundown kegiatan pengimbasan hari ini.<\/p>\n<\/p><\/div>\n<p>            <!-- Card Sasaran Pengimbasan --><\/p>\n<div class=\"card bg-white p-6 rounded-2xl shadow-md flex flex-col items-center text-center border-t-4 border-purple-500\">\n                <i data-lucide=\"building-2\" class=\"w-16 h-16 text-purple-500 mb-4\"><\/i><\/p>\n<h3 class=\"text-xl font-bold text-gray-800 mb-2\">Sasaran Pengimbasan<\/h3>\n<p class=\"text-gray-600\">Daftar sekolah di Wilayah Jakarta Selatan 1.<\/p>\n<\/p><\/div>\n<p>            <!-- Card Agenda Bimtek --><\/p>\n<div class=\"card bg-white p-6 rounded-2xl shadow-md flex flex-col items-center text-center border-t-4 border-indigo-500\">\n                <i data-lucide=\"calendar-days\" class=\"w-16 h-16 text-indigo-500 mb-4\"><\/i><\/p>\n<h3 class=\"text-xl font-bold text-gray-800 mb-2\">Agenda Bimtek<\/h3>\n<p class=\"text-gray-600\">Susunan acara resmi dari kegiatan Bimtek.<\/p>\n<\/p><\/div>\n<p>            <!-- Card Surat Tugas --><\/p>\n<div class=\"card bg-white p-6 rounded-2xl shadow-md flex flex-col items-center text-center border-t-4 border-teal-500\">\n                <i data-lucide=\"file-text\" class=\"w-16 h-16 text-teal-500 mb-4\"><\/i><\/p>\n<h3 class=\"text-xl font-bold text-gray-800 mb-2\">Surat Tugas<\/h3>\n<p class=\"text-gray-600\">Dokumen resmi penugasan dari Dinas Pendidikan.<\/p>\n<\/p><\/div>\n<p>            <!-- Card Sumber Ajar --><\/p>\n<div class=\"card bg-white p-6 rounded-2xl shadow-md flex flex-col items-center text-center border-t-4 border-red-500\">\n                <i data-lucide=\"youtube\" class=\"w-16 h-16 text-red-500 mb-4\"><\/i><\/p>\n<h3 class=\"text-xl font-bold text-gray-800 mb-2\">Sumber Ajar<\/h3>\n<p class=\"text-gray-600\">Kumpulan video materi pendukung.<\/p>\n<\/p><\/div>\n<p>            <!-- Card Ice Breaking --><\/p>\n<div class=\"card bg-white p-6 rounded-2xl shadow-md flex flex-col items-center text-center border-t-4 border-yellow-500\">\n                <i data-lucide=\"puzzle\" class=\"w-16 h-16 text-yellow-500 mb-4\"><\/i><\/p>\n<h3 class=\"text-xl font-bold text-gray-800 mb-2\">Ice Breaking<\/h3>\n<p class=\"text-gray-600\">Permainan interaktif untuk mencairkan suasana.<\/p>\n<\/p><\/div>\n<p>            <!-- Card LMS --><\/p>\n<div class=\"card bg-white p-6 rounded-2xl shadow-md flex flex-col items-center text-center border-t-4 border-green-500\">\n                <i data-lucide=\"book-marked\" class=\"w-16 h-16 text-green-500 mb-4\"><\/i><\/p>\n<h3 class=\"text-xl font-bold text-gray-800 mb-2\">Link LMS<\/h3>\n<p class=\"text-gray-600\">Akses portal LMS beserta panduan login.<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<p>    <\/main><\/p>\n<p>    <!-- Modals Section --><br \/>\n    <!-- Modal CV --><\/p>\n<div id=\"modal-cv\" class=\"modal-backdrop fixed inset-0 bg-black bg-opacity-50 flex justify-center items-center p-4 modal-hidden\">\n<div class=\"modal-content bg-white rounded-lg shadow-xl w-full max-w-2xl overflow-y-auto p-6 relative\">\n<h2 class=\"text-2xl font-bold text-gray-800 mb-4 flex items-center\"><i data-lucide=\"user-circle-2\" class=\"mr-2 text-blue-500\"><\/i>Profil Narasumber<\/h2>\n<div class=\"border-t pt-4\">\n<h3 class=\"text-3xl font-bold text-gray-900\">Andri, A.Md Kom, S. Kom, Gr.<\/h3>\n<p class=\"text-xl text-blue-600 mt-1\">Guru Informatika SMAN 66 Jakarta<\/p>\n<div class=\"mt-4 space-y-2 text-gray-700\">\n<p><strong><i class=\"inline-block w-5\" data-lucide=\"sparkles\"><\/i>Keahlian:<\/strong> AI, Coding, Jaringan LAN\/WAN, Keamanan Siber.<\/p>\n<p><strong><i class=\"inline-block w-5\" data-lucide=\"graduation-cap\"><\/i>Pendidikan:<\/strong> S2 MMSI Univ. Gunadarma, S1 &amp; D3 Univ. Gunadarma, Akta IV &amp; Sertifikasi Guru UNJ.<\/p>\n<p><strong><i class=\"inline-block w-5\" data-lucide=\"briefcase\"><\/i>Pengalaman:<\/strong> Lebih dari 28 tahun pengalaman di bidang Jaringan, Internet, dan Pengembangan Web.<\/p>\n<\/p><\/div>\n<p class=\"mt-4 text-sm text-gray-500 italic\">&#8220;Mari bersama-sama kita akselerasi transformasi digital di dunia pendidikan untuk masa depan generasi penerus yang lebih cerah.&#8221;<\/p>\n<\/p><\/div>\n<p>            <button class=\"absolute top-4 right-4 text-gray-500 hover:text-gray-800\"><i data-lucide=\"x\" class=\"w-6 h-6\"><\/i><\/button>\n        <\/div>\n<\/p><\/div>\n<p>    <!-- Modal Susunan Acara Pengimbasan --><\/p>\n<div id=\"modal-susunan-pengimbasan\" class=\"modal-backdrop fixed inset-0 bg-black bg-opacity-50 flex justify-center items-center p-4 modal-hidden\">\n<div class=\"modal-content bg-white rounded-lg shadow-xl w-full max-w-2xl overflow-y-auto p-6 relative\">\n<h2 class=\"text-2xl font-bold text-gray-800 mb-4 flex items-center\"><i data-lucide=\"clipboard-list\" class=\"mr-2 text-orange-500\"><\/i>Susunan Acara Pengimbasan<\/h2>\n<div class=\"border-t pt-4 space-y-4\">\n<div class=\"flex items-start\">\n<div class=\"bg-orange-100 text-orange-600 font-bold rounded-lg px-3 py-1 mr-4\">13:00 &#8211; 13:10<\/div>\n<div>\n<h3 class=\"font-semibold text-gray-800\">Pembukaan &amp; Ice Breaking<\/h3>\n<p class=\"text-gray-600 text-sm\">Sambutan singkat dan pencairan suasana dengan permainan interaktif.<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"flex items-start\">\n<div class=\"bg-orange-100 text-orange-600 font-bold rounded-lg px-3 py-1 mr-4\">13:10 &#8211; 13:40<\/div>\n<div>\n<h3 class=\"font-semibold text-gray-800\">Sesi 1: AI &amp; Media Ajar Interaktif<\/h3>\n<p class=\"text-gray-600 text-sm\">Pengenalan Kecerdasan Artifisial dan pemanfaatannya dalam membuat media ajar yang menarik.<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"flex items-start\">\n<div class=\"bg-orange-100 text-orange-600 font-bold rounded-lg px-3 py-1 mr-4\">13:40 &#8211; 14:20<\/div>\n<div>\n<h3 class=\"font-semibold text-gray-800\">Sesi 2: Praktik Penggunaan Perangkat Digital<\/h3>\n<p class=\"text-gray-600 text-sm\">Eksplorasi dan praktik terbaik penggunaan Interactive Flat Panel (IFP) atau perangkat digital lainnya di kelas.<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"flex items-start\">\n<div class=\"bg-orange-100 text-orange-600 font-bold rounded-lg px-3 py-1 mr-4\">14:20 &#8211; 14:50<\/div>\n<div>\n<h3 class=\"font-semibold text-gray-800\">Sesi 3: Diskusi &amp; Rencana Tindak Lanjut<\/h3>\n<p class=\"text-gray-600 text-sm\">Diskusi kelompok, tanya jawab, dan penyusunan rencana implementasi di sekolah masing-masing.<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"flex items-start\">\n<div class=\"bg-orange-100 text-orange-600 font-bold rounded-lg px-3 py-1 mr-4\">14:50 &#8211; 15:00<\/div>\n<div>\n<h3 class=\"font-semibold text-gray-800\">Penutupan &amp; Refleksi<\/h3>\n<p class=\"text-gray-600 text-sm\">Kesimpulan, refleksi singkat, dan penutupan acara.<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p>            <button class=\"absolute top-4 right-4 text-gray-500 hover:text-gray-800\"><i data-lucide=\"x\" class=\"w-6 h-6\"><\/i><\/button>\n        <\/div>\n<\/p><\/div>\n<p>    <!-- Modal Pengimbasan --><\/p>\n<div id=\"modal-pengimbasan\" class=\"modal-backdrop fixed inset-0 bg-black bg-opacity-50 flex justify-center items-center p-4 modal-hidden\">\n<div class=\"modal-content bg-white rounded-lg shadow-xl w-full max-w-4xl overflow-y-auto p-6 relative\">\n<h2 class=\"text-2xl font-bold text-gray-800 mb-4 flex items-center\"><i data-lucide=\"building-2\" class=\"mr-2 text-purple-500\"><\/i>Daftar Sekolah Sasaran Pengimbasan JS 1<\/h2>\n<div class=\"space-y-4\">\n<div>\n<h3 class=\"font-bold text-lg text-purple-700\">Kecamatan Kebayoran Baru<\/h3>\n<ul class=\"list-disc list-inside text-gray-700 space-y-1 mt-1\">\n<li>SMAN 6: Jl. Mahakam I No.2 <a href=\"https:\/\/maps.google.com\/?q=SMAN+6+Jakarta\" target=\"_blank\" class=\"text-blue-500 hover:underline\">[Peta]<\/a><\/li>\n<li>SMAN 70: Jl. Bulungan No.1 <a href=\"https:\/\/maps.google.com\/?q=SMAN+70+Jakarta\" target=\"_blank\" class=\"text-blue-500 hover:underline\">[Peta]<\/a><\/li>\n<li>SMAN 82: Jl. Daha II No.15A <a href=\"https:\/\/maps.google.com\/?q=SMAN+82+Jakarta\" target=\"_blank\" class=\"text-blue-500 hover:underline\">[Peta]<\/a><\/li>\n<\/ul><\/div>\n<div>\n<h3 class=\"font-bold text-lg text-purple-700\">Kecamatan Cilandak<\/h3>\n<ul class=\"list-disc list-inside text-gray-700 space-y-1 mt-1\">\n<li>SMAN 28: Jl. R.M. Kahfi II <a href=\"https:\/\/maps.google.com\/?q=SMAN+28+Jakarta\" target=\"_blank\" class=\"text-blue-500 hover:underline\">[Peta]<\/a><\/li>\n<li>SMAN 34: Jl. Margasatwa No.1 <a href=\"https:\/\/maps.google.com\/?q=SMAN+34+Jakarta\" target=\"_blank\" class=\"text-blue-500 hover:underline\">[Peta]<\/a><\/li>\n<li>SMAN 66: Jl. Bango III <a href=\"https:\/\/maps.google.com\/?q=SMAN+66+Jakarta\" target=\"_blank\" class=\"text-blue-500 hover:underline\">[Peta]<\/a><\/li>\n<\/ul><\/div>\n<\/p><\/div>\n<p>            <button class=\"absolute top-4 right-4 text-gray-500 hover:text-gray-800\"><i data-lucide=\"x\" class=\"w-6 h-6\"><\/i><\/button>\n        <\/div>\n<\/p><\/div>\n<p>    <!-- Modal Agenda --><\/p>\n<div id=\"modal-agenda\" class=\"modal-backdrop fixed inset-0 bg-black bg-opacity-50 flex justify-center items-center p-4 modal-hidden\">\n<div class=\"modal-content bg-white rounded-lg shadow-xl w-full max-w-4xl overflow-y-auto p-6 relative flex flex-col\">\n<h2 class=\"text-2xl font-bold text-gray-800 mb-4 flex items-center\"><i data-lucide=\"calendar-days\" class=\"mr-2 text-indigo-500\"><\/i>Susunan Acara Bimtek<\/h2>\n<div class=\"flex-grow\"><\/div>\n<p>            <a href=\"https:\/\/drive.google.com\/uc?export=download&amp;id=1oiBdptZSOwH_ARwx-SXcET_Ou1i_RhI5\" target=\"_blank\" class=\"mt-4 inline-flex items-center justify-center w-full text-center bg-indigo-500 text-white font-bold py-3 px-6 rounded-lg hover:bg-indigo-600 transition duration-300\"><br \/>\n                <i data-lucide=\"download\" class=\"w-5 h-5 mr-2\"><\/i><br \/>\n                Unduh Susunan Acara (PDF)<br \/>\n            <\/a><br \/>\n            <button class=\"absolute top-4 right-4 text-gray-500 hover:text-gray-800\"><i data-lucide=\"x\" class=\"w-6 h-6\"><\/i><\/button>\n        <\/div>\n<\/p><\/div>\n<p>    <!-- Modal Surat Tugas --><\/p>\n<div id=\"modal-surat-tugas\" class=\"modal-backdrop fixed inset-0 bg-black bg-opacity-50 flex justify-center items-center p-4 modal-hidden\">\n<div class=\"modal-content bg-white rounded-lg shadow-xl w-full max-w-4xl overflow-y-auto p-6 relative flex flex-col\">\n<h2 class=\"text-2xl font-bold text-gray-800 mb-4 flex items-center\"><i data-lucide=\"file-text\" class=\"mr-2 text-teal-500\"><\/i>Surat Tugas<\/h2>\n<div class=\"flex-grow\"><\/div>\n<p>            <a href=\"https:\/\/drive.google.com\/uc?export=download&amp;id=1F3Y4hzXfD2BGJuOCZRBKGiedkNBluHPy\" target=\"_blank\" class=\"mt-4 inline-flex items-center justify-center w-full text-center bg-teal-500 text-white font-bold py-3 px-6 rounded-lg hover:bg-teal-600 transition duration-300\"><br \/>\n                <i data-lucide=\"download\" class=\"w-5 h-5 mr-2\"><\/i><br \/>\n                Unduh Surat Tugas (PDF)<br \/>\n            <\/a><br \/>\n            <button class=\"absolute top-4 right-4 text-gray-500 hover:text-gray-800\"><i data-lucide=\"x\" class=\"w-6 h-6\"><\/i><\/button>\n        <\/div>\n<\/p><\/div>\n<p>    <!-- Modal Sumber Ajar --><\/p>\n<div id=\"modal-sumber-ajar\" class=\"modal-backdrop fixed inset-0 bg-black bg-opacity-50 flex justify-center items-center p-4 modal-hidden\">\n<div class=\"modal-content bg-white rounded-lg shadow-xl w-full max-w-2xl overflow-y-auto p-6 relative\">\n<h2 class=\"text-2xl font-bold text-gray-800 mb-4 flex items-center\"><i data-lucide=\"youtube\" class=\"mr-2 text-red-500\"><\/i>Sumber Ajar Video<\/h2>\n<div class=\"space-y-3\">\n                <a href=\"https:\/\/www.youtube.com\/playlist?list=PLRnEYzlXJ1lEib9L-BEb9F6Bh2W0365_m\" target=\"_blank\" class=\"flex items-center p-3 bg-gray-100 rounded-lg hover:bg-red-100 transition\"><br \/>\n                    <i data-lucide=\"list-video\" class=\"w-6 h-6 text-red-600 mr-3\"><\/i><\/p>\n<div>\n<p class=\"font-semibold text-gray-800\">Bank Tutorial Media Ajar Interaktif (MAI)<\/p>\n<\/p><\/div>\n<p>                <\/a><br \/>\n                <a href=\"https:\/\/www.youtube.com\/watch?v=5ywIANLgvOg\" target=\"_blank\" class=\"flex items-center p-3 bg-gray-100 rounded-lg hover:bg-red-100 transition\"><br \/>\n                    <i data-lucide=\"lightbulb\" class=\"w-6 h-6 text-red-600 mr-3\"><\/i><\/p>\n<p class=\"font-semibold text-gray-800\">Konsep Pembelajaran Interaktif<\/p>\n<p>                <\/a>\n            <\/div>\n<p>            <button class=\"absolute top-4 right-4 text-gray-500 hover:text-gray-800\"><i data-lucide=\"x\" class=\"w-6 h-6\"><\/i><\/button>\n        <\/div>\n<\/p><\/div>\n<p>    <!-- Modal Ice Breaking --><\/p>\n<div id=\"modal-ice-breaking\" class=\"modal-backdrop fixed inset-0 bg-black bg-opacity-50 flex justify-center items-center p-4 modal-hidden\">\n<div class=\"modal-content bg-white rounded-lg shadow-xl w-full max-w-3xl overflow-y-auto p-6 relative\">\n<h2 class=\"text-2xl font-bold text-gray-800 mb-4 flex items-center\"><i data-lucide=\"puzzle\" class=\"mr-2 text-yellow-500\"><\/i>Ice Breaking Interaktif<\/h2>\n<div class=\"border-b border-gray-200\">\n<nav class=\"flex -mb-px space-x-6\">\n                    <button id=\"tab-tebak-gambar\" class=\"tab-button border-yellow-500 text-yellow-600 whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm\">Tebak Gambar AI<\/button><br \/>\n                    <button id=\"tab-polling\" class=\"tab-button border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300 whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm\">Polling Digital Cepat<\/button><br \/>\n                <\/nav>\n<\/p><\/div>\n<div class=\"mt-6\">\n                <!-- Game 1: Tebak Gambar AI --><\/p>\n<div id=\"content-tebak-gambar\" class=\"tab-content\">\n<p class=\"text-gray-600 mb-4\">Ajak peserta untuk mengasah imajinasi! Coba tebak, kira-kira prompt (perintah teks) apa yang digunakan untuk menghasilkan gambar unik di bawah ini?<\/p>\n<div class=\"bg-gray-200 rounded-lg p-4 flex justify-center items-center\">\n                        <img decoding=\"async\" src=\"https:\/\/placehold.co\/600x350\/1e3a8a\/ffffff?text=Kucing+Astronot+di+Bulan\" alt=\"Gambar AI: Kucing Astronot\" class=\"rounded-md shadow-lg\">\n                    <\/div>\n<div class=\"text-center mt-4\">\n                        <button class=\"bg-yellow-500 text-white font-bold py-2 px-6 rounded-lg hover:bg-yellow-600 transition duration-300\"><br \/>\n                            Lihat Jawaban<br \/>\n                        <\/button>\n                    <\/div>\n<div id=\"answer-1\" class=\"hidden mt-4 bg-green-100 border-l-4 border-green-500 text-green-700 p-4 rounded-md\">\n<p class=\"font-bold\">Prompt Jawaban:<\/p>\n<p class=\"italic\">&#8220;Seekor kucing astronot yang lucu dengan helm kaca, sedang duduk di permukaan bulan sambil melihat bumi di kejauhan, gaya lukisan cat minyak digital, detail tinggi.&#8221;<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<p>                <!-- Game 2: Polling Digital --><\/p>\n<div id=\"content-polling\" class=\"tab-content hidden\">\n<p class=\"text-gray-600 mb-4\">Ciptakan &#8216;Word Cloud&#8217; secara real-time untuk mengetahui pendapat peserta. Ini cara yang cepat, visual, dan sangat menarik!<\/p>\n<div class=\"flex flex-col md:flex-row gap-6\">\n<div class=\"flex-1\">\n<h3 class=\"font-semibold text-lg text-gray-800 mb-2\">Langkah-langkah:<\/h3>\n<ol class=\"list-decimal list-inside space-y-2 text-gray-700\">\n<li>Buka salah satu platform polling online:\n<ul class=\"list-disc list-inside ml-5 mt-1\">\n<li><a href=\"https:\/\/www.mentimeter.com\/\" target=\"_blank\" class=\"text-blue-500 hover:underline\">Mentimeter<\/a><\/li>\n<li><a href=\"https:\/\/www.sli.do\/\" target=\"_blank\" class=\"text-blue-500 hover:underline\">Slido<\/a><\/li>\n<\/ul>\n<\/li>\n<li>Buat pertanyaan singkat, contoh: &#8220;Satu kata yang menggambarkan Digitalisasi Sekolah?&#8221;<\/li>\n<li>Bagikan kode polling kepada para peserta.<\/li>\n<li>Saksikan kata-kata dari peserta membentuk &#8216;Word Cloud&#8217; secara langsung di layar!<\/li>\n<\/ol><\/div>\n<div class=\"flex-1\">\n<h3 class=\"font-semibold text-lg text-gray-800 mb-2\">Contoh Hasil:<\/h3>\n<div class=\"bg-gray-200 rounded-lg p-4 flex justify-center items-center\">\n                                <img decoding=\"async\" src=\"https:\/\/placehold.co\/600x350\/EEEEEE\/333333?text=Contoh+Word+Cloud\" alt=\"Contoh Word Cloud\" class=\"rounded-md shadow-lg\">\n                            <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p>            <button class=\"absolute top-4 right-4 text-gray-500 hover:text-gray-800\"><i data-lucide=\"x\" class=\"w-6 h-6\"><\/i><\/button>\n        <\/div>\n<\/p><\/div>\n<p>    <!-- Modal LMS --><\/p>\n<div id=\"modal-lms\" class=\"modal-backdrop fixed inset-0 bg-black bg-opacity-50 flex justify-center items-center p-4 modal-hidden\">\n<div class=\"modal-content bg-white rounded-lg shadow-xl w-full max-w-2xl overflow-y-auto p-6 relative\">\n<h2 class=\"text-2xl font-bold text-gray-800 mb-4 flex items-center\"><i data-lucide=\"book-marked\" class=\"mr-2 text-green-500\"><\/i>Portal LMS Kemendikbud<\/h2>\n<div class=\"space-y-4\">\n<div>\n<h3 class=\"font-semibold text-lg\">Panduan Login Peserta<\/h3>\n<ol class=\"list-decimal list-inside mt-2 p-4 bg-gray-100 rounded-lg\">\n<li>Gunakan NPSN sekolah sebagai <strong>Username<\/strong>.<\/li>\n<li>Gunakan NPSN + &#8220;SMArt&#8221; sebagai <strong>Password<\/strong>. (Contoh: 20102222SMArt)<\/li>\n<\/ol><\/div>\n<p>                <a href=\"https:\/\/sarpras-sma.kemendikdasmen.go.id\/smart\/mod\/page\/view.php?id=165&amp;forceview=1\" target=\"_blank\" class=\"mt-4 inline-block w-full text-center bg-green-500 text-white font-bold py-3 px-6 rounded-lg hover:bg-green-600 transition duration-300\"><br \/>\n                    Buka Portal LMS<br \/>\n                <\/a>\n            <\/div>\n<p>            <button class=\"absolute top-4 right-4 text-gray-500 hover:text-gray-800\"><i data-lucide=\"x\" class=\"w-6 h-6\"><\/i><\/button>\n        <\/div>\n<\/p><\/div>\n<p>    <!-- Footer --><\/p>\n<footer class=\"text-center p-6 mt-8 text-gray-600\">\n<p>Disiapkan oleh Andri, S.Kom, Gr. untuk Pengimbasan Digitalisasi Sekolah SMAN 66 Jakarta &copy; 2025<\/p>\n<\/footer>\n<p>        lucide.createIcons();<\/p>\n<p>        function openModal(modalId) {<br \/>\n            const modal = document.getElementById(modalId);<br \/>\n            if (modal) {<br \/>\n                modal.classList.remove(&#8216;modal-hidden&#8217;);<br \/>\n                document.body.style.overflow = &#8216;hidden&#8217;;<br \/>\n            }<br \/>\n        }<\/p>\n<p>        function closeModal(modalId) {<br \/>\n            const modal = document.getElementById(modalId);<br \/>\n            if (modal) {<br \/>\n                modal.classList.add(&#8216;modal-hidden&#8217;);<br \/>\n                 document.body.style.overflow = &#8216;auto&#8217;;<br \/>\n            }<br \/>\n        }<\/p>\n<p>        window.addEventListener(&#8216;keydown&#8217;, (e) =&gt; {<br \/>\n            if (e.key === &#8216;Escape&#8217;) {<br \/>\n                document.querySelectorAll(&#8216;.modal-backdrop:not(.modal-hidden)&#8217;).forEach(modal =&gt; closeModal(modal.id));<br \/>\n            }<br \/>\n        });<\/p>\n<p>        document.querySelectorAll(&#8216;.modal-backdrop&#8217;).forEach(modal =&gt; {<br \/>\n            modal.addEventListener(&#8216;click&#8217;, (e) =&gt; {<br \/>\n                if (e.target === modal) closeModal(modal.id);<br \/>\n            });<br \/>\n        });<\/p>\n<p>        function switchTab(tabName) {<br \/>\n            document.querySelectorAll(&#8216;.tab-content&#8217;).forEach(content =&gt; {<br \/>\n                content.classList.add(&#8216;hidden&#8217;);<br \/>\n            });<br \/>\n            document.querySelectorAll(&#8216;.tab-button&#8217;).forEach(button =&gt; {<br \/>\n                button.classList.remove(&#8216;border-yellow-500&#8217;, &#8216;text-yellow-600&#8217;);<br \/>\n                button.classList.add(&#8216;border-transparent&#8217;, &#8216;text-gray-500&#8217;, &#8216;hover:text-gray-700&#8217;, &#8216;hover:border-gray-300&#8217;);<br \/>\n            });<br \/>\n            document.getElementById(`content-${tabName}`).classList.remove(&#8216;hidden&#8217;);<br \/>\n            const activeButton = document.getElementById(`tab-${tabName}`);<br \/>\n            activeButton.classList.add(&#8216;border-yellow-500&#8217;, &#8216;text-yellow-600&#8217;);<br \/>\n            activeButton.classList.remove(&#8216;border-transparent&#8217;, &#8216;text-gray-500&#8217;, &#8216;hover:text-gray-700&#8217;, &#8216;hover:border-gray-300&#8217;);<br \/>\n        }<\/p>\n<p>        function toggleAnswer(answerId) {<br \/>\n            const answerEl = document.getElementById(answerId);<br \/>\n            if (answerEl) {<br \/>\n                answerEl.classList.toggle(&#8216;hidden&#8217;);<br \/>\n            }<br \/>\n        }<\/p>\n","protected":false},"excerpt":{"rendered":"<p>body { font-family: &#8216;Poppins&#8217;, sans-serif; background-color: #f0f4f8; } .bg-gradient-header { background-image: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 50%, #2563eb 100%); } .card { transition: transform 0.3s ease, box-shadow 0.3s ease; cursor: pointer; } .card:hover { transform: translateY(-10px); box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); } .modal-backdrop { transition: opacity 0.3s ease-in-out; } .modal-content { transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out; max-height: 90vh; } .modal-hidden { pointer-events: none; opacity: 0; } .modal-hidden .modal-content { transform: translateY(-50px); opacity: 0; } .pdf-viewer { width: 100%; height: 60vh; border-radius: 0.5rem; } DASHBOARD PENGIMBASAN Digitalisasi Sekolah SMAN 66 Jakarta Jumat, 10 Oktober 2025 | 13:00 &#8211; 15:00 WIB | Aula B CV Narasumber Profil singkat narasumber kegiatan ini. Acara Pengimbasan Rundown kegiatan pengimbasan hari ini. Sasaran Pengimbasan Daftar sekolah di Wilayah Jakarta Selatan 1. Agenda Bimtek Susunan acara resmi dari kegiatan Bimtek. Surat Tugas Dokumen resmi penugasan dari Dinas Pendidikan. Sumber Ajar Kumpulan video materi pendukung. Ice Breaking Permainan interaktif untuk mencairkan suasana. Link LMS Akses portal LMS beserta panduan login. Profil Narasumber Andri, A.Md Kom, S. Kom, Gr. Guru Informatika SMAN 66 Jakarta Keahlian: AI, Coding, Jaringan LAN\/WAN, Keamanan Siber. Pendidikan: S2 MMSI Univ. Gunadarma, [&hellip;]<\/p>\n","protected":false},"author":5,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0},"categories":[1],"tags":[],"class_list":["post-8713","post","type-post","status-publish","format-standard","hentry","category-blog"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/kegiatanbelajardanmengajar.id\/index.php\/wp-json\/wp\/v2\/posts\/8713","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kegiatanbelajardanmengajar.id\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kegiatanbelajardanmengajar.id\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kegiatanbelajardanmengajar.id\/index.php\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/kegiatanbelajardanmengajar.id\/index.php\/wp-json\/wp\/v2\/comments?post=8713"}],"version-history":[{"count":3,"href":"https:\/\/kegiatanbelajardanmengajar.id\/index.php\/wp-json\/wp\/v2\/posts\/8713\/revisions"}],"predecessor-version":[{"id":8715,"href":"https:\/\/kegiatanbelajardanmengajar.id\/index.php\/wp-json\/wp\/v2\/posts\/8713\/revisions\/8715"}],"wp:attachment":[{"href":"https:\/\/kegiatanbelajardanmengajar.id\/index.php\/wp-json\/wp\/v2\/media?parent=8713"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kegiatanbelajardanmengajar.id\/index.php\/wp-json\/wp\/v2\/categories?post=8713"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kegiatanbelajardanmengajar.id\/index.php\/wp-json\/wp\/v2\/tags?post=8713"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}