All Style, Text and Writing Formats and Other Additional Features

Daftar Isi [Tutup]
    All Style, Text and Writing Formats and Other Additional Features

    Artikel ini berisi dokumentasi, tutorial, dan penjelasan lengkap seputar tema Blogger (Blogspot) Fitrah Press. Jika ingin melihat jenis font yang digunakan, cara membuat tombol, blockquote, table, syntax highlighter, dan atribut lainnya, silakan kunjungi artikel Gaya dan Tipografi Fitrah Press.

    Cara Menginstall Tamplate Fitrah Press

    Berikut adalah cara memasang template Blogger gratis Fiksioner. Ada dua cara yang bisa dipilih:

    1. Salin HTML (Direkomendasikan)

    Cara ini direkomendasikan karena akan langsung menghasilkan tampilan yang 100% sama dengan versi demo Fiksioner. Resikonya adalah semua isi widget seperti kode iklan, kode Histats, dll akan hilang. Jadi pastikan simpan dulu semua kode widget tersebut sebelum melakukan cara ini.

    1. Masuk ke menu Theme (Tema) > Edit HTML.
    2. Salin semua kode template yang ada di dalam file hasil dowload lalu paste ke text editor yang muncul.
    3. Terakhir klik tombol Save theme.

    2. Unggah XML

    Cara ini aman karena semua widget yang sudah terpasang sebelumnya tidak akan ikut terhapus. Tapi ada kemungkinan letak widget akan berantakan karena tidak sesuai dengan kode HTML template Fiksioner. Cara memperbaikinya mudah, tinggal geser-geser posisinya di menu Layout (Tata Letak).

    1. Masuk ke menu Theme (Tema) > Backup / Restore.
    2. Jika ingin melakukan backup pada template yang sedang digunakan, klik tombol Dowload theme.
    3. Setelah itu langsung upload template Fiksioner dengan klik tombol Choose File dan cari lokasi file .xml berada.

    Setting Meta Tag Tamplate Blog

    Bagian ini cukup penting sebagai bagian dari SEO dan pelengkap properti saat link dibagikan di media sosial. Ganti kode berikut menggunakan milik kamu sendiri.

    1. Meta Tracking Code

    Untuk verifikasi Google Search Console dan Bing Webmaster. Jika belum punya, hapus saja semua baris kode ini. Jika sudah ada, silakan ganti yang ditandai XXX.

    
    <!-- Tracking Code -->
    <meta content='xxxxxxxxx' name='google-site-verification'/>
    <meta content='xxxxxxxxx' name='msvalidate.01'/>
    

    2. Meta Keyword

    Ganti dengan keyword atau kata kunci pencarian blog. Pisahkan menggunakan tanda koma.

    
    <!-- Keyword -->
    <meta content='Keyword 1, keyword 2, keyword 3, keyword 4, keyword 5, etc' name='keywords'/>
    <meta content='Keyword 1, keyword 2, keyword 3, keyword 4, keyword 5, etc' property='article:tag'/>
    

    3. Meta Author Info

    Gambar ini akan muncul saat membagikan link utama (homepage) di media sosial. Ganti yang ditandai menggunakan URL dari gambar banner atau logo blog kamu sendiri.

    
    <!-- Facebook, Twitter, and Pinterest Meta Tag -->
    <meta content='article' property='og:type'/>
    <meta content='Your Name' name='author'/>
    <meta content='Your Name' property='article:author'/>
    <meta content='xxxxxx' property='fb:admins'/>
    <meta content='https://www.facebook.com/xxxxxx' property='article:author'/>
    <meta content='https://www.facebook.com/xxxxxx' property='article:publisher'/>
    <meta content='@YOURusername' name='twitter:site'/>
    


    Mengatur Menu Navigasi Blog

    Silahkan buka Blogger > Tema > Klik Edit HTML

    Cari kode di bawah ini dan temukan kode # di bawahnya lalu ganti kode # dengan link blog Anda

    
    
      <nav id='mudahmenu' itemscope='itemscope' itemtype='https://schema.org/WPHeader'>
    <div id='head-mobile'/>
    <div class='button' id='menu-button'/>
    <ul>
    <li><a href='#' itemprop='url'><span itemprop='name'>Download</span></a></li>
    <li><a href='#' itemprop='url'><span itemprop='name'>Menu</span></a>
      <ul>
    	<li><a href='#' itemprop='url'><span itemprop='name'>Tentang Tema</span></a></li>
    	<li><a href='#' itemprop='url'><span itemprop='name'>Cara Instal</span></a></li>
    	<li><a href='#' itemprop='url'><span itemprop='name'>All Style</span></a></li>
    	<li><a href='#' itemprop='url'><span itemprop='name'>Tutorial</span></a></li>
      </ul>
    </li>
    <li><a href='#' itemprop='url'><span itemprop='name'>Lainnya</span></a>
      <ul>
    	<li><a href='#' itemprop='url'><span itemprop='name'>Fitrah 3 Coloum</span></a></li>
    	<li><a href='#' itemprop='url'><span itemprop='name'>Fitrah Lite</span></a></li>
    	<li><a href='#' itemprop='url'><span itemprop='name'>Fitrah Amp</span></a></li>
    	</ul>
    </li>
    
    </ul>
    </nav>
    


    Memasang Iklan Adsense atau yang Lain

    Pada tamplet ini menyediakan 4 slot iklan yang dapat anda gunakan untuk menayangkan iklan. Semunya biasa ada custom sesuai keinginan anda. 

    1. Top Ads Section

    Silahkan buka Blogger > Tata Letak > Edit Banner Ads and Auto Ads

    2. Under Title Ads

    Silahkan buka Blogger > Tema > Klik Edit HTML

    Cari kode berikut dan ganti dengan kode iklan.

    
    <!-- Slot Iklan Bawah Judul | Ganti semua kode disini dengan Kode iklan anda -->
    

    3. Midle Ads 1 and 2

    Silahkan buka Blogger > Tema > Klik Edit HTML

    Cari kode berikut dan ganti dengan kode iklan.

    
    <!-- Slot Iklan Tengah 1 | Ganti semua kode disini dengan Kode iklan anda -->
    <!-- Slot Iklan Tengah 2 | Ganti semua kode disini dengan Kode iklan anda -->
    

    4. Bottom Ads

    Silahkan buka Blogger > Tema > Klik Edit HTML

    Cari kode berikut dan ganti dengan kode iklan.

    
    <!-- Slot Iklan Bawah Artikel | Ganti semua kode disini dengan Kode iklan anda -->
    


    Memasang Table Responsive

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


    Memasang Youtube Responsive

    
    <div class="videoyoutube">
    <div class="video-responsive">
    <div class="video-youtube loader" data-src="//www.youtube.com/embed/_1EYAH8dmx0">
    </div>
    </div>
    </div>

    Memasang TOC Otomatis

    Memasang toc blogger cukup mudah, hanya tinggal menentukan heading dalam artikel h2 dan h3.

    Pilih menu paragraf, pilih judul atau sub judul, karena hanya kedua heading tersebut yang akan secara otomatis terbaca. 

    Memasang TOC Otomatis


    Mengubah Rating Pencarian Goole


    
    <script type='application/ld+json'> { &quot;@context&quot;: &quot;https://schema.org/&quot;, &quot;@type&quot;: &quot;CreativeWorkSeries&quot;, &quot;name&quot;: &quot;<data:blog.pageName/>&quot;, &quot;aggregateRating&quot;: { &quot;@type&quot;: &quot;AggregateRating&quot;, &quot;ratingValue&quot;: &quot;5&quot;, &quot;bestRating&quot;: &quot;5&quot;, &quot;ratingCount&quot;: &quot;127&quot; } } </script>
    
    

    Mengubah Foto Profil dan Deskripsi Penulis


    5 komentar: