Kunci Sukses Blogger

Kunci Sukses Blogger
Blog & Tutorial

Ads 728 x 90

Enside Blogger Template Free Download Plus Tutorial From Zero - REMOVED FOOTER CREDIT

Share it:

Enside blogger template is a semi magazine template with great features like featured post, social media widgets ready and a lot of space for adsense ads. Enside is equipped with various of widgets which will help you to publish your blog more professionally. To make it easy for you we have published this detailed documentation, so that you can setup your blog correctly. You have made a good decision by choosing our template.

Specifications:

No Features Availability
1 Responsive True Check
2 Google Testing Tool Validator True Check
3 SEO Friendly True 100%
4 Mobile Friendly True Check
5 404 page True Check
6 Loading Speed True Check
7 Featured Post True
8 Full Width Post Layout True
9 Auto Read More With Thumbnail True
10 Ads Ready True
11 Two types of menu True
12 Multi Dropdown Menu True
13 Search Widget True
14 Colourful Social Widgets True
15 Related Posts with Thumbnail True
16 Social Share Button True
17 Email Newsletter Widget True
18 3 Types of Comments True
19 Recent Post Widget True
20 Label Post Widget True
21 Detailed Documentation True
22 Video Documentation True
23 Widget Codes (Premium) True

Preview Proof
Saksikan: 10 Kunci Dasar Menguasai Blogger | Step by Step Video Tutorial:


MAGAZINE WIDGETS:
A. Post Layouts:
Left Sidebar: Didalam postingan tambahkan teks 'left-sidebar' dan diberi gaya Strikethrough.
Full Width: Didalam postingan tambahkan teks 'full-width' dan diberi gaya Strikethrough.
Right Sidebar: Didalam postingan tambahkan teks 'right-sidebar' dan diberi gaya Strikethrough.
B. Hot Posts (Fashion)
Parameter Hot Posts ada 3 macam:
Hot Posts menggunakan Label: 'Label/hot-posts', misalnya: Technology/hot-posts
Hot Posts menggunakan Recent Posts: recent/hot-posts
Hot Posts menggunakan Random Posts: random/hot-posts
C. Post List Widget:
Contoh: 'Random Posts' dan 'Recent Posts', juga bisa diletakkan di side bar.
Shortcode-nya: "Angka"+"/"+"Label Post" atau "recent" atau "random"+"/post-list"
Sintak-nya:
Label Posts: 3/Technology/post-list
Recent Posts: 3/recent/post-list
Random Posts: 3/random/post-list

Bagian 1
Pada bagian 1 terdapat: [1] Favicon, [2] Css Options, [3] Default Variables, [4] Top Menu / Footer Menu, [5] Top Social Media, [6] Header, [7] Header Ads, [8] Mobile Logo, [9] Main Menu, [10] Hot Posts (People).
1.1. Favicon
Menghapus / mengedit ikon favorit (Favicon). Klik untuk menghapus Favicon, lalu pilih untuk memilih file gambar Favicon, kemudian klik .
1.2. Css Options
Terdapat dua hal, yaitu: 'fullWidth' dan 'recentPostsHeadline'
Isi Name dengan 'fullWidth' - isi URL dengan 'true' atau 'false'.
Isi Name dengan 'recentPostsHeadline' - isi URL dengan 'true' atau 'false'.
1.3. Default Variables

