Test

Compose mode

This is the standard layout of Blogger posts in compose mode and all the features included in this mode. This mode is also responsive so several layouts such as images, blockquotes and so on will adjust the display based on the user's screen size.

This paragraph is standard with the <p> tag of this template with no additional indents, the font size and line height have been set to make the text easier to read.

The quote text paragraph will appear like this with a different text color than a regular paragraph

List or list on posts with numbers

  1. First list
  2. Second list
  3. Third list
  4. Fourth list

List or list with dots

  • First list
  • Second list
  • Third list
  • Fourth list

Paragraphs with additional anchor linksand active links are added manually via compose mode.

In this paragraph, the table format in this template will be displayed along with other formats such as blockquote or html code insertion and additional styles that can be used in html mode.

No Nama Kota
1 Kota Balikpapan
2 Kelurahan Gunung Sari
3 Desa Klandasan Ilir

The correct way to write a table as above is in html mode which code is as follows:


  <div class='table'>
  <table>
    <thead>
      <tr>
        <th>No</th>
        <th>Nama</th>
        <th>Kota</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>1</td>
        <td>Kota</td>
        <td>Balikpapan</td>
      </tr>
      <tr>
        <td>2</td>
        <td>Kelurahan</td>
        <td>Gunung Sari</td>
      </tr>
      <tr>
        <td>3</td>
        <td>Desa</td>
        <td>Klandasan Ilir</td>
      </tr>
    </tbody>
  </table>
</div>

Additional format that can only be used in HTML mode

Writing Syntax Highlighter manually in post HTML mode


//Comment 
<pre><code>
  <!-- kode html, css ata javascript disini -->
</code></pre>

<i>Comment</i>     						= Comment
<i class='comment'>Comment</i> 			= Comment
<i class='tag'>div</i>					= div
<span>CSS Property</span>     			= main{display: block;position: relative}  
<span class='block'>Block Text</span> 	= Block Text

You can write html code outside the syntax like this example: <div>, it's quite easy just by writing the code as below. Make sure the tag you are going to write is parsed as shown below


<span class='code'> <div> </span>

Paragraph Break

Lorem ipsum dolor sit amet, elite adipiscing consectetur. Proin vestibule dignissim silence, et efficitur felis commodo et. Mauris Vel silent pellentesque lorem lacinia luctus. Nulla quam magna, pharetra in ultrices at, condimentum id tellus.