Inilah Panduan Installasi Premium Blogger Template Sevida Responsive

Sebelum menuju ke petunjuk installasi dan pemakaian template ini, ada baiknyaaa sahabat kembali mereview artikel template Sevida Responsive ini. Di sana akan ada link live demonyaaa dan link download template-nyaaa.

Bila sudah siap, mari kita uraikan satu persatu proses installasi dari awal sampai terbentuk blog yaaang menarik.

Panduan Installasi Premium Blogger Template Sevida Responsive

Installasi

Masuk ke admin blogn blogger. Menuju ke sajian template. Klik Backup and Restore. Lalu Upload file template yaaang telah diunduh.

Lengkapnyaaa, silakan baca Cara Mengganti Template Blog.

Pengenalan Layout

1. Right Header Widget Area(Ads 468x60)
2. Auto Featured Post Area
3. Top Sidebar Area
4. Middle Sidebar Area
a. Popular Post
b. Recent Comment 
c. Archive Widget
5. Bottom Sidebar Area
6. Label Post Widget Area
7. Footer Widget Area
8. Manual Featured Post Area (work with Image Widget)

Pengaturan Menu

Untuk mengedit kedua sajian atas, Tutorial Caranyaaa menuju ke HTML pada sajian Template, kemudian cari instruksi ini.

<ul class='sf-menu' id='topmenunav'>
  <li><a href='#'>About</a></li>
  <li><a href='#'>Contact</a></li>
  <li><a href='#'>More</a>
    <ul>
      <li><a href='#'>Menu 1</a></li>
      <li><a href='#'>Menu 2</a></li>
      <li><a href='#'>Menu 3</a></li>
      <li><a href='#'>Menu 4</a></li>
    </ul>
  </li>
  <li><a href='#'>Menu</a></li>

</ul>

Ganti # dengan URL blog.

Untuk sajian tengah, cari instruksi berikut.

<ul class='sf-menu' id='menunav'>
  <li><a class='home' expr:href='data:blog.homepageUrl'>Home</a></li>
  <li><a href='#'>About</a></li>
  <li><a href='#'>Archive</a></li>
  <li><a href='#'>Comments</a></li>
  <li><a href='#'>With Sub Menu</a>
    <ul>
      <li><a href='#'>Sub Menu</a></li>
      <li><a href='#'>Sub Sub Menu</a>
        <ul>
          <li><a href='#'>Sub Menu</a></li>
          <li><a href='#'>Sub Menu</a></li>
          <li><a href='#'>Sub Menu</a></li>
          <li><a href='#'>Sub Menu</a></li>
        </ul>
      </li>
      <li><a href='#'>Sub Menu</a></li>
      <li><a href='#'>Sub Menu</a></li>
    </ul>
  </li>
  <li><a href='#'>Error 404</a></li>

</ul>

Ganti # dengan URL blog.

Pengaturan Social Icon

Masih pada area HTML Template, silakan cari instruksi ini.

<ul class='sociico' id='icon-socialmn'>
  <li class='sotw'><a href='#' target='_blank'>twitter</a></li>
  <li class='sofb'><a href='#' target='_blank'>facebook</a></li>
  <li class='sogo'><a href='#' target='_blank'>google</a></li>
  <li class='sorss'><a href='#' target='_blank'>rss</a></li>
  <li class='solinkn'><a href='#' target='_blank'>linkedin</a></li>
  <li class='sodrib'><a href='#' target='_blank'>dribbble</a></li>
  <li class='sopint'><a href='#' target='_blank'>pinterest</a></li>

</ul>

Ganti # dengan URL media umum milik sahabat.

Pengaturan Waktu

Cari kode
datetime(); 

Lalu rubah dengan pengaturan sesuai kebutuhan pada instruksi berikut.

datetime({
months:["January","February","March","April","May","June","July","August","September","October","November","December"]

});

Ganti bulan diubahsuaikan bahasanyaaa.

Auto Featured Posts

Menuju ke sajian layout, kemudian Add a Gadget, pilih HTML/Javascript. Pastekan instruksi berikut ini.

<div id="featpost"></div>
<script type='text/javascript'>
jQuery("#featpost").AutofeaturedPost({
MaxPost:5
});

</script>

MaxPost ialah jumlah postingan yaaang akan muncul di widget featured tersebut.

Manual Featured Slideshow

Membuat featured posts seTutorial Cara manual yaaakni dengan Tutorial Cara sama, namun widget yaaang dipilih ialah Image Widget.

Lalu isi kolom yaaang tersedia.
1. Judul postingan
2. Diskripsi gambar
3. Link tujuan ketika gambar diklik.
4. Upload gambar.
5. Hilangkan centang Shrink to fit.

Akhiri dengan Save.

Jika sahabat ingin menciptakan 5 slide, maka ulangi Tutorial Cara tadi sebanyaaak 5 kali pula.