Terdapat 4 hal, yaitu:
Isi Name disqusShortname - isi URL dengan nama disqus saudara.
Isi Name commentsSystem - isi URL dengan 'blogger', / 'facebook' / 'disqus' / 'hide'.
Isi Name fixedSidebar - isi URL dengan 'true' atau 'false'
Isi Name postPerPage - isi URL dengan jumlah postingan yang ditampilkan per halaman.
1.4. Top Menu / Footer Menu
Seperti biasa isi 'Nama Situs Baru' lalu isi juga 'URL Situs Baru', klik . Setelah terletak dibawah, saudara bisa gunakan klik  untuk mengedit Name dan URL, atau klik  untuk menghapus. Gunakan juga klik  dan klik  untuk mengatur susunan Link List - Main Menu. Setelah OK klik .
1.5. Top Social Media
Seperti biasa isi 'Nama Situs Baru' lalu isi juga 'URL Situs Baru', klik . Setelah terletak dibawah, saudara bisa gunakan klik  untuk mengedit Name dan URL, atau klik  untuk menghapus. Gunakan juga klik  dan klik  untuk mengatur susunan Link List - Main Menu. Setelah OK klik .
Ikon media sosial yang disediakan: blogger, facebook, twitter, gplus, rss, youtube, skype, stumbleupon, tumblr, vk, stack-overflow, github, linkedin, dribbble, soundcloud, behance, digg, instagram, pinterest, twitch, delicious, codepen, flipboard, reddit, whatsapp, messenger, snapchat, email.
1.6. Header
Mengganti / menghapus Logo Blog. Saudara bisa klik  untuk menghapus Logo Blog, lalu pilih , lalu pilih penempatan:  dan klik .
1.7. Header Ads
Menempatkan Iklan atau Advertising pada Header. Isi dengan script saudara atau silahkan isi dengan script berikut ini:
<a href='#'>
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjX4FA7U0jh9iDpCsDnrw_p0nq3q7pgPMrbwL25yHHblOs2ZoV2vNVzNjZOt90ZO8RcvkzRjyg7K6l85OABr2rNidf0XDHV6FNyqyWsPAeh8-ia0AtS6S2Fx4uA-w84PWZyyZCx2JinMOBz/s728/ad728.png' alt='header ads'/></a>
Silahkan ganti 'URL yang berwarna merah'.
1.8. Mobile Logo
Mengganti / menghapus Logo Blog yang terlihat di Mobile. Saudara bisa klik  untuk menghapus Logo Blog, lalu pilih , kemudian pilih Penempatan:  dan klik .
1.9. Main Menu
Seperti biasa isi 'Nama Situs Baru' lalu isi juga 'URL Situs Baru', klik . Setelah terletak dibawah, saudara bisa gunakan klik  untuk mengedit Name dan URL, atau klik  untuk menghapus. Gunakan juga klik  dan klik  untuk mengatur susunan Link List - Main Menu. Setelah OK klik .
Contoh:
NoPilihan / MenuContoh URL
1Homehttps://kuncisuksesblogger.blogspot.com/
2Featureshttps://kuncisuksesblogger.blogspot.com/
3_Multi DropDownhttps://kuncisuksesblogger.blogspot.com/
4__DropDown 1https://kuncisuksesblogger.blogspot.com/
5__DropDown 2https://kuncisuksesblogger.blogspot.com/
6__DropDown 3https://kuncisuksesblogger.blogspot.com/
7_ShortCodeshttps://kuncisuksesblogger.blogspot.com/
8_SiteMaphttps://kuncisuksesblogger.blogspot.com/
9_Error Pagehttps://kuncisuksesblogger.blogspot.com/
10Mega Menurecent/mega-menu
11Video Documentationhttps://kuncisuksesblogger.blogspot.com/
12Documentationhttps://kuncisuksesblogger.blogspot.com/
13Download This Templatehttps://kuncisuksesblogger.blogspot.com/
Saudara bisa mengganti contoh URL diatas.
Ada 3 Macam Mega Menu Shortcode:
Mega Menu Shortcode menggunakan Label: Technology/mega-menu
Mega Menu Shortcode menggunakan Recent Post: recent/mega-menu
Mega Menu Shortcode menggunakan Random Post: random/mega-menu
1.10. Hot Posts (People)
Klik 'Edit', lalu isi konten dengan 'Technology/hot-posts'.
Parameter Hot Posts ada 3 macam:
Hot Posts menggunakan Label: 'Label/hot-posts', misalnya: Fashion/hot-posts
Hot Posts menggunakan Recent Posts: recent/hot-posts
Hot Posts menggunakan Random Posts: random/hot-posts

