Baris kedua dari setiap item akan sejajar persis dengan huruf pertama setelah nomor, baik nomor 1 digit (1,2,3) maupun 2 digit (10, 11). Juga mendukung <sub>subscript</sub> dan <sup>superscript</sup> di dalam teks panjang. CSS yang digunakan seperti berikut:
Tampilkan postingan dengan label Tutorial Blogger. Tampilkan semua postingan
Tampilkan postingan dengan label Tutorial Blogger. Tampilkan semua postingan
Tutorial Blogger: Struktur Lewis Interaktif di Blogger
Senin, 23 Maret 2026
Tutorial ini menjelaskan cara menampilkan struktur Lewis molekul langsung di halaman Blogger menggunakan library RDKit.js, rendering berbasis WebAssembly tanpa server, tanpa plugin, tanpa biaya. Struktur dirender di browser pengunjung secara real-time dari notasi SMILES
Contoh Penggunaan SmilesDrawer di Blogger
Senin, 06 Oktober 2025
Berikut contoh penggunaan Smiles Drawer yang diterapkan dalam postingan blogger. Tujuannya agar ketika akan menampilkan struktur molekul 2D dapat langsung disisipkan dalam tulisan, tidak perlu menyisipkan sebagai gambar. Untuk uji coba dapat langsung menggunakan aplikasi online yang tersedia di sini.
Bikin Alat Hitung Sederhana ala Excel di Blog
Selasa, 29 April 2025
Hai bro/sis, aku baru belajar JavaScript dan pengen bikin kalkulasi simpel kayak di Excel: A1 * A2 = A3, bisa ubah angka, dan ada tombol reset buat kosongin. Ternyata gampang banget! Ini catatanku, cocok buat yang suka Excel kayak aku. 😄
Membuat Markdown Elektron dalam Orbital untuk Editor Blogger
Jumat, 04 April 2025
Sambil menunggu waktu aktif mengajar, menyempatkan belajar kode kecil-kecilan, agar menulis di Editor Blogger semakin mudah. Kali ini membuat markdown atau penyandian elektron dalam orbital dengan menuliskan kode sederhana (input) dan output-nya berupa deretan "kotak orbital" yang berisi elektron.
Penampilan sementara masih di file html tunggal yang berisi kode Cascading Style Sheet dan JavaScript. Bagi yang mau mencoba menjalankan silakan salin kode di bawah ini, simpan sebagai file html. Selanjutnya buka di browser komputer.
Menulis Format Rumus Kimia dan Matematika Secara Efisien di Blogger tanpa MathJax
Sabtu, 29 Maret 2025
Menulis rumus senyawa kimia atau ion dan bentuk pecahan (pembilang dibagi penyebut) memang dapat menggunakan MathJax dengan kemampuan yang powerfull. Namun untuk mengetik rumus-rumus kimia dan perhitungan kimia relatif sederhana dapat dilakukan tanpa perlu MathJax. Keuntungan menggunakan cara ini, font yang digunakan sama persis dengan yang digunakan dalam postingan utama, berbeda dengan MathJax. Trik ini bisa saja diterapkan di platform selain Blogger, namun perlu adaptasi. Berikut ini catatan ringkas weblog urip.info yang menggunakan platform Blogger.
Membuat Tombol Buka Tutup (Accordion) di Blogger
Rabu, 26 Maret 2025
Berikut ini catatan saya ketika mencoba membuat tombol buka dan tutup suatu bagian dari postingan di blogger. Tombol tersebut dibuat dengan kode cascading style sheet (CSS) dan javascript (Js). Catatan ini dibuat untuk pemula.
Visualisasi 3D Molekul Menggunakan CID PubChem dengan 3DMol.JS di Web/Blog
Kamis, 07 Januari 2021
Alternatif untuk menampilkan (memvisualkan) molekul secara 3-Dimensi (3D) di web semakin mudah. Hanya dengan memasang kode dengan format tertentu molekul 3D yang cantik dapat ditampilkan. Syaratnya blog atau website yang digunakan memang mengizinkan penggunaan script. Molekul yang hendak ditampilkan pun tinggal menggunakan pada pangkalan data, sudah tersedia, kecuali kalau molekulnya khusus. Molekul 3D ini dapat diputar di perbesar/diperkecil dengan memainkan mouse atau dua jari di gawai. Bagaimana caranya simak kelanjutan tulisan ini.
Koversi Persamaan Matematis Ms Word ke Latex
Selasa, 12 Maret 2019
Biasa untuk mengetik persamaan matematis di blog ini langsung menggunakan format latex yang tampilkan dengan menggunakan Mathjax. Kali ini akan diberikan tutorial singkat untuk mengonversi persamaan matematis dari berbagai format (ms word, ms powerpoint, pdf, gambar, dll) dapat dilakukan hanya dengan 2 langka saja. Screenshoot, salin kode yang diberikan ke editor blog. Selesai.
Cara Membuat Data Tabel Dapat Diurutkan dalam Tulisan di Blog/Website
Kamis, 10 Januari 2019
Berikut ini tutorial singkat cara membuat data tabel yang dapat diurutkan dalam tulisan blog/website secara otomatis. Cukup buat tabel seperti biasa dan tambahkan beberapa baris kode. Pembaca dapat mengurutkan data berdasarkan kolom tertentu yang dikehendaki.
Form, Select, Option, untuk Membuat Jawaban Tersembunyi
Selasa, 16 Oktober 2018
Sekadar catatan. Berikut ini kode sederhana yang akan digunakan dalam blog ini. Tujuannya adalah tidak menunjukkan jawaban secara langsung sehingga bila dikehendaki pembaca dapat mencoba mengerjakan sendiri lebih dahulu . Ketika ingin mencocokan jawabannya boleh klik "Petunjuk......"
Penempatan Bilangan Oksidasi di Atas Setiap Unsur
Kamis, 27 September 2018
Pada pokok bahasan reaksi redoks ada keharusan menuliskan bilangan oksidasi (biloks). Penulisan manual dengan menempatkan biloks di atas atau di bawah setiap unsur tentu tidak repot. Bahkan pengetikan menggunakan aplikasi olah kata pun bisa dilakukan "secara manual" pula. Tentu saja masih belum praktis. Demikian pula bila ingin menuliskan dalam bentuk laman di blog atau website pribadi. Bila tidak hati-hati penempatan biloks-biloks bisa berantakan dan tentu menjadi tidak menolong bagi yang hendak memahaminya.
Kode HTML untuk Penulisan Isotop dan Ion
Rabu, 26 September 2018
Menulis simbol atau lambang isotop atau ion bila dilakukan dengan aplikasi olah kata tentu bukan hal sulit. Tinggal klak-klik saja jadi sesuai keinginan. Sedikit berbeda bila ingin menuliskan pada website yang harus menggunakan kode HTML. Karena kemalasan biasa saya hanya menuliskan sebagaimana saya bisa, dan berharap pembaca bisa memahaminya karena biasanya pada tulisan diberi keterangan.
Cara Membuat Simbol Elektron dalam Orbital Tanpa Gambar
Kamis, 24 Mei 2018
Untuk membuat konfigurasi elektron dalam orbital atau subkulit diperlukan ketelatenan agar tampilannya relatif lebih bagus. Berbeda jika membuatnya dalam Microsoft Word atau aplikasi olah kata lain, cukup hanya menyisipkan karakter dari jenis font (huruf) tertentu kemudian di-format sesuai keinginan. Memang tidak dilarang membuatnya dengan aplikasi apapun kemudian di capture dan disimpan sebagai image selanjutnya disisipkan dalam tulisan di website atau blog. Hasilnya kurang bagus kalau menurut saya. Oleh karena itu dicari alternatif yang mungkin agar orbital-orbital yang terisi elektron itu berupa teks dengan karakter yang sesuai, bukan image tentu.
Menambah/menghapus Baris/kolom pada Tabel HTML
Minggu, 17 Juli 2016
Sekadar catatan
Tabel HTML dengan Penomoran Otomatis
Jumat, 01 Juli 2016
Berikut ini adalah catatan kecil agar saya dan yang senasib yang baru belajar html dan css terkait tabel sedikit tercerahkan bila suatu saat lupa lagi. Ketika saya harus membuat tabel dengan pemutakhiran secara berkala tentu juga harus melakukan perbaikan urutan penomoran karena ada sisipkan pada baris. Tentu akan kurang praktis bila harus mengganti nomor seri ketika ada data baru yang mesti disisipkan. Dapatlah cara ini dari https://jsfiddle.net/javedfiddle/owhcnxhz. Keunggulan cara ini adalah menyelesaikan urusan yang seperti saya temui tadi. Kini bila ingin menyisipkan baris maka tidak perlu lagi repot untuk memperbaiki penomoran lagi. Penomoran akan dilakukan secara otomatis. Dengan memanfaatkan cascading style sheet masalah itu pun jadi bablas, lewat dah.
Cara Melipat Tabel yang Memanjang Vertikal
Suatu ketika kita mendapati harus membuat tabel yang sangat panjang secara vertikal, baris-nya (row) banyak, bisa ratusan bahkan ribuan . Kandang dikehendaki agar tabel yang memanjang tersebut untuk dibuat lebih ringkas dengan melipatnya pada bagian tertentu. Maksud tabel yang memanjang itu seperti pada contoh laman ini. Tujuannya adalah agar pembaca dimudahkan dalam menyimak isi tabel.
Konversi Tabel Excel ke HTML secara Manual
Kamis, 30 Juni 2016
Sebagai pembelajar html pemula, saya, lebih suka untuk membuat sesuatu tidak dengan cara yang klak-klik begitu saja. Ingin juga paham apa yang terjadi di balik kemudahan dari suatu cara. Karena keterbatasan pengalaman tentu untuk menuju paham benar ada proses belajar sedikit demi sedikit. Kali ini saya berbagi pengalaman cara mengonversi tabel yang dibuat di aplikasi Ms. Excel untuk disalin ke laman html blog atau website.
Cara Mudah Menampilkan Rumus Struktur Kimia dengan Chemicalize untuk Blog dan Website
Minggu, 01 Mei 2016
Beberapa tahun lalu saya pernah menulis tentang hal ini. Tapi sayangnya saat ini (tahun 2026) sudah tidak tersedia layanan ini. Di blog tadi sudah terpasang plugin chemicalize sehingga untuk melihat struktur suatu senyawa tinggal arahkan pointer di atas nama zat tersebut. Plugin chemicalize ini setahu saya hanya mendukung untuk web/blog yang menggunakan mesin wordpress.org, untuk yang versi wordpress.com tentu tidak dapat dipasangi karena keterbatasan wewenang yang tersedia. Namun jangan khawatir, termasuk pengguna blog di blogger/blogspot atau website lain masih dapat menggunakan cara lain. Tulisan cara mudah menampilkan rumus struktur kimia dengan chemicalize untuk blog dan website ini akan sedikit mengobati kekhawatiran itu :)
Kolaborasi Wordpress dan Blogger
Senin, 27 April 2015
Segala sesuatu memang punya kelebihan dan kekurangannya masing-masing. Blogger.com dan Wordpress.com sebagai pemberi layanan ngeblog gratis juga demikian. Sudah cukup puas ngeblog di Wordpress.com kini saya beralih ke blogger.com. Di Blogger.com membolehkan pengguna untuk bermain script sepuasnya. Di Wordpress.com hanya boleh fokus di konten blog saja. Satu ketidaknyamanan selama fokus ngeblog di blogger adalah minimnya tool pada editor untuk mengetik. Ada beberapa cara untuk memudahkan menulis di blogger pernah saya tulis di sini, namun ini masih kurang merasa nyaman juga karena mesti online :) Akhirnya ada solusi yang cukup mengurangi ketaknyamanan tadi.
Langganan:
Postingan (Atom)
