{"id":13441,"date":"2023-07-18T20:41:17","date_gmt":"2023-07-18T20:41:17","guid":{"rendered":"https:\/\/business.reobiztheme.com\/?page_id=13441"},"modified":"2026-01-22T08:38:34","modified_gmt":"2026-01-22T01:38:34","slug":"cerita-jaklingko-indonesia","status":"publish","type":"page","link":"https:\/\/devweb.jaklingko.co.id\/en\/cerita-jaklingko-indonesia\/","title":{"rendered":"JakLingko Indonesia Story"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"13441\" class=\"elementor elementor-13441\">\n\t\t\t\t<div class=\"elementor-element elementor-element-be750c2 e-flex e-con-boxed e-con e-parent\" data-id=\"be750c2\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7f965c1 elementor-widget elementor-widget-html\" data-id=\"7f965c1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"id\">\r\n<head>\r\n  <meta charset=\"UTF-8\">\r\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n  <title>Timeline JakLingko<\/title>\r\n  <style>\r\n\/* Import Gilroy Font *\/\r\n@import url('https:\/\/fonts.cdnfonts.com\/css\/gilroy-bold');\r\n\r\n\/* Container Timeline *\/\r\n.custom-timeline {\r\n  position: relative;\r\n  max-width: 1200px;\r\n  margin: 0 auto;\r\n  padding: 60px 20px;\r\n  background: #ffffff;\r\n  font-family: 'Gilroy', sans-serif;\r\n}\r\n\r\n\/* Garis Tengah Vertikal *\/\r\n.custom-timeline::after {\r\n  content: '';\r\n  position: absolute;\r\n  left: 50%;\r\n  top: 40px;\r\n  bottom: 40px;\r\n  width: 4px;\r\n  background: linear-gradient(180deg, #0062a2 0%, #38c398 50%, #0062a2 100%);\r\n  transform: translateX(-50%);\r\n  z-index: 1;\r\n  border-radius: 10px;\r\n  box-shadow: 0 0 20px rgba(0, 98, 162, 0.3);\r\n}\r\n\r\n\/* Timeline Item Container *\/\r\n.timeline-item {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  margin-bottom: 100px;\r\n  position: relative;\r\n}\r\n\r\n\/* Alternate Layout (Kiri-Kanan) *\/\r\n.timeline-item:nth-child(even) .timeline-content {\r\n  margin-left: auto;\r\n}\r\n\r\n.timeline-item:nth-child(odd) .timeline-content {\r\n  margin-right: auto;\r\n}\r\n\r\n\/* Dot\/Circle di Tengah *\/\r\n.timeline-dot {\r\n  position: absolute;\r\n  left: 50%;\r\n  top: 120px;\r\n  width: 24px;\r\n  height: 24px;\r\n  background: linear-gradient(135deg, #0062a2 0%, #38c398 100%);\r\n  border: 5px solid #ffffff;\r\n  border-radius: 50%;\r\n  transform: translateX(-50%);\r\n  box-shadow: 0 0 0 8px rgba(56, 195, 152, 0.2);\r\n  z-index: 3;\r\n  animation: pulse 2s infinite;\r\n}\r\n\r\n@keyframes pulse {\r\n  0%, 100% {\r\n    box-shadow: 0 0 0 8px rgba(56, 195, 152, 0.2);\r\n  }\r\n  50% {\r\n    box-shadow: 0 0 0 15px rgba(56, 195, 152, 0.1);\r\n  }\r\n}\r\n\r\n\/* Tahun Badge - Posisi Samping *\/\r\n.timeline-year {\r\n  position: absolute;\r\n  top: 50%;\r\n  transform: translateY(-50%);\r\n  background: linear-gradient(135deg, #0062a2 0%, #38c398 100%);\r\n  color: #ffffff;\r\n  padding: 20px 30px;\r\n  border-radius: 15px;\r\n  font-size: 18px;\r\n  font-weight: 700;\r\n  box-shadow: 0 8px 25px rgba(0, 98, 162, 0.4);\r\n  z-index: 3;\r\n  white-space: nowrap;\r\n  letter-spacing: 1px;\r\n  min-width: 200px;\r\n  text-align: center;\r\n  line-height: 1.4;\r\n}\r\n\r\n\/* Tahun di kanan untuk item ganjil (keterangan di kiri) *\/\r\n.timeline-item:nth-child(odd) .timeline-year {\r\n  left: 52%;\r\n  margin-left: 30px;\r\n}\r\n\r\n\/* Tahun di kiri untuk item genap (keterangan di kanan) *\/\r\n.timeline-item:nth-child(even) .timeline-year {\r\n  right: 52%;\r\n  margin-right: 30px;\r\n}\r\n\r\n\/* Content Card *\/\r\n.timeline-content {\r\n  width: 48%;\r\n  background: #ffffff;\r\n  border-radius: 20px;\r\n  box-shadow: 0 10px 40px rgba(0,0,0,0.1);\r\n  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);\r\n  z-index: 2;\r\n  overflow: hidden;\r\n  border: 2px solid transparent;\r\n}\r\n\r\n.timeline-content:hover {\r\n  transform: translateY(-10px) scale(1.02);\r\n  box-shadow: 0 20px 60px rgba(56, 195, 152, 0.3);\r\n  border-color: #38c398;\r\n}\r\n\r\n\/* Image Container *\/\r\n.timeline-image-wrapper {\r\n  width: 100%;\r\n  overflow: hidden;\r\n  position: relative;\r\n  background: #f8f9fa;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  padding: 25px;\r\n}\r\n\r\n.timeline-image {\r\n  width: auto;\r\n  height: 100%;\r\n  max-width: 100%;\r\n  object-fit: contain;\r\n  transition: transform 0.5s ease;\r\n}\r\n\r\n.timeline-content:hover .timeline-image {\r\n  transform: scale(1.05);\r\n}\r\n\r\n\/* Overlay Gradient *\/\r\n.timeline-image-wrapper::after {\r\n  display: none;\r\n}\r\n\r\n\/* Text Content *\/\r\n.timeline-text {\r\n  padding: 30px;\r\n}\r\n\r\n.timeline-content h3 {\r\n  font-size: 24px;\r\n  color: #0062a2;\r\n  margin-bottom: 15px;\r\n  font-weight: 700;\r\n  position: relative;\r\n  padding-bottom: 15px;\r\n}\r\n\r\n.timeline-content h3::after {\r\n  content: '';\r\n  position: absolute;\r\n  bottom: 0;\r\n  left: 0;\r\n  width: 60px;\r\n  height: 3px;\r\n  background: linear-gradient(90deg, #0062a2 0%, #38c398 100%);\r\n  border-radius: 10px;\r\n}\r\n\r\n.timeline-content p {\r\n  color: #666666;\r\n  line-height: 1.8;\r\n  margin-bottom: 15px;\r\n  text-align: justify;\r\n  font-size: 15px;\r\n}\r\n\r\n.timeline-content p:last-child {\r\n  margin-bottom: 0;\r\n}\r\n\r\n\/* Icon\/Number untuk setiap item *\/\r\n.timeline-number {\r\n  position: absolute;\r\n  left: 50%;\r\n  top: 70px;\r\n  transform: translateX(-50%);\r\n  width: 50px;\r\n  height: 50px;\r\n  background: linear-gradient(135deg, #0062a2 0%, #38c398 100%);\r\n  color: white;\r\n  border-radius: 50%;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  font-size: 20px;\r\n  font-weight: 700;\r\n  box-shadow: 0 5px 20px rgba(0, 98, 162, 0.4);\r\n  z-index: 3;\r\n}\r\n\r\n\/* Alternate gradient untuk item genap *\/\r\n.timeline-item:nth-child(even) .timeline-number {\r\n  background: linear-gradient(135deg, #38c398 0%, #0062a2 100%);\r\n}\r\n\r\n.timeline-item:nth-child(even) .timeline-year {\r\n  background: linear-gradient(135deg, #38c398 0%, #0062a2 100%);\r\n}\r\n\r\n.timeline-item:nth-child(even) .timeline-dot {\r\n  background: linear-gradient(135deg, #38c398 0%, #0062a2 100%);\r\n}\r\n\r\n\/* MOBILE RESPONSIVE *\/\r\n@media (max-width: 768px) {\r\n  .custom-timeline {\r\n    padding: 40px 15px;\r\n  }\r\n\r\n  .timeline-header h2 {\r\n    font-size: 28px;\r\n  }\r\n\r\n  .timeline-header p {\r\n    font-size: 14px;\r\n  }\r\n\r\n  .custom-timeline::after {\r\n    left: 30px;\r\n    top: 40px;\r\n  }\r\n  \r\n  .timeline-item {\r\n    flex-direction: column !important;\r\n    align-items: flex-start;\r\n    padding-left: 70px;\r\n    margin-bottom: 80px;\r\n  }\r\n  \r\n  .timeline-content {\r\n    width: 100% !important;\r\n    margin: 0 !important;\r\n  }\r\n  \r\n  .timeline-year {\r\n    left: 30px;\r\n    transform: translateX(-50%);\r\n    font-size: 12px;\r\n    padding: 10px 15px;\r\n    top: 10px;\r\n    min-width: auto;\r\n    margin: 0 !important;\r\n    right: auto !important;\r\n  }\r\n\r\n  .timeline-number {\r\n    left: 30px;\r\n    transform: translateX(-50%);\r\n    top: 60px;\r\n    width: 40px;\r\n    height: 40px;\r\n    font-size: 16px;\r\n  }\r\n  \r\n  .timeline-dot {\r\n    left: 30px;\r\n    transform: translateX(-50%);\r\n    top: 110px;\r\n    width: 20px;\r\n    height: 20px;\r\n  }\r\n\r\n  .timeline-image-wrapper {\r\n    height: 220px;\r\n    padding: 15px;\r\n  }\r\n\r\n  .timeline-text {\r\n    padding: 20px;\r\n  }\r\n\r\n  .timeline-content h3 {\r\n    font-size: 20px;\r\n  }\r\n\r\n  .timeline-content p {\r\n    font-size: 14px;\r\n  }\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .timeline-year {\r\n    font-size: 11px;\r\n    padding: 6px 12px;\r\n  }\r\n\r\n  .timeline-image-wrapper {\r\n    height: 150px;\r\n  }\r\n\r\n  .timeline-text {\r\n    padding: 15px;\r\n  }\r\n\r\n  .timeline-content h3 {\r\n    font-size: 18px;\r\n  }\r\n\r\n  .timeline-content p {\r\n    font-size: 13px;\r\n  }\r\n}\r\n  <\/style>\r\n<\/head>\r\n<body>\r\n\r\n<!-- Timeline HTML Structure -->\r\n<div class=\"custom-timeline\">\r\n  \r\n  <!-- Item 1: 2019 Maret - 2020 Juli -->\r\n  <div class=\"timeline-item\">\r\n    <div class=\"timeline-number\">1<\/div>\r\n    <div class=\"timeline-year\">2019 Maret -<br>2020 Juli<\/div>\r\n    <div class=\"timeline-dot\"><\/div>\r\n    <div class=\"timeline-content\">\r\n      <div class=\"timeline-image-wrapper\">\r\n        <img decoding=\"async\" src=\"https:\/\/devweb.jaklingko.co.id\/wp-content\/uploads\/2026\/01\/2560x1866-Cerita-JLI.png\" alt=\"Logo JakLingko\" class=\"timeline-image\">\r\n      <\/div>\r\n      <div class=\"timeline-text\">\r\n        <h3>Establishment of PT Jakarta Lingko Indonesia<\/h3>\r\n        <p>The establishment of PT Jakarta Lingko Indonesia was carried out through coordination between the Jakarta Provincial Government and the Central Government. This step resulted in the issuance of Regulation No. 63 of 2020, which focuses on developing an integrated cross-modal payment system in the Greater Jakarta area.<\/p>\r\n        <p>The initiative involves entities such as PT MRT Jakarta, Jakarta Propertindo, and Moda Integrasi Transjabodetabek (MITJ), a joint venture between KAI and PT MRT Jakarta. This collaboration resulted in the establishment of PT Jaklingko Indonesia, as part of an effort to improve the efficiency of the transportation and cross-modal payment system in the Greater Jakarta area.<\/p>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n  \r\n  <!-- Item 2: 2020 Desember -->\r\n  <div class=\"timeline-item\">\r\n    <div class=\"timeline-number\">2<\/div>\r\n    <div class=\"timeline-year\">2020 Desember<\/div>\r\n    <div class=\"timeline-dot\"><\/div>\r\n    <div class=\"timeline-content\">\r\n      <div class=\"timeline-image-wrapper\">\r\n        <img decoding=\"async\" src=\"https:\/\/devweb.jaklingko.co.id\/wp-content\/uploads\/2026\/01\/2560x1866-Cerita-JLI-2.png\" alt=\"Kampanye Menghubungkan\" class=\"timeline-image\">\r\n      <\/div>\r\n      <div class=\"timeline-text\">\r\n        <h3>Ticket Purchase System Integration<\/h3>\r\n        <p>PT Jakarta Lingko Indonesia officially launched an integrated ticketing system for various public transportation modes, including commuter trains (KRL), Transjakarta, Jakarta LRT, Jakarta MRT, and others. Our initiative extends further, including providing optimal route recommendations to facilitate smooth public mobility, as well as integrating fares across various public transportation modes throughout the Greater Jakarta area.<\/p>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n  \r\n  <!-- Item 3: 2021 September -->\r\n  <div class=\"timeline-item\">\r\n    <div class=\"timeline-number\">3<\/div>\r\n    <div class=\"timeline-year\">2021 September<\/div>\r\n    <div class=\"timeline-dot\"><\/div>\r\n    <div class=\"timeline-content\">\r\n      <div class=\"timeline-image-wrapper\">\r\n        <img decoding=\"async\" src=\"https:\/\/devweb.jaklingko.co.id\/wp-content\/uploads\/2026\/01\/2560x1866-Cerita-JLI-3.png\" alt=\"Aplikasi Mobile JakLingko\" class=\"timeline-image\">\r\n      <\/div>\r\n      <div class=\"timeline-text\">\r\n        <h3>Mobile Application Launch<\/h3>\r\n        <p>On September 29, 2021, a milestone in the development of modern transportation systems in the Greater Jakarta area was marked with the official launch of an innovative mobile application and the upgrade of the electronic money card system to become a standard system.<\/p>\r\n        <p>Through the launched mobile application, people now have easier and faster access to planning trips, knowing transportation schedules, and managing payments efficiently.<\/p>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n  \r\n  <!-- Item 4: Sekarang -->\r\n  <div class=\"timeline-item\">\r\n    <div class=\"timeline-number\">4<\/div>\r\n    <div class=\"timeline-year\">Now<\/div>\r\n    <div class=\"timeline-dot\"><\/div>\r\n    <div class=\"timeline-content\">\r\n      <div class=\"timeline-image-wrapper\">\r\n        <img decoding=\"async\" src=\"https:\/\/devweb.jaklingko.co.id\/wp-content\/uploads\/2026\/01\/2560x1866-Cerita-JLI-4.png\" alt=\"Sistem Tap Kartu JakLingko\" class=\"timeline-image\">\r\n      <\/div>\r\n      <div class=\"timeline-text\">\r\n        <h3>DKI Jakarta Government Program<\/h3>\r\n        <p>The Jakarta government introduced the Jakarta government's program to the public through Governor's Decree (Kepgub) Number 733 of 2022, which detailed the tariff packages for mass public transportation services. One key point in this Decree is the establishment of an integrated tariff of 10,000 rupiah, effective Thursday, August 11, 2022.<\/p>\r\n        <p>This integrated fare applies when using more than one mode of public transportation in Jakarta, including the Jakarta MRT, Jakarta LRT, and TransJakarta, allowing passengers to explore across modes at an affordable rate, halving the normal total price. This provision applies when using more than one mode of mass public transportation, such as a combination of the Jakarta MRT, Jakarta LRT, and TransJakarta.<\/p>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n  \r\n<\/div>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Timeline JakLingko 1 2019 Maret &#8211;2020 Juli Pendirian PT Jakarta Lingko Indonesia Proses pendirian PT Jakarta Lingko Indonesia dilakukan melalui koordinasi antara Pemerintah Provinsi DKI Jakarta dan Pemerintah Pusat. Langkah ini menghasilkan peraturan dari Pemerintah Provinsi DKI Jakarta, yaitu Peraturan No. 63 tahun 2020. Peraturan ini memiliki fokus pada pengembangan sistem integrasi pembayaran lintas moda&#8230;<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-13441","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/devweb.jaklingko.co.id\/en\/wp-json\/wp\/v2\/pages\/13441","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devweb.jaklingko.co.id\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/devweb.jaklingko.co.id\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/devweb.jaklingko.co.id\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/devweb.jaklingko.co.id\/en\/wp-json\/wp\/v2\/comments?post=13441"}],"version-history":[{"count":86,"href":"https:\/\/devweb.jaklingko.co.id\/en\/wp-json\/wp\/v2\/pages\/13441\/revisions"}],"predecessor-version":[{"id":17326,"href":"https:\/\/devweb.jaklingko.co.id\/en\/wp-json\/wp\/v2\/pages\/13441\/revisions\/17326"}],"wp:attachment":[{"href":"https:\/\/devweb.jaklingko.co.id\/en\/wp-json\/wp\/v2\/media?parent=13441"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}