Kalender Jawa & Hijriyah Real-Time<\/title>\n <style>\n body {\n font-family: 'Segoe UI', sans-serif;\n background: linear-gradient(135deg, #74ebd5, #ACB6E5);\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100vh;\n margin: 0;\n }\n .card {\n background: #fff;\n padding: 30px 40px;\n border-radius: 18px;\n box-shadow: 0 8px 25px rgba(0,0,0,0.15);\n text-align: center;\n transition: transform 0.3s ease;\n }\n .card:hover { transform: scale(1.05); }\n .day { font-size: 28px; font-weight: 600; color: #333; }\n .date { font-size: 20px; color: #555; margin: 1px 0; }\n .clock { font-size: 48px; font-weight: bold; color: #2575fc; text-shadow: 0 0 1px rgba(37,117,252,0.6); }\n .hijri { font-size: 20px; font-weight: 600; color: #009688; margin-top: 1px; }\n .neptu { font-size: 22px; font-weight: 600; color: #d35400; margin-top: 1px; }\n <\/style>\n<\/head>\n<body>\n <div class=\"card\">\n \n <div class=\"day\" id=\"day\"><\/div>\n <div class=\"neptu\" id=\"neptu\"><\/div>\n <div class=\"date\" id=\"date\"><\/div>\n <div class=\"hijri\" id=\"hijri\"><\/div>\n <div class=\"clock\" id=\"clock\"><\/div>\n <\/div>\n\n <script>\n function updateTime() {\n const now = new Date();\n const days = ['Ahad','Senin','Selasa','Rabu','Kamis','Jumat','Sabtu'];\n const months = ['Januari','Februari','Maret','April','Mei','Juni',\n 'Juli','Agustus','September','Oktober','November','Desember'];\n\n \/\/ Pasaran Jawa (5 hari)\n const pasaran = ['Kliwon','Legi','Pahing','Pon','Wage'];\n\n \/\/ 1. Hitung 00:00 WIB hari ini (lokal)\n const localMidnight = new Date(\n now.getFullYear(),\n now.getMonth(),\n now.getDate(),\n 0, 0, 0\n );\n const millisecondsPerDay = 86400000;\n const dayCount = Math.floor(localMidnight.getTime() \/ millisecondsPerDay);\n\n \/\/ 2. Hitung pasaranIndex berdasarkan hari (0\u20134)\n const pasaranIndex = dayCount % 5;\n const pasaranName = pasaran[pasaranIndex];\n\n \/\/ Hari + Pasaran\n const hariName = days[now.getDay()];\n document.getElementById('day').textContent = hariName + \" \" + pasaranName;\n\n \/\/ Kalender Masehi\n document.getElementById('date').textContent = \n `${now.getDate()} ${months[now.getMonth()]} ${now.getFullYear()}`;\n\n \/\/ Jam digital\n let h = String(now.getHours()).padStart(2,'0');\n let m = String(now.getMinutes()).padStart(2,'0');\n let s = String(now.getSeconds()).padStart(2,'0');\n document.getElementById('clock').textContent = `${h}:${m}:${s}`;\n\n \/\/ Hitungan Neptu\n const neptuHari = [5,4,3,7,8,6,9]; \/\/ Ahad-Sabtu\n const neptuPasaran = [8,5,9,7,4]; \/\/ Kliwon-Wage\n const nilaiHari = neptuHari[now.getDay()];\n const nilaiPasaran = neptuPasaran[pasaranIndex];\n const totalNeptu = nilaiHari + nilaiPasaran;\n document.getElementById('neptu').textContent = \n `${nilaiHari} + ${nilaiPasaran} = ${totalNeptu}`;\n }\n\n \/\/ Ambil kalender Hijriyah dari API global (Aladhan)\n async function updateHijri() {\n const now = new Date();\n const day = now.getDate();\n const month = now.getMonth() + 1;\n const year = now.getFullYear();\n\n const lat = -7.2575; \/\/ Gresik\n const lng = 112.7521; \/\/ Gresik\n\n try {\n const response = await fetch(\n `https:\/\/api.aladhan.com\/v1\/gToH?date=${day}-${month}-${year}&latitude=${lat}&longitude=${lng}&method=2`\n );\n const data = await response.json();\n const hijriDate = data.data.hijri.day + \" \" + data.data.hijri.month.en + \" \" + data.data.hijri.year + \" H\";\n\n document.getElementById('hijri').textContent = hijriDate;\n } catch (err) {\n document.getElementById('hijri').textContent = \"Gagal ambil hijriah\";\n console.error(err);\n }\n }\n\n \/\/ Update setiap detik\n setInterval(() => { updateTime(); updateHijri(); }, 1000);\n updateTime();\n updateHijri();\n <\/script>\n<\/body>\n<\/html>\n\n\n\n\n\n<!DOCTYPE html>\n<html lang=\"id\">\n<head>\n <meta charset=\"UTF-8\">\n <title>Button Modern<\/title>\n <style>\n body {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n background: #f5f7fa;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100vh;\n }\n\n .modern-button {\n display: inline-flex;\n align-items: center;\n gap: 10px;\n padding: 14px 28px;\n background: linear-gradient(135deg, #4facfe, #00f2fe);\n color: #fff;\n font-size: 18px;\n font-weight: 600;\n text-decoration: none;\n border-radius: 12px;\n box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);\n transition: all 0.3s ease;\n position: relative;\n overflow: hidden;\n }\n\n .modern-button:hover {\n transform: translateY(-3px) scale(1.05);\n box-shadow: 0 10px 20px rgba(0, 0, 0, 0.25);\n background: linear-gradient(135deg, #43e97b, #38f9d7);\n }\n\n .modern-button::after {\n content: '';\n position: absolute;\n top: 0;\n left: -100%;\n width: 100%;\n height: 100%;\n background: rgba(255, 255, 255, 0.2);\n transition: left 0.4s ease;\n }\n\n .modern-button:hover::after {\n left: 100%;\n }\n\n .modern-button svg {\n width: 22px;\n height: 22px;\n fill: #fff;\n transition: transform 0.3s ease;\n }\n\n .modern-button:hover svg {\n transform: rotate(20deg);\n }\n <\/style>\n<\/head>\n<body>\n <a class=\"modern-button\" href=\"https:\/\/kuliah.online-mr.com\/\" target=\"_blank\">\n \n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\">\n <path d=\"M14 3h7v7h-2V6.41l-9.29 9.3-1.42-1.42 9.3-9.29H14V3zM5 5h5V3H5c-1.1 \n 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 \n 0 2-.9 2-2v-5h-2v5H5V5z\"\/>\n <\/svg>\n kuliah.online-mr.com\n <\/a>\n<\/body>\n<\/html>\n\n\n\n<!DOCTYPE html>\n<html lang=\"id\">\n<head>\n <meta charset=\"UTF-8\">\n <title>Button Mahasiswa<\/title>\n <style>\n body {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n background: #eef2f7;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100vh;\n }\n\n .modern-button {\n display: inline-flex;\n align-items: center;\n gap: 10px;\n padding: 14px 28px;\n background: linear-gradient(135deg, #ff6a00, #ee0979);\n color: #fff;\n font-size: 18px;\n font-weight: 600;\n text-decoration: none;\n border-radius: 12px;\n box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);\n transition: all 0.3s ease;\n position: relative;\n overflow: hidden;\n }\n\n .modern-button:hover {\n transform: translateY(-3px) scale(1.05);\n box-shadow: 0 10px 20px rgba(0, 0, 0, 0.25);\n background: linear-gradient(135deg, #00c6ff, #0072ff);\n }\n\n .modern-button::after {\n content: '';\n position: absolute;\n top: 0;\n left: -100%;\n width: 100%;\n height: 100%;\n background: rgba(255, 255, 255, 0.2);\n transition: left 0.4s ease;\n }\n\n .modern-button:hover::after {\n left: 100%;\n }\n\n .modern-button svg {\n width: 22px;\n height: 22px;\n fill: #fff;\n transition: transform 0.3s ease;\n }\n\n .modern-button:hover svg {\n transform: rotate(20deg);\n }\n <\/style>\n<\/head>\n<body>\n <a class=\"modern-button\" href=\"https:\/\/mahasiswa.online-mr.com\/\" target=\"_blank\">\n \n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\">\n <path d=\"M12 2L1 7l11 5 9-4.09V17h2V7L12 2zm0 \n 13c-2.67 0-8 1.34-8 4v3h16v-3c0-2.66-5.33-4-8-4z\"\/>\n <\/svg>\n mahasiswa.online-mr.com\n <\/a>\n<\/body>\n<\/html>\n\n\n\n<!DOCTYPE html>\n<html lang=\"id\">\n<head>\n <meta charset=\"UTF-8\">\n <title>Button Syaifuddin<\/title>\n <style>\n body {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n background: #f0f4f8;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100vh;\n }\n\n .modern-button {\n display: inline-flex;\n align-items: center;\n gap: 10px;\n padding: 14px 30px;\n background: linear-gradient(135deg, #6a11cb, #2575fc);\n color: #fff;\n font-size: 18px;\n font-weight: 600;\n text-decoration: none;\n border-radius: 14px;\n box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);\n transition: all 0.3s ease;\n position: relative;\n overflow: hidden;\n }\n\n .modern-button:hover {\n transform: translateY(-3px) scale(1.05);\n box-shadow: 0 10px 20px rgba(0, 0, 0, 0.25);\n background: linear-gradient(135deg, #00b09b, #96c93d);\n }\n\n .modern-button::after {\n content: '';\n position: absolute;\n top: 0;\n left: -100%;\n width: 100%;\n height: 100%;\n background: rgba(255, 255, 255, 0.2);\n transition: left 0.4s ease;\n }\n\n .modern-button:hover::after {\n left: 100%;\n }\n\n .modern-button svg {\n width: 22px;\n height: 22px;\n fill: #fff;\n transition: transform 0.3s ease;\n }\n\n .modern-button:hover svg {\n transform: rotate(15deg);\n }\n <\/style>\n<\/head>\n<body>\n <a class=\"modern-button\" href=\"https:\/\/syaifuddin.online-mr.com\/\" target=\"_blank\">\n \n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\">\n <path d=\"M12 12c2.7 0 5-2.3 5-5s-2.3-5-5-5-5 \n 2.3-5 5 2.3 5 5 5zm0 2c-3.3 0-10 \n 1.7-10 5v3h20v-3c0-3.3-6.7-5-10-5z\"\/>\n <\/svg>\n syaifuddin.online-mr.com\n <\/a>\n<\/body>\n<\/html>\n\n\n\n<!DOCTYPE html>\n<html lang=\"id\">\n<head>\n <meta charset=\"UTF-8\">\n <title>Kenalan<\/title>\n <style>\n body {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n background: #f0f4f8;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100vh;\n }\n\n .modern-button {\n display: inline-flex;\n align-items: center;\n gap: 10px;\n padding: 14px 30px;\n background: linear-gradient(135deg, #6a11cb, #2575fc);\n color: #fff;\n font-size: 18px;\n font-weight: 600;\n text-decoration: none;\n border-radius: 14px;\n box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);\n transition: all 0.3s ease;\n position: relative;\n overflow: hidden;\n }\n\n .modern-button:hover {\n transform: translateY(-3px) scale(1.05);\n box-shadow: 0 10px 20px rgba(0, 0, 0, 0.25);\n background: linear-gradient(135deg, #00b09b, #96c93d);\n }\n\n .modern-button::after {\n content: '';\n position: absolute;\n top: 0;\n left: -100%;\n width: 100%;\n height: 100%;\n background: rgba(255, 255, 255, 0.2);\n transition: left 0.4s ease;\n }\n\n .modern-button:hover::after {\n left: 100%;\n }\n\n .modern-button svg {\n width: 22px;\n height: 22px;\n fill: #fff;\n transition: transform 0.3s ease;\n }\n\n .modern-button:hover svg {\n transform: rotate(15deg);\n }\n <\/style>\n<\/head>\n<body>\n <a class=\"modern-button\" href=\"https:\/\/online-mr.com\/?page_id=62\/\" target=\"_blank\">\n \n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\">\n <path d=\"M12 12c2.7 0 5-2.3 5-5s-2.3-5-5-5-5 \n 2.3-5 5 2.3 5 5 5zm0 2c-3.3 0-10 \n 1.7-10 5v3h20v-3c0-3.3-6.7-5-10-5z\"\/>\n <\/svg>\n Perkenalkan Diri\n <\/a>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Kalender Jawa & Hijriyah Real-Time Button Modern kuliah.online-mr.com Button Mahasiswa mahasiswa.online-mr.com Button Syaifuddin syaifuddin.online-mr.com Kenalan Perkenalkan Diri<\/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-5","page","type-page","status-publish","hentry"],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"_links":{"self":[{"href":"https:\/\/online-mr.com\/index.php?rest_route=\/wp\/v2\/pages\/5","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/online-mr.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/online-mr.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/online-mr.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/online-mr.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=5"}],"version-history":[{"count":29,"href":"https:\/\/online-mr.com\/index.php?rest_route=\/wp\/v2\/pages\/5\/revisions"}],"predecessor-version":[{"id":74,"href":"https:\/\/online-mr.com\/index.php?rest_route=\/wp\/v2\/pages\/5\/revisions\/74"}],"wp:attachment":[{"href":"https:\/\/online-mr.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=5"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":5,"date":"2026-03-22T15:01:49","date_gmt":"2026-03-22T15:01:49","guid":{"rendered":"https:\/\/online-mr.com\/?page_id=5"},"modified":"2026-04-08T10:34:16","modified_gmt":"2026-04-08T03:34:16","slug":"online-mr","status":"publish","type":"page","link":"https:\/\/online-mr.com\/","title":{"rendered":"Silahkan melanjutkan sesuai kebutuhan"},"content":{"rendered":"\n\n\n\n \n Kalender Jawa & Hijriyah Real-Time<\/title>\n <style>\n body {\n font-family: 'Segoe UI', sans-serif;\n background: linear-gradient(135deg, #74ebd5, #ACB6E5);\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100vh;\n margin: 0;\n }\n .card {\n background: #fff;\n padding: 30px 40px;\n border-radius: 18px;\n box-shadow: 0 8px 25px rgba(0,0,0,0.15);\n text-align: center;\n transition: transform 0.3s ease;\n }\n .card:hover { transform: scale(1.05); }\n .day { font-size: 28px; font-weight: 600; color: #333; }\n .date { font-size: 20px; color: #555; margin: 1px 0; }\n .clock { font-size: 48px; font-weight: bold; color: #2575fc; text-shadow: 0 0 1px rgba(37,117,252,0.6); }\n .hijri { font-size: 20px; font-weight: 600; color: #009688; margin-top: 1px; }\n .neptu { font-size: 22px; font-weight: 600; color: #d35400; margin-top: 1px; }\n <\/style>\n<\/head>\n<body>\n <div class=\"card\">\n \n <div class=\"day\" id=\"day\"><\/div>\n <div class=\"neptu\" id=\"neptu\"><\/div>\n <div class=\"date\" id=\"date\"><\/div>\n <div class=\"hijri\" id=\"hijri\"><\/div>\n <div class=\"clock\" id=\"clock\"><\/div>\n <\/div>\n\n <script>\n function updateTime() {\n const now = new Date();\n const days = ['Ahad','Senin','Selasa','Rabu','Kamis','Jumat','Sabtu'];\n const months = ['Januari','Februari','Maret','April','Mei','Juni',\n 'Juli','Agustus','September','Oktober','November','Desember'];\n\n \/\/ Pasaran Jawa (5 hari)\n const pasaran = ['Kliwon','Legi','Pahing','Pon','Wage'];\n\n \/\/ 1. Hitung 00:00 WIB hari ini (lokal)\n const localMidnight = new Date(\n now.getFullYear(),\n now.getMonth(),\n now.getDate(),\n 0, 0, 0\n );\n const millisecondsPerDay = 86400000;\n const dayCount = Math.floor(localMidnight.getTime() \/ millisecondsPerDay);\n\n \/\/ 2. Hitung pasaranIndex berdasarkan hari (0\u20134)\n const pasaranIndex = dayCount % 5;\n const pasaranName = pasaran[pasaranIndex];\n\n \/\/ Hari + Pasaran\n const hariName = days[now.getDay()];\n document.getElementById('day').textContent = hariName + \" \" + pasaranName;\n\n \/\/ Kalender Masehi\n document.getElementById('date').textContent = \n `${now.getDate()} ${months[now.getMonth()]} ${now.getFullYear()}`;\n\n \/\/ Jam digital\n let h = String(now.getHours()).padStart(2,'0');\n let m = String(now.getMinutes()).padStart(2,'0');\n let s = String(now.getSeconds()).padStart(2,'0');\n document.getElementById('clock').textContent = `${h}:${m}:${s}`;\n\n \/\/ Hitungan Neptu\n const neptuHari = [5,4,3,7,8,6,9]; \/\/ Ahad-Sabtu\n const neptuPasaran = [8,5,9,7,4]; \/\/ Kliwon-Wage\n const nilaiHari = neptuHari[now.getDay()];\n const nilaiPasaran = neptuPasaran[pasaranIndex];\n const totalNeptu = nilaiHari + nilaiPasaran;\n document.getElementById('neptu').textContent = \n `${nilaiHari} + ${nilaiPasaran} = ${totalNeptu}`;\n }\n\n \/\/ Ambil kalender Hijriyah dari API global (Aladhan)\n async function updateHijri() {\n const now = new Date();\n const day = now.getDate();\n const month = now.getMonth() + 1;\n const year = now.getFullYear();\n\n const lat = -7.2575; \/\/ Gresik\n const lng = 112.7521; \/\/ Gresik\n\n try {\n const response = await fetch(\n `https:\/\/api.aladhan.com\/v1\/gToH?date=${day}-${month}-${year}&latitude=${lat}&longitude=${lng}&method=2`\n );\n const data = await response.json();\n const hijriDate = data.data.hijri.day + \" \" + data.data.hijri.month.en + \" \" + data.data.hijri.year + \" H\";\n\n document.getElementById('hijri').textContent = hijriDate;\n } catch (err) {\n document.getElementById('hijri').textContent = \"Gagal ambil hijriah\";\n console.error(err);\n }\n }\n\n \/\/ Update setiap detik\n setInterval(() => { updateTime(); updateHijri(); }, 1000);\n updateTime();\n updateHijri();\n <\/script>\n<\/body>\n<\/html>\n\n\n\n\n\n<!DOCTYPE html>\n<html lang=\"id\">\n<head>\n <meta charset=\"UTF-8\">\n <title>Button Modern<\/title>\n <style>\n body {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n background: #f5f7fa;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100vh;\n }\n\n .modern-button {\n display: inline-flex;\n align-items: center;\n gap: 10px;\n padding: 14px 28px;\n background: linear-gradient(135deg, #4facfe, #00f2fe);\n color: #fff;\n font-size: 18px;\n font-weight: 600;\n text-decoration: none;\n border-radius: 12px;\n box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);\n transition: all 0.3s ease;\n position: relative;\n overflow: hidden;\n }\n\n .modern-button:hover {\n transform: translateY(-3px) scale(1.05);\n box-shadow: 0 10px 20px rgba(0, 0, 0, 0.25);\n background: linear-gradient(135deg, #43e97b, #38f9d7);\n }\n\n .modern-button::after {\n content: '';\n position: absolute;\n top: 0;\n left: -100%;\n width: 100%;\n height: 100%;\n background: rgba(255, 255, 255, 0.2);\n transition: left 0.4s ease;\n }\n\n .modern-button:hover::after {\n left: 100%;\n }\n\n .modern-button svg {\n width: 22px;\n height: 22px;\n fill: #fff;\n transition: transform 0.3s ease;\n }\n\n .modern-button:hover svg {\n transform: rotate(20deg);\n }\n <\/style>\n<\/head>\n<body>\n <a class=\"modern-button\" href=\"https:\/\/kuliah.online-mr.com\/\" target=\"_blank\">\n \n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\">\n <path d=\"M14 3h7v7h-2V6.41l-9.29 9.3-1.42-1.42 9.3-9.29H14V3zM5 5h5V3H5c-1.1 \n 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 \n 0 2-.9 2-2v-5h-2v5H5V5z\"\/>\n <\/svg>\n kuliah.online-mr.com\n <\/a>\n<\/body>\n<\/html>\n\n\n\n<!DOCTYPE html>\n<html lang=\"id\">\n<head>\n <meta charset=\"UTF-8\">\n <title>Button Mahasiswa<\/title>\n <style>\n body {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n background: #eef2f7;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100vh;\n }\n\n .modern-button {\n display: inline-flex;\n align-items: center;\n gap: 10px;\n padding: 14px 28px;\n background: linear-gradient(135deg, #ff6a00, #ee0979);\n color: #fff;\n font-size: 18px;\n font-weight: 600;\n text-decoration: none;\n border-radius: 12px;\n box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);\n transition: all 0.3s ease;\n position: relative;\n overflow: hidden;\n }\n\n .modern-button:hover {\n transform: translateY(-3px) scale(1.05);\n box-shadow: 0 10px 20px rgba(0, 0, 0, 0.25);\n background: linear-gradient(135deg, #00c6ff, #0072ff);\n }\n\n .modern-button::after {\n content: '';\n position: absolute;\n top: 0;\n left: -100%;\n width: 100%;\n height: 100%;\n background: rgba(255, 255, 255, 0.2);\n transition: left 0.4s ease;\n }\n\n .modern-button:hover::after {\n left: 100%;\n }\n\n .modern-button svg {\n width: 22px;\n height: 22px;\n fill: #fff;\n transition: transform 0.3s ease;\n }\n\n .modern-button:hover svg {\n transform: rotate(20deg);\n }\n <\/style>\n<\/head>\n<body>\n <a class=\"modern-button\" href=\"https:\/\/mahasiswa.online-mr.com\/\" target=\"_blank\">\n \n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\">\n <path d=\"M12 2L1 7l11 5 9-4.09V17h2V7L12 2zm0 \n 13c-2.67 0-8 1.34-8 4v3h16v-3c0-2.66-5.33-4-8-4z\"\/>\n <\/svg>\n mahasiswa.online-mr.com\n <\/a>\n<\/body>\n<\/html>\n\n\n\n<!DOCTYPE html>\n<html lang=\"id\">\n<head>\n <meta charset=\"UTF-8\">\n <title>Button Syaifuddin<\/title>\n <style>\n body {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n background: #f0f4f8;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100vh;\n }\n\n .modern-button {\n display: inline-flex;\n align-items: center;\n gap: 10px;\n padding: 14px 30px;\n background: linear-gradient(135deg, #6a11cb, #2575fc);\n color: #fff;\n font-size: 18px;\n font-weight: 600;\n text-decoration: none;\n border-radius: 14px;\n box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);\n transition: all 0.3s ease;\n position: relative;\n overflow: hidden;\n }\n\n .modern-button:hover {\n transform: translateY(-3px) scale(1.05);\n box-shadow: 0 10px 20px rgba(0, 0, 0, 0.25);\n background: linear-gradient(135deg, #00b09b, #96c93d);\n }\n\n .modern-button::after {\n content: '';\n position: absolute;\n top: 0;\n left: -100%;\n width: 100%;\n height: 100%;\n background: rgba(255, 255, 255, 0.2);\n transition: left 0.4s ease;\n }\n\n .modern-button:hover::after {\n left: 100%;\n }\n\n .modern-button svg {\n width: 22px;\n height: 22px;\n fill: #fff;\n transition: transform 0.3s ease;\n }\n\n .modern-button:hover svg {\n transform: rotate(15deg);\n }\n <\/style>\n<\/head>\n<body>\n <a class=\"modern-button\" href=\"https:\/\/syaifuddin.online-mr.com\/\" target=\"_blank\">\n \n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\">\n <path d=\"M12 12c2.7 0 5-2.3 5-5s-2.3-5-5-5-5 \n 2.3-5 5 2.3 5 5 5zm0 2c-3.3 0-10 \n 1.7-10 5v3h20v-3c0-3.3-6.7-5-10-5z\"\/>\n <\/svg>\n syaifuddin.online-mr.com\n <\/a>\n<\/body>\n<\/html>\n\n\n\n<!DOCTYPE html>\n<html lang=\"id\">\n<head>\n <meta charset=\"UTF-8\">\n <title>Kenalan<\/title>\n <style>\n body {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n background: #f0f4f8;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100vh;\n }\n\n .modern-button {\n display: inline-flex;\n align-items: center;\n gap: 10px;\n padding: 14px 30px;\n background: linear-gradient(135deg, #6a11cb, #2575fc);\n color: #fff;\n font-size: 18px;\n font-weight: 600;\n text-decoration: none;\n border-radius: 14px;\n box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);\n transition: all 0.3s ease;\n position: relative;\n overflow: hidden;\n }\n\n .modern-button:hover {\n transform: translateY(-3px) scale(1.05);\n box-shadow: 0 10px 20px rgba(0, 0, 0, 0.25);\n background: linear-gradient(135deg, #00b09b, #96c93d);\n }\n\n .modern-button::after {\n content: '';\n position: absolute;\n top: 0;\n left: -100%;\n width: 100%;\n height: 100%;\n background: rgba(255, 255, 255, 0.2);\n transition: left 0.4s ease;\n }\n\n .modern-button:hover::after {\n left: 100%;\n }\n\n .modern-button svg {\n width: 22px;\n height: 22px;\n fill: #fff;\n transition: transform 0.3s ease;\n }\n\n .modern-button:hover svg {\n transform: rotate(15deg);\n }\n <\/style>\n<\/head>\n<body>\n <a class=\"modern-button\" href=\"https:\/\/online-mr.com\/?page_id=62\/\" target=\"_blank\">\n \n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\">\n <path d=\"M12 12c2.7 0 5-2.3 5-5s-2.3-5-5-5-5 \n 2.3-5 5 2.3 5 5 5zm0 2c-3.3 0-10 \n 1.7-10 5v3h20v-3c0-3.3-6.7-5-10-5z\"\/>\n <\/svg>\n Perkenalkan Diri\n <\/a>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Kalender Jawa & Hijriyah Real-Time Button Modern kuliah.online-mr.com Button Mahasiswa mahasiswa.online-mr.com Button Syaifuddin syaifuddin.online-mr.com Kenalan Perkenalkan Diri<\/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-5","page","type-page","status-publish","hentry"],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"_links":{"self":[{"href":"https:\/\/online-mr.com\/index.php?rest_route=\/wp\/v2\/pages\/5","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/online-mr.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/online-mr.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/online-mr.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/online-mr.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=5"}],"version-history":[{"count":29,"href":"https:\/\/online-mr.com\/index.php?rest_route=\/wp\/v2\/pages\/5\/revisions"}],"predecessor-version":[{"id":74,"href":"https:\/\/online-mr.com\/index.php?rest_route=\/wp\/v2\/pages\/5\/revisions\/74"}],"wp:attachment":[{"href":"https:\/\/online-mr.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=5"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}