SintangNews 2.0

Pengantar

Tentang tema

SintangNews adalah tema WordPress klasik (PHP + theme.json) untuk situs berita, majalah digital, dan portal berita daerah. Dikembangkan oleh Herry Kiswanto — Sintang Web Kreatif.

Versi 2.0 menulis ulang seluruh tampilan dengan satu pertimbangan utama: sebagian besar pembaca berita membuka situs dari HP. Karena itu navigasi, tombol bagikan, dan tata letak iklan dirancang untuk jempol lebih dulu, lalu diperluas untuk laptop dan desktop.

Pengantar

Sorotan fitur

Ringkasan apa saja yang sudah dikerjakan di versi 2.0.

Pengantar

Galeri tampilan

Semua gambar berikut adalah tangkapan layar tema yang berjalan dengan konten demo bawaan. Klik gambar untuk memperbesar.

contoh-portal.com

contoh-portal.com

contoh-portal.com

contoh-portal.com

contoh-portal.com

contoh-portal.com/jembatan-kedua…

contoh-portal.com/jembatan-kedua…

contoh-portal.com/category/nasional

contoh-portal.com — layar 1680 px

Geser ke samping untuk melihat semua tampilan HP.

contoh-portal.com

Pengantar

Spesifikasi

Informasi tema

Kebutuhan

Tata letak & tampilan

Fitur WordPress yang didukung

title-tag, post-thumbnails, custom-logo, automatic-feed-links, responsive-embeds, align-wide, editor-styles (huruf editor mengikuti tema), html5, customize-selective-refresh-widgets, komentar bersusun, dan terjemahan.

Ukuran & isi paket

Memulai

Instalasi

Pasang sebagai tema baru atau perbarui dari versi 1.5.x.

1. Siapkan file. Gunakan sintangnews-2.0.0.zip. Jangan ekstrak dulu bila memakai cara unggah lewat admin.
2. Unggah. Di wp-admin buka Tampilan → Tema → Tambah Baru → Unggah Tema, pilih ZIP, lalu klik Pasang Sekarang.
3. Aktifkan. Klik Aktifkan. Menu SintangNews dan Iklan muncul di sidebar admin.
4. Impor demo (opsional). Lanjut ke bagian Impor konten demo.

Memulai

Impor konten demo

Isi situs dengan berita, foto, contoh iklan, halaman, dan pengaturan beranda dalam satu klik — tanpa plugin tambahan dan tanpa koneksi internet.

wp-admin → SintangNews

1. Buka menu SintangNews, klik tab Konten Demo. Tab ini terbuka setelah lisensi diaktifkan.
2. Klik Impor Konten Demo dan tunggu sekitar 10 detik.
3. Buka situs: tampilan sama seperti galeri di atas.

Di Dashboard juga muncul tombol Buka Impor Demo selama situs masih hampir kosong.

Yang diimpor

• 33 berita di 10 kategori (termasuk 5 berita video YouTube), lengkap dengan kutipan, jumlah dibaca awal, dan 2 komentar contoh.
• 28 foto dari Wikimedia Commons beserta atribusi di keterangan foto (daftar kredit: demo/images/CREDITS.txt).
• 8 banner contoh “Ruang Iklan” di semua posisi iklan utama.
• 4 halaman: Tentang Kami, Redaksi, Kontak, Pedoman Media Siber, dan menu “Tentang”.
• Pengaturan blok berita daerah (“Sintang Hari Ini”).

Perilaku yang aman

• Tanggal berita dihitung mundur dari saat impor, jadi selalu tampil “15 menit lalu”, “2 jam lalu”, dan seterusnya.
• Mengimpor dua kali tidak membuat berita ganda. Halaman dan menu yang sudah ada tidak ditimpa.
• “Hello world!” dan “Sample Page” bawaan WordPress dipindah ke tempat sampah bila belum pernah diubah.
• Hapus Konten Demo hanya menghapus konten demo (berita, foto, halaman, banner, menu). Konten buatan Anda tidak tersentuh.

Memulai

Pengaturan awal

Lima langkah singkat agar situs siap dipakai.

1. Halaman depan. Pengaturan → Membaca: pilih Postingan terbaru Anda agar front-page.php (beranda berita) aktif. Disarankan membuat satu halaman kosong dan menjadikannya “Halaman pos” agar tautan Indeks berfungsi.
2. Permalink. Pengaturan → Permalink: pilih Nama postingan (diperlukan juga oleh ads.txt).
3. Zona waktu. Pengaturan → Umum: pilih zona waktu Indonesia. Tema menampilkan label WIB, WITA, atau WIT otomatis.
4. Menu. Lihat bagian Menu, widget & logo.
5. Pengaturan tema. Buka menu SintangNews untuk warna, blok beranda, tampilan artikel, dan iklan (lihat Pengaturan SintangNews).

Tag khusus yang dikenali tema

Memulai

Upgrade dari v1.5.x

Situs yang memakai versi 1.5.x bisa langsung diperbarui ke 2.0 tanpa kehilangan data penting.

Yang tetap terpakai

• Pengaturan warna, kode iklan lama (menjadi kode cadangan), dan opsi penghitung dibaca.
• Jumlah dibaca di setiap berita (data Terpopuler) — kunci _gk_views tidak berubah.
• Menu, widget kustom (Berita Terbaru, Pilihan Redaksi, Iklan/AdSense), dan tautan media sosial di Customizer.
• Tag breaking dan pilihan-redaksi, Open Graph, updater, dan kartu dashboard.

Yang berubah

1. Unggah sintangnews-2.0.0.zip lewat Tampilan → Tema → Tambah Baru → Unggah. WordPress menawarkan Ganti yang aktif dengan yang diunggah.
2. Buka menu SintangNews: periksa pengaturan baru (slider berita utama, blok berita daerah, blok kategori, tampilan artikel).
3. Buka menu Iklan dan pindahkan banner/kode iklan ke sistem baru bila diperlukan. Kode lama tetap berfungsi sebagai cadangan.

Panduan

Halaman beranda

Urutan blok di beranda, dari mana isinya diambil, dan di mana mengaturnya.

Slider berita utama

Berita utama bergeser dari kanan ke kiri tiap 6 detik. Gambar, label, judul, kutipan, dan info ikut bergeser. Pembaca bisa memakai panah, titik, atau menggeser jari. Slider berhenti saat kursor di atasnya dan tidak berputar otomatis bila pembaca meminta pengurangan animasi di perangkatnya.

Jumlah slide diatur di SintangNews → Beranda → Slider berita utama (1–10, bawaan 5). Isi 1 untuk berita utama tunggal tanpa slider.

Berita Terkini yang selalu terisi

Di desktop, kotak Berita Terkini diregangkan setinggi sidebar dan ruang kosongnya diisi otomatis dengan berita terkini berikutnya, sehingga kedua kolom berakhir sejajar. Di HP, pembaca memakai tombol “Muat lebih banyak”.

contoh-portal.com

Panduan

Halaman artikel

Dirancang untuk dibaca dari HP: huruf besar, lebar baca nyaman, dan tombol bagikan yang selalu terjangkau.

contoh-portal.com/jembatan-kedua…

Elemen artikel

Advertorial

Pedoman Pemberitaan Media Siber mewajibkan isi berbayar dibedakan dari berita. Cara menandainya:

• Centang Tandai sebagai Advertorial di kotak Advertorial pada editor berita, atau
• beri berita kategori/tag advertorial atau pariwara.

Hasilnya: label kuning “Advertorial” di daftar berita dan catatan di atas judul artikel yang menyatakan konten itu iklan/kerja sama berbayar.

wp-admin → Edit Post

Panduan

Sistem iklan

Semua banner dikelola dari menu Iklan. Setiap iklan dibuat seperti menulis berita: judul, gambar, link, posisi, dan masa tayang.

Peta posisi iklan

Menambah iklan

wp-admin → Iklan → Ubah Iklan

1. Buka Iklan → Tambah Iklan Baru.
2. Isi judul (hanya untuk Anda, mis. “Pemkab Sintang — HUT RI”).
3. Pilih posisi. Saran ukuran gambar muncul otomatis.
4. Pasang Gambar banner (desktop) di kotak sisi kanan, dan Gambar khusus HP (opsional).
5. Isi Link tujuan dan masa tayang.
6. Klik Terbitkan.

wp-admin → Iklan

Menonaktifkan atau menghapus iklan

• Nonaktifkan sementara (bisa ditayangkan lagi): buka Iklan, klik judul iklan, lalu di kotak Terbitkan klik Sunting di samping Status, pilih Konsep, klik OK, lalu Perbarui. Untuk menayangkan lagi, klik Terbitkan.
• Berhenti otomatis: isi tanggal Berakhir di Masa tayang. Iklan berhenti tampil sendiri setelah tanggal itu, cocok untuk kontrak iklan instansi.
• Hapus: di daftar Iklan, arahkan kursor ke judul iklan lalu klik Buang ke Tong Sampah. Bisa juga beberapa sekaligus: centang iklan, pilih Pindahkan ke Tong Sampah di Tindakan Massal, klik Terapkan.
• Contoh "Ruang Iklan" dari konten demo dihapus dengan cara yang sama, atau semuanya sekaligus lewat SintangNews → Konten Demo → Hapus Konten Demo (ikut menghapus berita & halaman demo; konten buatan Anda tetap aman).
• Ruang kosong hilang sendiri: bila suatu posisi tidak punya iklan aktif, ruangnya tidak ditampilkan sama sekali. Slider Utama tanpa iklan berarti bagian slider hilang dari halaman.
• Slider Utama hanya di beranda: hapus centang Slider Utama di SintangNews → tab Iklan bila tidak ingin slider tampil di semua halaman pada laptop/desktop.

Posisi & ukuran gambar yang disarankan

Gambar HP dipakai di layar lebih kecil dari 1024 px (HP dan tablet) agar tulisan di banner tetap terbaca. Setiap gambar iklan memuat atribut lebar/tinggi sehingga halaman tidak bergeser saat iklan termuat.

Slider Utama untuk iklan instansi & lembaga

Dirancang untuk iklan resmi pemerintah dan lembaga mitra. Lebarnya sama dengan lebar web, tingginya mengikuti gambar.

• Beberapa iklan di posisi Slider Utama otomatis menjadi slider: berganti tiap 5 detik, ada titik penanda, bisa digeser jari, dan berhenti saat disorot kursor. Urutan diatur di kolom Urutan (angka kecil tampil lebih dulu).
• Laptop/desktop: tampil di semua halaman (beranda, kategori, artikel, halaman statis) sehingga iklan tetap terlihat ke menu mana pun pembaca pergi. Bisa dimatikan di SintangNews → Iklan → Slider Utama.
• HP: hanya tampil di beranda agar tidak mengganggu pembaca.
• Hanya banner gambar. Kode AdSense yang dipasang di slider dilewati, karena iklan yang bergantian tersembunyi berisiko melanggar kebijakan jaringan iklan.

Iklan melayang kiri & kanan

Iklan vertikal di ruang kosong kiri dan kanan halaman yang tetap terlihat saat halaman di-scroll. Dipasang cukup dengan menempel kode iklan (mis. skrip Google AdSense).

1. Buka SintangNews → Iklan → Iklan melayang kiri & kanan.
2. Centang Aktifkan, pilih lebar (120/160/300 px).
3. Tempel kode di Kode iklan kiri dan/atau kanan.

Hanya tampil di layar yang cukup lebar agar tidak menutupi berita: mulai 1520 px (iklan 120), 1600 px (iklan 160), atau 1880 px (iklan 300). Di HP dan laptop kecil otomatis disembunyikan. Pembaca bisa menutupnya dengan tombol ×.

layar 1680 px

wp-admin → SintangNews → Iklan

Google AdSense & jaringan iklan lain

• Setiap iklan punya kotak Kode iklan. Tempel kode AdSense di sana sebagai pengganti gambar banner. Berlaku untuk semua posisi kecuali Slider Utama.
• Di iklan melayang, tempel kode langsung di kotak kode kiri/kanan.
• Iklan sela berita tetap termuat saat pembaca menekan “Muat lebih banyak” (skrip dijalankan ulang).
• ads.txt: isi di SintangNews → Iklan → ads.txt; tersedia di situsanda.com/ads.txt (perlu permalink selain “Polos”; jika file ads.txt fisik sudah ada di hosting, file itulah yang dipakai).
• Kode iklan cadangan (atas, tengah, bawah artikel, sidebar) di Pengaturan tetap berfungsi bila posisi yang sama belum punya iklan di menu Iklan.

Cara kerja & laporan

• Label. Setiap banner gambar diberi label “Iklan” dan tautan rel="sponsored noopener".
• Klik dicatat melalui tautan /?sn_iklan_klik=ID yang lalu mengarahkan ke link tujuan.
• Tayang dicatat saat iklan terlihat minimal 50% di layar pembaca (satu kali per muat halaman).
• CTR = klik ÷ tayang, tampil di daftar iklan. Bisa di-reset per iklan.
• Masa tayang memakai zona waktu situs. Iklan berstatus Terjadwal atau Berakhir tidak ditampilkan.
• Beberapa iklan di satu posisi (selain Slider Utama) tampil bergantian: sela berita bergiliran, posisi lain acak tiap muat halaman.
• Perangkat: tiap iklan bisa dibatasi untuk desktop saja atau HP & tablet saja.

Panduan

Video YouTube

Tampilkan video YouTube sebagai bagian dari berita, lengkap dengan thumbnail yang sesuai.

1. Buat berita seperti biasa (disarankan kategori Video).
2. Isi kotak “Video YouTube” di editor dengan tautan video. Format yang dikenali: youtube.com/watch?v=…, youtu.be/…, /embed/, /shorts/, dan /live/.
3. Terbitkan. Berita otomatis tampil di section Video beranda dan memutar video di bagian atas artikel.

Bila kotak dikosongkan, tema mencari tautan YouTube di isi berita saat disimpan.

contoh-portal.com

Perilaku

• Thumbnail: memakai gambar unggulan berita; bila tidak ada, memakai thumbnail resmi dari YouTube.
• Pemutar ringan: yang dimuat awal hanya gambar dan tombol putar. Iframe YouTube (domain youtube-nocookie.com) baru dibuat saat tombol ditekan, sehingga halaman tetap cepat.
• Di artikel: pemutar menggantikan foto utama. Berita video tanpa gambar unggulan tetap punya thumbnail di semua daftar.
• Section Video bisa dimatikan dan judulnya diganti di SintangNews → Beranda.

Panduan

Pengaturan SintangNews

Menu admin SintangNews menyimpan seluruh pengaturan tema, dibagi menjadi tab: Lisensi, Tampilan, Beranda, Tampilan Artikel, Iklan, dan Konten Demo. Satu tombol Simpan Pengaturan menyimpan isi semua tab sekaligus. Sebelum lisensi diaktifkan, tab pengaturan bisa dilihat tetapi terkunci.

wp-admin → SintangNews

wp-admin → SintangNews

wp-admin → SintangNews

Panduan

Menu, widget & logo

Lokasi menu

Logo

Tampilan → Sesuaikan → Identitas Situs → Logo. Bila tidak diunggah, tema menampilkan logo “SN” bawaan dengan nama situs (kata terakhir berwarna biru, mis. SintangNews).

Media sosial

Tampilan → Sesuaikan → Media Sosial SintangNews: Facebook, X, Instagram, YouTube, TikTok, dan saluran/grup WhatsApp. Ikon hanya tampil di footer bila tautannya diisi.

Area widget & widget kustom

• Sidebar Beranda & Artikel (sidebar-1): tampil di bawah Terpopuler.
• Footer (footer-1): hingga tiga kolom di bawah tautan footer.
• Widget kustom: SintangNews: Berita Terbaru, Pilihan Redaksi, dan Iklan / AdSense.

Panel Kategori & Cari (HP)

Di HP, tombol Kategori pada bar bawah membuka panel dari bawah layar berisi ikon kategori dan menu “Tentang”. Tombol Cari membuka kolom pencarian dari atas layar dengan topik populer (tag terbanyak). Panel bisa ditutup dengan tombol ×, mengetuk area gelap, atau tombol Esc.

Panduan

Dashboard admin

Tema menambahkan kartu Sintang Web Kreatif — Info & Layanan di bagian paling atas Dashboard.

wp-admin → Dashboard

• Versi tema dan status pembaruan (“Versi terbaru” atau “Pembaruan vX tersedia”).
• Info terbaru, promo, layanan, dan paket diambil dari server pengembang dan diperbarui otomatis tiap 12 jam. Bila server tidak bisa dihubungi, kartu tetap tampil dengan data bawaan.
• Tombol Konsultasi via WhatsApp membuka chat dengan pesan yang sudah terisi alamat situs.

Menu Iklan

Di sidebar admin tersedia menu Iklan (ikon megafon) untuk mengelola semua banner, dan menu SintangNews untuk pengaturan tema.

Teknis

SEO

Teknis

Performa

Teknis

Aksesibilitas

• Tautan “Langsung ke konten” (skip link) dan landmark HTML5 (header, nav, main, aside, footer).
• Label aria-label pada tombol ikon, slider (aria-roledescription="carousel"), tab, dan panel dialog (role="dialog", tutup dengan Esc).
• Indikator fokus yang jelas dan target sentuh berukuran nyaman (±40–44 px).
• Pembaca yang meminta pengurangan animasi (prefers-reduced-motion) tidak mendapat slider otomatis dan transisi.
• Mode gelap untuk kenyamanan membaca dan ukuran teks yang bisa diubah pembaca.

Teknis

Untuk pengembang

Struktur file

sintangnews/
├─ style.css            Header tema + seluruh gaya (awalan class "sn-")
├─ theme.json           Palet warna, huruf, lebar konten editor
├─ functions.php        Setup, enqueue, view counter, AJAX
├─ header.php  footer.php
├─ front-page.php       Beranda
├─ single.php  page.php  archive.php  search.php  404.php  index.php
├─ sidebar.php  searchform.php  comments.php
├─ template-parts/
│  ├─ item.php          Item daftar (judul + foto + kutipan)
│  ├─ card.php  pcard.php   Kartu & kartu tegak Pilihan Redaksi
│  ├─ breaking-news.php  popular.php
│  └─ bottom-nav.php  sheets.php    Bar bawah HP & panel Kategori/Cari
├─ inc/
│  ├─ ads.php           Menu Iklan, slider, melayang, klik/tayang, ads.txt, advertorial
│  ├─ video.php         Video YouTube & section Video
│  ├─ toc.php           Daftar isi otomatis
│  ├─ theme-settings.php  Menu pengaturan SintangNews
│  ├─ demo-import.php   Impor/hapus konten demo
│  ├─ template-tags.php  icon-functions.php  Helper tampilan & ikon SVG
│  ├─ customizer.php    Media sosial
│  ├─ open-graph.php    Open Graph & Twitter Card
│  ├─ widgets.php       3 widget kustom
│  ├─ dashboard-card.php  theme-updater.php
├─ assets/js/main.js    Semua interaksi (JavaScript murni)
├─ assets/css/editor.css  Gaya editor blok
└─ demo/                Data demo (JSON), foto, banner contoh, kredit foto

Data yang disimpan

Endpoint AJAX

Filter yang tersedia

// Paksa Open Graph tema mati/hidup (true = anggap ada plugin SEO)
add_filter( 'sintangnews_seo_plugin_active', '__return_true' );

// Ganti alamat info pembaruan tema
add_filter( 'sintangnews_update_endpoint', fn() => 'https://contoh.com/info.json' );

// Ganti sumber data kartu dashboard
add_filter( 'sintangnews_swk_feed', fn() => 'https://contoh.com/dashboard.json' );

Kustomisasi aman

• Gunakan tema anak (child theme) untuk mengubah gaya atau template; berkas di template-parts/ bisa ditimpa lewat get_template_part.
• Variabel desain ada di :root di style.css (--sn-accent, --sn-surface, --sn-ink, --sn-serif, dst.), termasuk varian mode gelap.
• Fungsi pembantu dapat dipakai di template: sintangnews_icon('wa'), sintangnews_thumb(), sintangnews_time_ago(), sintangnews_ad_slot('feed'), sintangnews_get_settings().
• Keluaran di-escape dan input disanitasi sesuai standar WordPress. Satu-satunya keluaran mentah adalah kode iklan, dan itu hanya diterima mentah bila disimpan oleh pengguna dengan hak unfiltered_html (selain itu dibersihkan).

Teknis

Pembaruan & dukungan

Pembaruan otomatis

Tema memeriksa versi terbaru ke server pengembang melalui mekanisme pembaruan bawaan WordPress (Update URI). Bila versi di server lebih tinggi, WordPress menampilkan pemberitahuan di Dashboard → Pembaruan dan Tampilan → Tema. Hasil pengecekan disimpan 12 jam; tombol Cek Pembaruan Sekarang di menu SintangNews memaksa pengecekan ulang. Memperbarui tema tidak menghapus konten maupun pengaturan.

Pembaruan hanya diberikan kepada situs dengan lisensi aktif. Link unduhan dibuat khusus untuk setiap situs dan hanya berlaku sementara.

Lisensi

Setiap pembelian mendapat satu kunci lisensi (contoh SN-XXXXX-XXXXX-XXXXX-XXXXX-XXXXX) yang berlaku untuk satu situs.

• Aktivasi: buka menu SintangNews (tab Lisensi), masukkan kunci, klik Aktifkan. Hosting harus bisa terhubung ke internet.
• Sebelum diaktifkan: tampilan situs untuk pembaca tetap normal. Tab pengaturan bisa dilihat tetapi terkunci; menu Iklan, impor konten demo, dan pembaruan otomatis belum tersedia.
• Satu situs: kunci yang sudah aktif di satu domain ditolak di domain lain. Situs yang disalin utuh ke domain lain juga otomatis terkunci.
• Cek harian: status diperiksa ulang sekali sehari. Bila server lisensi tidak bisa dihubungi, status terakhir tetap dipakai.
• Pindah domain: klik Lepas dari situs ini di situs lama, lalu aktifkan di situs baru. Bila situs lama sudah tidak bisa dibuka, hubungi Sintang Web Kreatif.
• Masa lisensi: 1 tahun update tema dan dukungan, termasuk gratis bantuan pemasangan. Setelah masa lisensi habis, tema dan semua pengaturan tetap berfungsi normal; hanya update dan dukungan yang berhenti sampai diperpanjang.

wp-admin → SintangNews

Dukungan

Bantuan

Tanya jawab (FAQ)

Bantuan

Riwayat versi