index.html #20
Description
<title>Contoh Kode dengan Sintaks Highlighting</title>
<style>
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
margin: 20px;
background-color: #f5f5f5;
}
.container {
max-width: 800px;
margin: 0 auto;
background-color: white;
padding: 20px;
border-radius: 8px;
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}
h1 {
color: #2c3e50;
border-bottom: 2px solid #3498db;
padding-bottom: 10px;
}
.code-container {
background-color: #f8f9fa;
border-radius: 6px;
padding: 15px;
margin: 20px 0;
overflow-x: auto;
}
.code-title {
font-weight: bold;
margin-bottom: 10px;
color: #2c3e50;
}
pre {
margin: 0;
font-family: 'Consolas', 'Courier New', monospace;
font-size: 14px;
line-height: 1.5;
}
.comment { color: #6a9955; }
.keyword { color: #569cd6; }
.string { color: #ce9178; }
.function { color: #dcdcaa; }
.number { color: #b5cea8; }
.instructions {
background-color: #e8f4fd;
border-left: 4px solid #3498db;
padding: 15px;
margin: 20px 0;
}
.step {
margin-bottom: 10px;
}
</style>
Cara Menampilkan Kode di PowerPoint dengan Sintaks Highlighting
<div class="instructions">
<h3>Langkah-langkah Menggunakan Code Paste:</h3>
<div class="step">1. Buka <a href="https://codepaste.top" target="_blank">codepaste.top</a></div>
<div class="step">2. Pilih bahasa pemrograman Anda</div>
<div class="step">3. Tempel kode Anda di panel input</div>
<div class="step">4. Pilih skema warna yang sesuai</div>
<div class="step">5. Klik tombol salin</div>
<div class="step">6. Tempel ke PowerPoint dengan opsi "Keep Source Formatting"</div>
</div>
<div class="code-container">
<div class="code-title">Contoh Kode Python dengan Sintaks Highlighting:</div>
<pre><span class="comment"># Fungsi untuk menghitung faktorial</span>
def faktorial(n):
# Kasus dasar
if n == 0 or n == 1:
return 1
<span class="comment"># Rekursi</span>
<span class="keyword">return</span> n * faktorial(n - <span class="number">1</span>)
# Contoh penggunaan
hasil = faktorial(5)
print(f"Faktorial dari 5 adalah {hasil}")
<div class="code-container">
<div class="code-title">Contoh Kode JavaScript dengan Sintaks Highlighting:</div>
<pre><span class="comment">// Fungsi untuk mengurutkan array</span>
function bubbleSort(arr) {
let len = arr.length;
<span class="keyword">for</span> (<span class="keyword">let</span> i = <span class="number">0</span>; i < len; i++) {
<span class="keyword">for</span> (<span class="keyword">let</span> j = <span class="number">0</span>; j < len - i - <span class="number">1</span>; j++) {
<span class="keyword">if</span> (arr[j] > arr[j + <span class="number">1</span>]) {
<span class="comment">// Tukar elemen</span>
<span class="keyword">let</span> temp = arr[j];
arr[j] = arr[j + <span class="number">1</span>];
arr[j + <span class="number">1</span>] = temp;
}
}
}
<span class="keyword">return</span> arr;
}
// Contoh penggunaan
const numbers = [5, 2, 8, 1, 9];
const sortedNumbers = bubbleSort(numbers);
console.log("Array yang diurutkan:", sortedNumbers);
<div class="instructions">
<h3>Alternatif Metode Lain:</h3>
<div class="step">1. <strong>Notepad++ dengan NppExport:</strong> Salin kode sebagai RTF dengan plugin NppExport</div>
<div class="step">2. <strong>Pygments:</strong> Gunakan command line: <code>pygmentize -f rtf -o output.rtf input.py</code></div>
<div class="step">3. <strong>Keep Source Formatting:</strong> Salin langsung dari VS Code dan pilih "Keep Source Formatting"</div>
</div>
</div>