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

Publister is a modern magazine blogger template with tons of built in features and widgets. It features a custom homepage layout with label based recent post widgets. Publister 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.

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. Featured Posts
Atas Posting Blog: Business, Food, Fashion.

Bawah Posting Blog: Nature, Sports, Technology, Music.

Jenis (types): feat-big, col-left, col-right, feat-list, grid-big, grid-small
Shortcode: Results number/Label, recent or random/type

Tabel aplikasi

No	Type / Jenis	Sintak / Cara Penggunaan
1	feat-big	Sports/feat-big recent/feat-big random//feat-big
2	col-left	3/Sports/col-left 3/recent/col-left 3/random/col-left
3	col-right	3/Sports/col-right 3/recent/col-right 3/random/col-right
4	feat-list	3/Sports/feat-list 3/recent/feat-list 3/random/feat-list
5	grid-big	3/Sports/grid-big 3/recent/grid-big 3/random/grid-big
6	grid-small	3/Sports/grid-small 3/recent/grid-small 3/random/grid-small

Catatan: 'feat-big' tidak menggunakan 'Result Number'
Business (feat-big)
Isi 'Konten': Business/feat-big

Food (feat-list)
Isi 'Konten': 3/Food/feat-list

Fashion (grid-small)
Isi 'Konten': 3/Fashion/grid-small

Nature (grid-small)
Isi 'Konten': 3/Nature/grid-small

Sports (col-left)
Isi 'Konten': 3/Sports/col-left

Technology (col-right)
Isi 'Konten': 3/Technology/col-right

Music (grid-big)
Isi 'Konten': 2/Music/grid-big

D. 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] Fashion - Hot Posts.
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: 'boxedVersion' dan 'recentPostsHeadline'
Isi Name dengan 'boxedVersion' - 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 .
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

No	Pilihan / Menu	Contoh URL
1	Home	https://kuncisuksesblogger.blogspot.com/
2	Features	https://kuncisuksesblogger.blogspot.com/
3	_Multi DropDown	https://kuncisuksesblogger.blogspot.com/
4	__DropDown 1	https://kuncisuksesblogger.blogspot.com/
5	__DropDown 2	https://kuncisuksesblogger.blogspot.com/
6	__DropDown 3	https://kuncisuksesblogger.blogspot.com/
7	_ShortCodes	https://kuncisuksesblogger.blogspot.com/
8	_SiteMap	https://kuncisuksesblogger.blogspot.com/
9	_Error Page	https://kuncisuksesblogger.blogspot.com/
10	Mega Menu	recent/mega-menu
11	Video Documentation	https://kuncisuksesblogger.blogspot.com/
12	Documentation	https://kuncisuksesblogger.blogspot.com/
13	Download This Template	https://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. Fashion - Hot Posts

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] Business, [2] Food, [3] Fashion, [4] Posting Blog, [5] Nature, [6] Sports, [7] Technology, [8] Music, [9] Social Plugin, [10] Popular Posts, [11] Facebook, [12] Featured Post, [13] Sidebar Ads, [14] Follow by Email.
2.1. Business
Pada bagian 'Konten' isikan: Business/feat-big
2.2. Food
Pada bagian 'Konten' isikan: 3/Food/feat-list
2.3. Fashion
Pada bagian 'Konten' isikan: 3/Fashion/grid-small
2.4. Posting Blog
Pada bagian 'Jumlah postingan di halaman utama:' isikan jumlah postingan per halaman.
2.5. Nature
Pada bagian 'Konten' isikan: 3/Nature/grid-small
2.6. Sports
Pada bagian 'Konten' isikan: 3/Sports/col-left
2.7. Technology
Pada bagian 'Konten' isikan: 3/Technology/col-right
2.8. Music
Pada bagian 'Konten' isikan: 2/Music/grid-big
2.9. Social Plugin
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 .
2.10. Popular Posts
Mengkonfigurasikan Postingan Populer.
2.11. 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'.
2.12. Featured Post
Mengkonfigurasikan Postingan Featured.
2.13. Sidebar Ads
Mengkonfigurasikan iklan sisi kanan.
Isi 'Konten' dengan:

<center>
<a href='#'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKCqPnYJZ3eiWvbYtdZOB1xngrEr7YRp08ICauXcgHrovGx7T9wG37igPwPwxvOW6kovOLJFD9k_Gghz8k0QeJskCgFXbbuD6rOst_cJaTOG2LrJxt4AXb-FI-2zfv3Q1AzN94poJE3XAE/s300/ad300.gif' alt='sidebar ads'/>
</a>
</center>

Silahkan ganti 'URL warna merah'.
2.14. Follow by Email
Mengkonfigurasikan Ikuti lewat Email.

Bagian 3:

Pada bagian 3 terdapat: [1] Random Posts, [2] Categories, [3] Tags, [4] Recent Posts, [5] Menu Footer Widget, dan [6] Copyright Footer Credit.
3.1. Random Posts
Isi Konten dengan: 3/random/post-list
3.2. Categories
Konfigurasikan label, kemudian klik 'Simpan'.
3.3. Tags
Konfigurasikan label, kemudian klik 'Simpan'.
3.4. Recent Posts
Isi Konten dengan: 3/recent/post-list
3.5. Menu Footer Widget
Mengonfigurasi Daftar Link - Menu Footer Widget.
3.6. 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://publister-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://publister-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:

No	Pilihan Typography	Fungsi
1	Text Size	Mengatur ukuran Font
2	Format	Mengatur Teks - Heading, Subheading, Minor Heading, dan Normal
3	Bold	Mempertebal Teks
4	Italic	Mencetak miring Teks
5	Underline	Menggaris-bawahi Teks
6	Strikethrough	Mencoret Teks
7	Text Color	Memberi warna pada Teks
8	Text Background Color	Memberi warna latar belakang Teks
9	Link	Membuat 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>  </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://publister-ksb.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script>
</div>

Silahkan ganti 'https://publister-ksb.blogspot.com' dengan nama blog saudara.

Video (menyusul):

Download:

Publister Premium
Sekian. Teima kasih.

Kunci Sukses Blogger

Popular All Time

Labels

Blog Archive

Showing result(s) for

Popular Posts

Pages

Ads 728 x 90

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

Download:

Michael Sugiharto Hoo

Post A Comment:

0 comments:

footer about

Kunci Sukses Blogger

Popular All Time

Labels

Blog Archive

Showing result(s) for

Popular Posts

Pages

Ads 728 x 90

Main Menu

Download:

Next

Newer Post

Previous

Older Post

Michael Sugiharto Hoo

Blogger Template

Post A Comment:

0 comments: