All Typography and Writing Formats

Some of the styles below you can use directly in 'Writing view' mode and some others can only be used in 'HTML View' mode but we still try to make it easy for you to use.

Image with Caption

For this section you can directly use it in 'Writing view' mode, the caption in this image will not be read in the article description/snippet.

All Style Typography and Format Posts
Caption_here

Image with Grid Layout

Construction of New Highway Langtang Tracking Major Attractions De Spain Preparations Boating Experience in Pokhara

Image with Show All Function

Used to hide some images and will be shown when the user clicks the 'Show All' button. Show All function can only be activated once, Images cannot be hidden again when you activate it

Construction of New Highway Langtang Tracking Major Attractions De Spain Preparations
Boating Experience in Pokhara
Construction of New Highway Langtang Tracking Major Attractions De Spain Preparations Boating Experience in Pokhara

Image with Scroll Layout

Same as the image layout above, it's just that on the mobile display the images will be arranged in parallel with the additional side scroll function on the mobile display.

We also added a smooth scroll effect to this feature. Please try opening this page on your mobile device:

Construction of New Highway Langtang Tracking Major Attractions De Spain Preparations

Manual Related Posts

It is important to note that this feature is written manually, it does not automatically appear on every page.

Due to a problem with the Related Posts in-Article script not working on IOS devices, we decided to change it to manual.

The advantage is that you can add it to any paragraph you want, the number of links is not limited and related titles that you can change, also all links that you add to this related article will also be indexed by search robots as referring pages.

Post Break

You can use this feature to separate paragraphs or to open a new discussion in a post, here's an example of how it looks:

Paragraph with Text Indent

This paragraph will have the first line indent, simply to make a sentence in the first paragraph indent with a predetermined value.

You can apply the feature to as many paragraphs as you need

Paragraph with Drop cap

Merupakan huruf kapital besar yang digunakan sebagai elemen dekoratif di awal paragraf atau bagian. Ukuran batas turun biasanya adalah dua garis atau lebih.

Drop cap akan mengubah ukuran huruf pertama paragraf sehingga huruf tersebut turun satu atau beberapa baris ke bawah.

Blockquote

Harga teman adalah harga yang lebih tinggi dari harga normal karena bertujuan untuk membantu teman yang merintis usaha

—Ivan Lanin

Format style lainnya yang dapat Anda gunakan:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin vestibulum dignissim diam, et efficitur felis commodo et. Mauris vel diam pellentesque lorem lacinia luctus. Nulla quam magna, pharetra in ultrices at, condimentum id tellus.
  • Sed suscipit sapien sed turpis ultrices viverra. Ut quis dui sed odio sollicitudin fermentum.
  • Aliquam vitae metus laoreet, dapibus enim sit amet, feugiat lorem. Sed in dui purus.

Table

Tabel pada tema ini sudah disetting responsive, sebagai contoh jika jumlah kolom atau lebar tabel melebihi lebar layar maka agar tidak merusak layoutnya secara otomatis table akan memiliki fungsi scroll.

Silahkan buka artikel ini pada perangkat seluler anda dan sorot bagian tabel dibawah:

No Column_1 Column_2 Column_3 Column_4 Column_5
1 Data_table_1 00.000.000 0.000.000 0.000.000 0.000.000
2 Data_table_2 00.000.000 0.000.000 0.000.000 0.000.000
3 Data_table_3 00.000.000 0.000.000 0.000.000 0.000.000
4 Data_table_4 00.000.000 0.000.000 0.000.000 0.000.000

Syntax Highlighter

Format ini digunakan untuk menuliskan baris kode HTML dalam postingan, biasa dipakai pada blog dengan tema koding atau tutorial blogging.

<!DOCTYPE html>
<html dir='ltr' lang='en'>
  <head>
    <title>Sample Page</title>
  </head>

  <!--[ <body> open ]-->
  <body>
    <p>Sample content here!</p>
  </body>
  <!--[ </body> close ]-->
</html>

Show Hide Button

Spoiler:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin vestibulum dignissim diam, et efficitur felis commodo et. Mauris vel diam pellentesque lorem lacinia luctus. Nulla quam magna, pharetra in ultrices at, condimentum id tellus.

Sed suscipit sapien sed turpis ultrices viverra. Ut quis dui sed odio sollicitudin fermentum. Aliquam vitae metus laoreet, dapibus enim sit amet, feugiat lorem. Sed in dui purus.

Accordion / Toggle Menu

Berfungsi untuk menampilkan konten faq atau pertanyaan dalam blog, sering disebut dengan accordion menu

  • Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin vestibulum dignissim diam, et efficitur felis commodo et. Mauris vel diam pellentesque lorem lacinia luctus. Nulla quam magna, pharetra in ultrices at, condimentum id tellus. Sed suscipit sapien sed turpis ultrices viverra.

    Ut quis dui sed odio sollicitudin fermentum. Aliquam vitae metus laoreet, dapibus enim sit amet, feugiat lorem. Sed in dui purus.

  • Morbi turpis arcu, eleifend a tortor quis, sagittis dapibus ipsum. Vestibulum in imperdiet arcu, eget fringilla libero. Aenean commodo, felis id fermentum pellentesque, risus elit efficitur augue, at lobortis libero ipsum quis nulla. Suspendisse imperdiet magna at tellus feugiat rhoncus.
  • Donec in massa vitae quam lobortis cursus. Donec tincidunt interdum ex ut finibus. Praesent at dui scelerisque, laoreet justo eu, egestas justo. Nullam dapibus, dolor quis blandit suscipit, massa odio hendrerit neque, at fermentum dolor tellus ac justo.

Note Block

Fitur ini berfungsi untuk menambahkan info penting, kalimat warning atau kalimat sorotan, ada dua style yang bisa anda coba diantaranya:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin vestibulum dignissim diam, et efficitur felis commodo et.

Warning!
Mauris vel diam pellentesque lorem lacinia luctus. Nulla quam magna, pharetra in ultrices at, condimentum id tellus. Sed suscipit sapien sed turpis ultrices viverra.

Jika ada link eksternal yang terdapat dalam postingan, anda bisa memberitahukannya kepada user dengan menggunakan fitur ini:

Sample_external_link
Sample_link_alt

Tombol link yang dilengkapi dengan icon berbeda untuk tiap penggunaannya:

Standard_button

Tombol dengan icon download:

Download

Tombol dengan icon download (tanpa background):

Download

Icon lain yang tersedia:

Demo
Buy now
Whatsapp me

Catatan: Anda juga bisa menambahkan icon lain menggunakan <svg>

Dua tombol dalam satu baris:

file_name.zip 200kb

Lazy Youtube

Berfungsi untuk memuat video youtube setelah halaman di scroll agar mempercepat loading blog

Youtube videos

Post Reference

Berguna untuk menambahkan daftar referensi artikel yang anda tulis, contoh tampilannya adalah seperti dibawah ini:

Referensi:
jagodesain.com