Bagian 2:
Pada bagian 2 ini terdapat: [1]. Postingan Blog, [2]. Social Media Side Bar, [3]. Featured Post, [4]. Popular Posts, [5]. Facebook, [6]. Advertisement, [7]. Follow by Email, [8]. Categories, [9]. Tags.
1. Postingan Blog
Pada bagian 'Jumlah postingan di halaman utama:' isikan jumlah postingan per halaman.
2. Social Media Side Bar
Mengonfigurasi Daftar Link 'Social Media Side Bar'
Seperti biasa isi 'Nama Situs Baru' lalu isi juga 'URL Situs Baru', klik . Setelah terletak dibawah, saudara bisa gunakan klik  untuk mengedit Name dan URL, atau klik  untuk menghapus. Gunakan juga klik  dan klik  untuk mengatur susunan Link List - Main Menu. Setelah OK klik .
3. Featured Post
Konfigurasikan Entri yang Diunggulkan
4. Popular Posts
Konfigurasikan Postingan Populer
5. Facebook
Isi bagian 'Konten' dengan:
<center>
<div class="fb-page" data-href="https://www.facebook.com/arnold" data-width="360" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true">
</div>
</center>
Silahkan ganti 'URL warna merah'.
6. Advertisement / Banner
Menampilkan kotak banner pada sisi kanan.
Isi 'Konten' dengan:
<div style="width:100%;height:250px;margin:0 auto;text-align: center;line-height: 250px;color: #000;text-transform: uppercase;font-size: 30px;font-weight: bold;cursor: pointer;border: 5px solid #ccc;box-sizing: border-box;">AD BANNER</div>
Silahkan ganti dengan kode lain.
7. Follow by Email
Mengonfigurasi Ikuti Lewat Email.
8. Categories
Konfigurasikan label.
9. Tags
Konfigurasikan label.

Bagian 3:
Pada bagian 3 terdapat: [1]. Gambar, [2]. Teks, [3]. Search This Blog, [4]. Random Posts, [5]. Recent Posts, [6]. Menu Footer Widget, [7]. Copyright Footer Credit.
1. Gambar
Mengonfigurasi Gambar.
2. Teks
Mengonfigurasi Teks.
3. Search This Blog
Konfigurasikan Kotak Penelusuran.
4. Random Posts
Pada 'Konten' isikan: 3/random/post-list
5. Recent Posts
Pada 'Konten' isikan: 3/recent/post-list
6. Menu Footer Widget
Mengonfigurasi Daftar Link - Menu Footer Widget.
7. Copyright Footer Credit
Menambahkan 'Copyright Footer Credit'.
Ada banyak cara untuk menambahkan 'Copyright Footer Credit'. Langkah-langkahnya:
  • Buka dashboard, klik 'Theme', lalu klik 'Edit HTML'.
  • Tempatkan kursor di dalam 'script editor box'.
  • Gunakan 'CTRL+F'.
  • Isi dengan "<div class='copyright-area'>".
  • Tekan 'Enter'.
  • Letakkan 'Copyright Footer Credit Code' diantara '<div class='copyright-area'>' dan </div>.
<div class='copyright'>
<!-- Your Copyright Footer Code -->
</div>
'Copyright Footer Credit Code' dengan Tahun Otomatis:
<a href="https://enside-ksb.blogspot.com/">Nama Blog Kamu</a> © 2019-<script>document.write(new Date().getFullYear())</script>. All Rights Reserved.
'Copyright Footer Credit Code' tanpa Tahun Otomatis:
<a href="https://enside-ksb.blogspot.com/">Nama Blog Kamu</a> © 2019-2020. All Rights Reserved.
Ganti 'URL warna merah' with URL saudara, lalu ganti 'Nama Blog Kamu' juga.

Bagian 4: Features - Shortcodes
Pada bagian 4 terdapat:
[1] Drop Caps, [2] Typography (Font size, Format - Text Heading Style, Bold, Italic, Underline, Strikethrough, Text color, Text Background Color, Link), [3] Tables, [4] Blockquote, [5] Numbering List and Bullet List, [6] Buttons (Simple Buttons, Buttons With Icons), [7] Alert Boxes, [8] Code Box, [9] Contact Form.
4.1. Drop Caps
Gunakan script berikut: <span class="firstcharacter">L</span>, dimana L adalah huruf pertama didalam suatu paragraf. Hasilnya sebagai berikut:
4.2. Typography
Lihat tabel:
NoPilihan TypographyFungsi
1Text SizeMengatur ukuran Font
2FormatMengatur Teks - Heading, Subheading, Minor Heading, dan Normal
3BoldMempertebal Teks
4ItalicMencetak miring Teks
5UnderlineMenggaris-bawahi Teks
6StrikethroughMencoret Teks
7Text ColorMemberi warna pada Teks
8Text Background ColorMemberi warna latar belakang Teks
9LinkMembuat URL
4.3. Tabel
Gunakan script dibawah ini:
<div class="post-table">
<table>
<thead>
<tr>
        <th>First Name</th>
        <th>Last Name</th>
        <th>Hero Title</th>
</tr>
</thead>
<tbody>
<tr>
        <td data-label="First Name">Bruce</td>
        <td data-label="Last Name">Wayne</td>
        <td data-label="Hero Title">Batman</td>
</tr>
<tr>
        <td data-label="First Name">Peter</td>
        <td data-label="Last Name">Parker</td>
        <td data-label="Hero Title">Spiderman</td>
</tr>
<tr>
        <td data-label="First Name">Bruce</td>
        <td data-label="Last Name">Banner</td>
        <td data-label="Hero Title">The Hulk</td>
</tr>
<tr>
        <td data-label="First Name">Clark</td>
        <td data-label="Last Name">Kent</td>
        <td data-label="Hero Title">Superman</td>
