Indeks Markup Sample Post Shortcode List
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc et egestas nulla, vel ornare tellus. Suspendisse pharetra at erat eget pulvinar. Donec eleifend congue dui sed mollis. Pellentesque ac augue odio. Sed facilisis tellus risus, sit amet sodales neque pellentesque vitae.
KUMPULAN KODE POSTING
Kode Link
Sample link seperti ini. link magenta cara memasang fitur tab di microsoft. link orange cara memasang fitur tab di microsoft
ShortCode :// Link Magenta
<a href="###" class="mgnt" target="_blank">ISI TEKS DISINI</a>
// lINK orange
<a href="###" class="orge" target="_blank">ISI TEKS DISINI</a>
Kode Daftar Isi
<div class='tableOfContent'>
<input aria-label='Daftar Isi' class='toctoggle' id='toctoggle' role='button' type='checkbox'/>
<span class='toctogglespan'><label class='toctogglelabel' for='toctoggle'/></span>
<div id='tocContent'/>
</div>
Double Click To Select
Donec odio ante, interdum quis dictum eget, venenatis ut velit. Cras in dolor diam. Sed a urna sodales, posuere eros ut, rhoncus massa. Curabitur molestie dui vitae dapibus tempor. Quisque eget porttitor est. Proin iaculis mollis tortor, id rutrum erat convallis vitae.
ShortCode :<kbd>Quisque eget</kbd>
Kotak Info, Catatan, Peringatan
// Kode Info
<div class='info'>Isi Teks Disini...</div>
// Kode Tips/Catatan
<div class='tips'>Isi Teks Disini...</div>
// Kode Peringatan
<div class='warning'>Isi Teks Disini...</div>
Blockquote
Test Blockquote. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc et egestas nulla, vel ornare tellus. Suspendisse pharetra at erat eget pulvinar.ShortCode :
<blockquote>Isi Teks Disini...</blockquote>
Kode Keyboard
Tekan tombol dengan+
<svg class="rev" viewBox="0 0 24 24"><path d="M3,12V6.75L9,5.43V11.91L3,12M20,3V11.75L10,11.9V5.21L20,3M3,13L9,13.09V19.9L3,18.75V13M20,13.25V22L10,20.09V13.1L20,13.25Z"></path></svg>+<kbod>Ctrl</kbod>
Teks Kode
Contoh teks kode seperti ini
Mel putent quaeque an, ut postea melius denique sit. Officiis sensibus at mea, sea at labitur deserunt. Eam dicam congue soluta ut.
<code>Isi Teks Disini</code>
Syntax Highlighter
Contoh tampilannya seperti dibawah ini
<script type='text/javascript'>
//<![CDATA[
var message="Ah, nice try";function clickIE4(){if(2==event.button)return alert(message),!1}function clickNS4(e){if((document.layers||document.getElementById&&!document.all)&&(2==e.which||3==e.which))return alert(message),!1}document.layers?(document.captureEvents(Event.MOUSEDOWN),document.onmousedown=clickNS4):document.all&&!document.getElementById&&(document.onmousedown=clickIE4),document.oncontextmenu=new Function("alert(message);return false");
!function t(){try{!function t(n){1===(""+n/n).length&&0!==n||function(){}.constructor("debugger")(),t(++n)}(0)}catch(n){setTimeout(t,5e3)}}();
//]]>
</script>
ShortCode :
// Diisi Html, Css, Javascript
<pre><code class="html"> ...Diisi Kode HTML... </code></pre>
<pre><code class="css"> ...Diisi Kode CSS... </code></pre>
<pre><code class="js"> ...Diisi Kode JavaScript... </code></pre>
// Untuk Menandai Kode
<mark> ...Untuk yang ditandai didalam kode... </mark>
Unordered List / List yg tak berurutan
Contoh Unordered List dibawah ini- Blogger templates
- Templates
- Blogs
<ul>
<li>Blogger templates</li>
<li>Templates</li>
<li>Blogs</li>
</ul>
Ordered List / List Berurutan
Contoh Unordered List dibawah ini- Blogger templates
- Templates
- Blogs
<ol>
<li>Blogger templates</li>
<li>Templates</li>
<li>Blogs</li>
</ol>
Nested
- Satu
- Satu satu
- Satu satu satu
- Dua
- Tiga
<ol><li>Satu</li>
<ol><li>Satu satu</li>
<ol><li>Satu satu satu</li></ol></ol>
<li>Dua</li>
<li>Tiga</li>
</ol>
- Satu
- Satu satu
- Satu satu satu
- Dua
- Tiga
<ul>
<li>Satu</li>
<ul><li>Satu satu</li>
<ul><li>Satu satu satu</li></ul></ul><li>Dua</li>
<li>Tiga</li></ul>
Kode Tabel
Contoh Tabel dibawah iniTable Header 1 | Table Header 2 | Table Header 3 |
---|---|---|
Division 1 | Division 2 | Division 3 |
Division 1 | Division 2 | Division 3 |
Division 1 | Division 2 | Division 3 |
<table cellpadding="0" cellspacing="0" style="text-align: left;"><tbody>
<tr> <th>Table Header 1</th> <th>Table Header 2</th> <th>Table Header 3</th> </tr>
<tr> <td>Division 1</td> <td>Division 2</td> <td>Division 3</td> </tr>
<tr> <td>Division 1</td> <td>Division 2</td> <td>Division 3</td> </tr>
<tr> <td>Division 1</td> <td>Division 2</td> <td>Division 3</td> </tr>
</tbody> </table>
Sample Tabel Custom
Features | Availability |
---|---|
Responsive | True Cek |
Google Testing | True Cek |
Dynamic Heading | True |
Adsense | True |
Responsive Sitemap Widget (by Unknown : Edited by Delaphan) | True |
<table cellpadding="0" cellspacing="0" style="text-align: left;"><tbody>
<tr> <th>Features</th> <th style="max-width: 135px;">Availability</th> </tr>
<tr> <td>Responsive</td> <td>True <a href="###" rel="nofollow" target="_blank">Cek </a></td> </tr>
<tr> <td>Google Testing</td> <td>True <a href="###" rel="nofollow" target="_blank">Cek </a></td> </tr>
<tr> <td>Dynamic Heading</td> <td>True </td> </tr>
<tr> <td>Adsense</td> <td>True </td> </tr>
<tr> <td>Responsive Sitemap Widget (by Unknown : Edited by Delaphan)</td> <td>True</td> </tr>
</tbody> </table>
Tombol Download & Demo
Contoh beberapa tombol Download dan Demo dibawah ini.
<a class="buttonDownload" href="###">DOWNLOAD</a>
ShortCode :
<div id='wrap'>
<a href='###' class='mbg-btn-slide' target='_blank'>
<span class='circle'>
<svg style="width:24px;height:24px;padding:9px 5px;" viewBox="0 0 24 24"><path fill="#fff" d="M3 4V16H21V4H3M3 2H21C22.1 2 23 2.89 23 4V16C23 16.53 22.79 17.04 22.41 17.41C22.04 17.79 21.53 18 21 18H14V20H16V22H8V20H10V18H3C2.47 18 1.96 17.79 1.59 17.41C1.21 17.04 1 16.53 1 16V4C1 2.89 1.89 2 3 2M10.84 8.93C11.15 8.63 11.57 8.45 12 8.45C12.43 8.46 12.85 8.63 13.16 8.94C13.46 9.24 13.64 9.66 13.64 10.09C13.64 10.53 13.46 10.94 13.16 11.25C12.85 11.56 12.43 11.73 12 11.73C11.57 11.73 11.15 11.55 10.84 11.25C10.54 10.94 10.36 10.53 10.36 10.09C10.36 9.66 10.54 9.24 10.84 8.93M10.07 12C10.58 12.53 11.28 12.82 12 12.82C12.72 12.82 13.42 12.53 13.93 12C14.44 11.5 14.73 10.81 14.73 10.09C14.73 9.37 14.44 8.67 13.93 8.16C13.42 7.65 12.72 7.36 12 7.36C11.28 7.36 10.58 7.65 10.07 8.16C9.56 8.67 9.27 9.37 9.27 10.09C9.27 10.81 9.56 11.5 10.07 12M6 10.09C6.94 7.7 9.27 6 12 6C14.73 6 17.06 7.7 18 10.09C17.06 12.5 14.73 14.18 12 14.18C9.27 14.18 6.94 12.5 6 10.09Z"/></svg>
</span>
<span class='title'>DEMO</span><span class='title-hover'>Click here</span></a>
<a href='###' class='mbg-btn-slide2' target='_blank'>
<span class='circle2'>
<svg style="width:24px;height:24px;padding:9px 5px 0px 5px;" viewBox="0 0 24 24"><path fill="#fff" d="M5,20H19V18H5M19,9H15V3H9V9H5L12,16L19,9Z"/></svg></span><span class='title2'>DOWNLOAD</span><span class='title-hover2'>Click here</span></a>
</div>
Sample Image
ShortCode :// Single Image
<img alt="ALT DISINI" title="TITLE DISINI" src="LINK GAMBAR" />
//Double Image Tanpa Separator
<div class="separator" style="line-height: 0;">
<img alt="ALT DISINI" title="TITLE DISINI" src="LINK GAMBAR" />
<img alt="ALT DISINI" title="TITLE DISINI" src="LINK GAMBAR" />
</div>
Format Paragraph
Contoh beberapa penulisannya
definitiones (strong)
tritani vulputate (italic)
Augue quaerendum (Acronym)
Contoh tulisansubscript
Contoh tulisansupscript
// Tulisan Bold
<b>definitiones (strong) </b>
// Tulisan Italic
<i>tritani vulputate (italic)</i>
// Tulisan Acronym
<acronym title="Acronym">Augue quaerendum (Acronym)</acronym>
// Tulisan Subscript
Contoh tulisan<sub>subscript </sub>
// Tulisan Supscript
Contoh tulisan<sup>supscript </sup>
Heading 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc et egestas nulla, vel ornare tellus. Suspendisse pharetra at erat eget pulvinar.
Heading 2
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc et egestas nulla, vel ornare tellus. Suspendisse pharetra at erat eget pulvinar.
Heading 3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc et egestas nulla, vel ornare tellus. Suspendisse pharetra at erat eget pulvinar.
Heading 4
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc et egestas nulla, vel ornare tellus. Suspendisse pharetra at erat eget pulvinar.
Heading 5
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc et egestas nulla, vel ornare tellus. Suspendisse pharetra at erat eget pulvinar.
Heading 6
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc et egestas nulla, vel ornare tellus. Suspendisse pharetra at erat eget pulvinar.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc et egestas nulla, vel ornare tellus. Suspendisse pharetra at erat eget pulvinar. Donec eleifend congue dui sed mollis. Pellentesque ac augue odio. Sed facilisis tellus risus, sit amet sodales neque pellentesque vitae.
tes komentar
BalasHapusTes Balas komentar
Hapustrdsss
Hapustes lapis 3 komen
Hapustes saja
Hapustest tulis aja
BalasHapusKODE YANG LEBIH PANJANG
BalasHapus