Kemudian untuk merubah kecepatan slideshow, silakan sahabat kembali ke Template di area HTML. Cari instruksi :

manualfeaturedPost();

Lalu ganti dengan instruksi ini.

manualfeaturedPost({
slideSpeed:5000,
animation:"slide"

});

SlideSpeed ialah kecepatan slide animasi dalam milisecond.

Klik Save template.

Post by Label Slider

Add a gadget, pilih HTML/Javascript, kemudian pastekan instruksi ini.

<div id="sportpost"></div>
<script type='text/javascript'>
jQuery("#sportpost").RecentPostbyTag({
MaxPost:9,
ImageSize:"s180-p",
postType:"s",
tagName:"Sports"
});

</script>

Klik Save. Ganti tagName sesuai label yaaang ingin ditampilkan.

Post by Label Vertical

Add a Gadget, pilih HTML/Javascript, kemudian paste instruksi berikut.

<div id="musicpost"></div>
<script type='text/javascript'>
jQuery("#musicpost").RecentPostbyTag({
MaxPost:6,
FirstImageSize:"s220-p",
ImageSize:"s80-p",
tagName:"Music",
postType: "v",
MoreText: "View All About",
AjaxLoad: true,
MoreNumPost: 6
});

</script>

Klik Save. Ganti tagName sesuai label yaaang ingin ditampilkan. Maxpost dan MoreNumPost harus sama.

Post by Label Horisontal

Add a Gadget, kemudian pilih HTML/Javascript, paste instruksi berikut.

<div id="webpost"></div>
<script type='text/javascript'>
jQuery("#webpost").RecentPostbyTag({
MaxPost:6,
FirstImageSize:"s220-p",
ImageSize:"s80-p",
tagName:"Web Design",
postType: "h",
MoreText: "View All About",
AjaxLoad: true,
MoreNumPost: 6
});

</script>

Klik Save. Ganti tagName dengan label yaaang ingin ditampilkan.

Pengaturan Error Page

Menuju ke HTML Template. Cari instruksi ini.

404 Not Found

Lalu kata-kata yaaang menyerupai dalam gambar silakan diganti dengan bahasa kita.

Membuat Halaman Arsip

Caranyaaa ialah Creat a new page. Lalu paste instruksi berikut ke area HTML.

<div id="table-outer"><table border="0"><tr><td><label>Sort List by:</label></td><td><select id="orderFeedBy"><option value="published" selected>Latest Published</option><option value="updated">Latest Update</option></select></td></tr><tr><td><label>Sort List by Category:</label></td><td><span id="labelSorter"><select disabled><option selected>Loading...</option></select></span></td></tr><tr><td><label>Search with Keyword:</label></td><td><form id="postSearcher"><input type="text"/></form></td></tr></table></div><header id="resultDesc"></header><ul id="feedContainer"></ul><div id="feedNav">Loading...</div>

<script src="http://guinys-mkr.googlecode.com/svn/trunk/JS/archive.min.js" type="text/javascript"></script>

Akhiri dengan Publish.

Halaman Navigasi

Menuju ke HTML area sajian Template. Cari 2 instruksi ini.

viewMode({
  viewmodedefault:'list',
  cookielist:'list1',
  cookiegrid:'grid1'
});
loadMorePost({
  viewmodedefault:'list',
  cookielist:'list1',
  cookiegrid:'grid1',
  thumbnailSize:"s180-c",
  summaryLength:200,
  MoreText:"Load more posts"

});

dan instruksi ini.

viewMode();
loadMorePost({
  thumbnailSize:"s180-c",
  summaryLength:200,
  MoreText:"Load more posts"

});

Lalu keduanyaaa diganti dengan instruksi berikut.

viewMode();
pageNavi({
postperpage:6,
numshowpage:3,
thumbnailSize:"s180-c",
summaryLength:200,

});

Recent Comment

Menuju ke layout, kemudian Add a Gadget dan pilih HTML/Javascript. Paste instruksi berikut.

<div id="rcentcomnets"></div>
<script type='text/javascript'>
RecentComments();

</script>

Klik Save.

Merubah Tema

Mengatur tema desain template sanggup dirubah dengan Tutorial Cara customisasi. Masuk ke sajian Template, kemudian pilih Customize. Rubah sesuai kebutuhan. Namun ingat, Customize ini hanyaaa akan muncul jikalau template dalam keadaan enable untuk versi mobile. Jika tidak, maka layaaanan ini tidak muncul. Makara pastikan kondisi template versi mobile harus enabled.

Demikian, panduan pemakaian template Sevida Responsive Blogger Template. Semoga bermanfaat.

Jika ada yaaang kurang paham dan masih ada kebingungan, silakan tulis di kolom komentar yaaang tersedia.