</tr>
</tbody>
</table>
</div>
4.4. Blockquote
Arahkan mouse ke dalam suatu teks atau paragraf, kemudian klik 'Quote'. Kemudian hasilnya sebagai berikut:4.5. Numbering List dan Bullet List
Gunakan Numbering List dan Bullet List, sehingga hasilnya:4.6. Buttons
Simple Buttons:
Gunakan Script dibawah ini:
<div class="small-button">
<a class="button small" href="https://www.blogger.com">Button Small</a>
<a class="button medium" href="https://www.blogger.com">Button Medium</a>
<a class="button large" href="https://www.blogger.com">Button Large</a>
</div>
Silahkan ganti 'https://www.blogger.com' dengan 'URL saudara'.
Buttons With Icons:
Gunakan Script dibawah ini:
<div class="small-button">
<a class="button small demo" href="https://www.blogger.com">Demo Button</a>
<a class="button medium demo" href="https://www.blogger.com">Demo Button</a>
<a class="button large demo" href="https://www.blogger.com">Demo Button</a>
<br>
<div class="clear">
</div>
<a class="button small download" href="https://www.blogger.com">Download Button</a>
<a class="button medium download" href="https://www.blogger.com">Download Button</a>
<a class="button large download" href="https://www.blogger.com">Download Button</a>
<br>
<div class="clear">
</div>
<a class="button small buy" href="https://www.blogger.com">Buy Now Button</a>
<a class="button medium buy" href="https://www.blogger.com">Buy Now Button</a>
<a class="button large buy" href="https://www.blogger.com">Buy Now Button</a>
<br>
<div class="clear">
</div>
<a class="button small visit" href="https://www.blogger.com">Visit a Link Button</a>
<a class="button medium visit" href="https://www.blogger.com">Visit a Link Button</a>
<a class="button large visit" href="https://www.blogger.com">Visit a Link Button</a>
</div>
Silahkan ganti 'https://www.blogger.com' dengan 'URL saudara'.
4.7. Alert Boxes
Gunakan Script dibawah ini:
    <div class="alert-message success">
    <i class="fa fa-check-circle"></i> success message You successfully read this important message.</div>
    <div class="alert-message alert">
    <i class="fa fa-info-circle"></i> Alert message This alert needs your attention.</div>
    <div class="alert-message warning">
    <i class="fa fa-exclamation-triangle"></i> Warning message Warning! Best check yo self.</div>
    <div class="alert-message error">
    <i class="fa fa-exclamation-circle"></i> Error message Oh snap! Change a few things up</div>
    </div>
    4.8. Code Box
    Gunakan Script dibawah ini: <pre> <!-- Your Code --> </pre>
      <pre>function generate() {
          var a = $('#container').html();
          var b = window.open('', '', 'width=600,height=400');
          b.document.write('&lt;textarea&gt;' + a + '&lt;/textarea&gt;');
      }</pre>
      4.9. Contact Form
      Gunakan Script dibawah ini:
        <div class="contact-form">
        <div class="contact section" id="contact" style="display: block;">
        <div class="widget ContactForm" id="ContactForm1">
        <div class="contact-form-widget">
        <div class="form">
        <form name="contact-form">
        <input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" placeholder="Name" size="30" type="text" value="" />
                                        <input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" placeholder="Email" size="30" type="text" value="" />
                                        <textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="email-message" placeholder="Message" rows="5"></textarea>
                                        <input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="Send" />
                                        <br />
        <div style="text-align: center; width: 100%;">
        <div class="contact-form-error-message" id="ContactForm1_contact-form-error-message">
        </div>
        <div class="contact-form-success-message" id="ContactForm1_contact-form-success-message">
        </div>
        </div>
        </form>
        </div>
        </div>
        </div>
        </div>
        </div>

        Bagian 5: Sitemap
        Gunakan Script berikut ini:
        <style type="text/css">
        
        #toc{
        width:99%;
        margin:5px auto;
        border:1px solid #2D96DF;
        -webkit-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);
        -moz-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);
        box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);
        }
        
        .labl{
        color:#FF5F00;
        font-weight:bold;
        margin:0 -5px;
        padding:1px 0 2px 11px;
        background:-moz-linear-gradient(right,#C2EAFE 0%,#055A85 40%);
        background:-webkit-gradient(linear,left 10,right 80,color-stop(0.20,#055A85),color-stop(1,#C2EAFE));
        border:1px solid #2D96DF;
        border-radius:4px;-moz-border-radius:4px;
        -webkit-border-radius:4px;box-shadow:3px 3px 1px #bbb;
        -moz-box-shadow:3px 3px 1px #bbb;-webkit-box-shadow:3px 3px 1px #bbb;display:block;
        }
        
        .labl a{
        color:#fff;
        }
        
        .labl:first-letter{text-transform:uppercase;
        }
        
        .new{
        color:#FF5F00;
        font-weight:bold;
        font-style:italic;
        }
        
        .postname{
        font-weight:normal;
        background:-moz-linear-gradient(right,#C2EAFE 0%,#fff 40%);
        background:-webkit-gradient(linear,left 80,right 10,color-stop(0.60,#fff),color-stop(1,#C2EAFE));
        }
        
        .postname li{
        border-bottom: #ddd 1px dotted;
        margin-right:5px
        }
        
        </style>
        
        <div id="toc">
        <script src="http://makingdifferent.github.io/blogger-widgets/sitemappage.js" type="text/javascript"></script>
        <script src="https://enside-ksb.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
        </script>
        </div>
        Silahkan ganti 'https://enside-ksb.blogspot.com' dengan nama blog saudara.

        Video (menyusul):

        Download:

        Enside Premium
        Sekian. Teima kasih.
        Share it:

        Blogger Template

        Post A Comment:

        0 comments: