-->

Indeks Markup Sample Post Shortcode List

Your alt here

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.

Your alt here

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

ShortCode :
<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

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum venenatis orc no tortor accumsan at accumsan tortor congue.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum venenatis orc no tortor accumsan at accumsan tortor congue.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum venenatis orc no tortor accumsan at accumsan tortor congue.

ShortCode :
// 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+Ctrl+Shift+Del untuk shortcutnya.

ShortCode :
<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.

ShortCode :
<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
ShortCode :
<ul>
<li>Blogger templates</li>
<li>Templates</li>
<li>Blogs</li>
</ul>

Ordered List / List Berurutan

Contoh Unordered List dibawah ini
  1. Blogger templates
  2. Templates
  3. Blogs
ShortCode :
<ol>
<li>Blogger templates</li>
<li>Templates</li>
<li>Blogs</li>
</ol>

Nested

  1. Satu
    1. Satu satu
      1. Satu satu satu
  2. Dua
  3. Tiga
ShortCode :
<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
ShortCode :
<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 ini
Table 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
ShortCode :
<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
ShortCode :
<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.

DOWNLOAD

ShortCode :
<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

Your alt here

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

ShortCode :
// 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>

Your alt here Your alt here
Your alt here
Your alt here
Headingz 

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.

Buka Komentar
Tutup Komentar

7 Komentar untuk "Indeks Markup Sample Post Shortcode List"

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel