(Ini adalah kode sisipan untuk membuat postingan di blogger, tujuannya untuk mempermudah menambahkan kode yang akan di jelaskan)
<p><b><i>B. SKETCH YANG PERLU DIKETIK:</i></b></p><div style="border: 2px solid black; height: 300px; overflow-x: hidden; overflow-y: scroll; overflow: hidden scroll; width: 500px;"><div style="height: 250%;"><pre>#include <Wire.h>
#include <LiquidCrystal_I2C.h>
LiquidCrystal_I2C lcd(0x27, 16, 2); // alamat 0x27, ukuran LCD 16x2
String teks = "Kebersihan sebagian dari iman. Oleh Eskul Robomadina "; // tambahkan spasi di akhir agar halus
int posisi = 0;
void setup() {
lcd.init();
lcd.backlight();
}
void loop() {
lcd.clear();
lcd.setCursor(0, 0);
lcd.print(teks.substring(posisi, posisi + 16)); // tampilkan 16 karakter per langkah
posisi++;
if (posisi > teks.length() - 16) {
posisi = 0; // ulang dari awal
}
delay(300); // atur kecepatan scroll (ms)
}
</pre><div><br /></div></div></div>SKETCH YANG PERLU DIKETIK:
<p><b><i>B. SKETCH YANG PERLU DIKETIK:</i></b></p><div style="border: 2px solid black; height: 300px; overflow-x: hidden; overflow-y: scroll; overflow: hidden scroll; width: 500px;"><div style="height: 250%;"><pre>#include <Wire.h>
#include <LiquidCrystal_I2C.h>
LiquidCrystal_I2C lcd(0x27, 16, 2); // alamat 0x27, ukuran LCD 16x2
String teks = "Kebersihan sebagian dari iman. Oleh Eskul Robomadina "; // tambahkan spasi di akhir agar halus
int posisi = 0;
void setup() {
lcd.init();
lcd.backlight();
}
void loop() {
lcd.clear();
lcd.setCursor(0, 0);
lcd.print(teks.substring(posisi, posisi + 16)); // tampilkan 16 karakter per langkah
posisi++;
if (posisi > teks.length() - 16) {
posisi = 0; // ulang dari awal
}
delay(300); // atur kecepatan scroll (ms)
}
</pre><div><br /></div></div></div>SKETCH YANG PERLU DIKETIK (DENGAN TOMBOL COPY):
<p><b><i>B. SKETCH YANG PERLU DIKETIK:</i></b></p>
<div class="code-container" style="border: 2px solid black; width: 500px; height: 300px; position: relative; overflow-y: auto; overflow-x: hidden;">
<button class="copy-btn" aria-label="Salin kode" title="Salin kode">
<svg viewBox="0 0 24 24" fill="none" width="16" height="16">
<path d="M16 21H6a2 2 0 0 1-2-2V7" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
<rect x="8" y="3" width="13" height="13" rx="2" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<span>Copy</span>
</button>
<pre>#include <Wire.h>
#include <LiquidCrystal_I2C.h>
LiquidCrystal_I2C lcd(0x27, 16, 2); // alamat 0x27, ukuran LCD 16x2
String teks = "Kebersihan sebagian dari iman. Oleh Eskul Robomadina "; // tambahkan spasi di akhir agar halus
int posisi = 0;
void setup() {
lcd.init();
lcd.backlight();
}
void loop() {
lcd.clear();
lcd.setCursor(0, 0);
lcd.print(teks.substring(posisi, posisi + 16)); // tampilkan 16 karakter per langkah
posisi++;
if (posisi > teks.length() - 16) {
posisi = 0; // ulang dari awal
}
delay(300); // atur kecepatan scroll (ms)
}</pre>
</div>
<style>
.code-container {
background: #f9fafb;
font-family: "Courier New", monospace;
border-radius: 6px;
position: relative;
}
.code-container pre {
margin: 0;
padding: 10px;
white-space: pre-wrap;
word-wrap: break-word;
}
.copy-btn {
position: absolute;
top: 8px;
right: 8px;
background: #e5e7eb;
border: none;
color: #111827;
font-size: 12px;
padding: 4px 8px;
border-radius: 6px;
cursor: pointer;
display: flex;
align-items: center;
gap: 4px;
transition: all 0.2s ease;
}
.copy-btn:hover {
background: #d1d5db;
color: #000;
}
.copy-btn.copied {
background: #10b981;
color: white;
}
.copy-btn svg {
display: inline-block;
}
</style>
<script>
document.querySelectorAll('.copy-btn').forEach(button => {
button.addEventListener('click', async () => {
const code = button.parentElement.querySelector('pre').innerText;
try {
await navigator.clipboard.writeText(code);
button.classList.add('copied');
button.querySelector('span').innerText = 'Tersalin!';
setTimeout(() => {
button.classList.remove('copied');
button.querySelector('span').innerText = 'Copy';
}, 1800);
} catch (err) {
alert('Gagal menyalin!');
}
});
});
</script>
