Showing posts with label Blog Design. Show all posts
Showing posts with label Blog Design. Show all posts

Wednesday, 9 January 2019

Mencari LSI Keyword dan Menggunakannya Untuk Meningkatkan Traffic SEO?

Dalam posting kali ini, saya akan menunjukkan untuk anda secara rincian tentang salah satu konsep SEO yang penting yaitu Lantent Semantic Indexing Keyword (LSI Keywords). Kami juga akan menjelaskan bagaimana cara menggunakan LSI keyword dalam strategi meningkatkan trafic konten dan blog anda.

Mesin pencari seperti Google lebih memprioritas untuk memahami apa kebutuhan pengguna ketika mencari frase kata kunci. Google sekarang lebih suka halaman dengan informasi konten yang baik dan panjang yang menjelaskan topik yang dibahas daripada halaman dengan konten tipis yang dioptimalkan dengan satu kata kunci.

Apa Itu LSI Keywords?

LSI keyword atau Lantent Semantic Indexing Keyword adalah frase kata yang berhubungan dengan kata kunci utama anda. LSI keyword atau Lantent Semantic Indexing Keyword adalah frase kata yang berhubungan dengan kata kunci utama anda. Ini kadang-kadang bisa berupa sinonimnya, substitusi dan kata-kata yang terkait dengan kata kunci utama.

Tapi anda harus berhati-hati untuk memasukkan kata-kata dalam konten anda yang sentimental dan logis serta terkait dengan kata kunci utama anda.

Misalnya, jika anda memiliki artikel atau entry tentang "Apple", posting anda secara logis ini tentang " Steve Jobs", "Apple Watch", "iPhone" dan seterusnya.

Kata-kata ini atau kata kunci LSI akan membantu Google membedakan posting anda dari pencarian yang berkaitan dengan "Candy apple" atau " Apple salad".

Pada gambar di atas, anda dapat melihat dengan jelas apa yang menjadi potensi kata kunci LSI bila anda menulis posting tentang "Apple". Anda juga bisa mendapatkan beberapa kata kunci LSI dari footer pada hasil pencarian Google yang disebut "Penelusuran yang terkait dengan ... ".

LSI Keywords Vs Longtail Keyword

Apakah ada perbedaan antara LSI Keywords dan Kata Kunci Long-Tail?

Ya ada, dari namanya aja sudah beda!

LSI keyword tidak persis dengan longtail keyword tetapi keduanya agak mirip. Perbedaan utama antara LSI keyword dan longtail keyword yaitu, longtail keyword mempersempit ruang lingkup pencarian sedangkan LSI keyword memperluas cakupan kata kunci utama dengan kata kunci yang terkait.

Mesin pencari menggunakan teknik kata kunci LSI untuk memeriksa seberapa dalam anda memiliki pengetahuan tentang topik yang ditulis dan juga peringkat halaman anda untuk istilah yang terkait.

Itulah mengapa anda memiliki lalu lintas yang tinggi ke posting blog anda dari frase keyword yang belum pernah anda targetkan atau bahkan belum anda dengarkan sebelumnya.

Manfaat Menggunakan LSI keyword

LSI keyword memiliki begitu banyak keuntungan SEO dan memberikan pengalaman pengguna yang bersangkutan.

Berikut manfaat dari memiliki LSI kata kunci dalam konten anda:

1. Mencegah Konten agar tidak ditandai sebagai Spam: LSI keyword mencegah konten anda dari penandaan spam di mata mesin pencari. Memiliki penyebuatan frase kata kunci bervariasi yang semantik terkait dengan kata kunci utama anda dan dapat meningkatkan kredibilitas konten anda. Ini juga membedakan konten anda dari konten beredar.

2. Penurunan Tingkat Bouncing: LSI Keyword membantu Aada dalam mengurangi tingkat bouncing dengan mencegah situs anda dari peringkat untuk istilah yang salah.

Kita lihat contoh ini: Ada 2 artikel yang ditargetkan hampir sama "Notebook ".

Keduanya adalah tentang:
The Notebook, Film (2014)
Notebook PC
Berikut Google mengambil kata kunci LSI anda seperti "Romantic Drama", "MTV Movie Award" dan "deleted scenes" untuk membedakan artikel pertama dengan kedua (yang memiliki kata-kata seperti "Notebook PC best buy 2016", "Baterai Notebook Asus", dll) .

Dengan cara ini penggemar film tidak akan masuk ke situs Lenovo atau Lithium dan dengan demikian tidak ada tingkat bouncing.

Lihat bagaimana LSI keyword berubah ketika Anda mengubah topik!

3. Meningkatkan On-Page Waktu By Pengunjung: Ini membantu untuk mempertahankan pengunjung di situs Anda. LSI kata kunci membuat aliran konten alami dan bermakna. Hal ini memberikan pembaca Anda lingkungan yang damai tanpa membuatnya merasa boneka kata kunci.

4. Meningkatkan Search Engine: Ini membantu Anda untuk peringkat lebih baik dan untuk pencarian terkait. Google bot otomatis menjelajah situs Anda dan membuat persepsi tentang apa artikel Anda adalah. Sekarang mereka menggunakan kriteria LSI untuk peringkat situs Anda untuk pencarian terkait semantik tidak peduli apa kata kunci target Anda adalah.

5. Meningkatkan Authority Blog: Lebih peringkat = lebih klik melalui harga = otoritas lebih dari blog Anda. 6. Meningkatkan Penjualan: LSI kata kunci juga seperti kata kunci ekor panjang dan karenanya Anda dapat peringkat lebih tinggi tanpa kompetisi kurang. Misalnya, Amazon mencatat lumayan 57% dari seluruh penjualan melalui kata kunci yangpanjang ekor dan LSI versi dari kata kunci utama. Ini hanya karena ada aku s persaingan kurang dan tepat pembeli niat di sana di zona LSI.

Bagaimana Menggunakan LSI Kata Kunci Untuk Peringkat Konten Anda Tinggi? Sekarang bahwa Anda mendapatkan semua kata kunci LSI yang berharga, berikutnya juta pertanyaan dolar adalah bagaimana menggunakannya? Kebanyakan blogger yang saya telah menemukan salah memasukkan kata kunci LSI ke dalam konten mereka tanpa strategi atau mengacaukan kata kunci utama mereka dengan kata kunci LSI. Namun, dengan menggunakan kata kunci LSI dengan benar dalam konten Anda memiliki kepentingan sendiri. penempatan yang benar dari kata kunci LSI dapat membuat atau menghancurkan peringkat dan kredibilitas posting. Berikut adalah beberapa tips untuk membuat sebagian besar dari kata kunci LSI Anda.

1. Pilih kata kunci yang tepat: Kebanyakan alat LSI kata kunci menghasilkan kata kunci yang terkait berdasarkan satu set algoritma. Mereka bukan manusia diproduksi maka mereka tidak sentuhan pribadi. Selain itu, Anda akan menemukan bahwa di setiap daftar kata kunci yang dihasilkan, ada frase yang tidak terkait dengan kata kunci utama Anda atau terlalu luas terkait.

Istilah-istilah ini harus dihapus atau disaring. Sejak memiliki frase yang tidak ada hubungannya dengan topik yang Anda tulis juga merugikan bagi SEO Anda. Dalam gambar di atas, jika Anda menulis sebuah artikel tentang ranseluntuk anjing , dan Anda memilih kata kunci, ransel untuk kucing , juga karena itu disarankan, dan kemudian akan membahayakan SEO Anda. Ini tidak akan tetap relevan bagi pengguna, dan mesin pencari akan bendera artikel Anda.

2. Tempatkan secara alami: Memiliki begitu banyak kata kunci LSI mungkin merugikan beberapa karena Anda harus menempatkan mereka secara alami dan tidak menyuntikkan mereka di mana saja dan di mana-mana. Anda tidak perlu menggunakan semua kata kunci yang dihasilkan di setiap artikel. Hanya memilih orang yang memiliki nilai untuk konten Anda. Brian Dean juga menyarankan percikan kata kunci LSI Anda ke konten Anda dengan cara yang mereka menambahkan arti dan nilai untuk posting blog Anda.

3. Sasaran posisi yang lebih: Anda juga dapat menggunakan kata kunci LSI Anda dalam judul posting Anda, sebagai pertanyaan dalam kesimpulan dan juga sebagai jangkar teks untuk link internal. Anda juga dapat menggunakannya dalam tag judul, permalinks dan yang paling penting dalam pengenalan dan kesimpulan bagian dari posting blog Anda. Ini muncul alami dan memberikan aliran ke posting Anda. Neil Patel telah menguasai keterampilan ini. Lihat bagaimana dia memanfaatkan bagian kesimpulan untuk memasukkan beberapa kata kunci LSI serta berinteraksi dengan penonton. Anda akan menemukan bahwa salinan muncul benar-benar alami dalam hal relevansi.

Ke Anda: Dengan panduan ini untuk menggunakan kata kunci LSI dalam strategi konten Anda, saya harap Anda akan menulis konten yang lebih baik. Yang paling penting, menulis konten yang relevan dan bermakna bagi pembaca Anda. Memiliki kata-kata dengan arti yang sama atau sinonim tidak hanya membuat cahaya konten Anda, tetapi juga membuatnya halus untuk membaca. Apakah Anda perhatikan bagaimana saya menggunakan frase " Kata-kata dengan arti yang sama atau sinonim " sebagai kata kunci LSI untuk konten saya? Itulah trik. Apakah Anda menggunakan kata kunci LSI di artikel Anda? Apakah Anda tahu alat yang indah tapi saya tidak disebutkan di sini? Komentar di bawah ini untuk membahas lebih.
Read more

Tuesday, 1 November 2016

Membuat Tampilan Magazine dengan Ringkasan Artikel dan Thumbnail di Blogger

Template dengan magazine atau newspaper style adalah menampilkan ringkasan atau cuplikan di homepage dengan block kolom di atas satu sama lain. Jenis template ini sangat populer saat ini, apakah itu berita atau blog teknologi, semua orang membutuhkan tata letak magazine style untuk blog mereka.

Ada beberapa cara untuk membuat posting muncul dengan seperti gambaran diatas. Sebuah pilihan akan menggunakan script readmore untuk menampilkan ringkasan post dan menambahkan tag kondisional untuk menambahkan gaya yang berbeda dari posting baru atau pertama, sehingga akan memiliki ukuran width yang lebih besar dari posting lama. 


Jadi, tutorial ini akan menunjukkan cara membuat magazine style untuk Template blogger. Dengan mengikuti tutorial ini, anda dapat membuat template Blogger yang membosankan dan sederhana menjadi lebih menarik dengan tata letak magazine style.

Menambahkan Magazine/Newspaper style pada Template Blogger

Langkah 1. Sebelum melangkah lebih jauh, silakan membuat backup dari template anda saat ini terlebih dahulu untuk memastikan bahwa anda tidak akan kehilangan sesuatu yang penting dari template sebelumnya, caranya login ke Dashboard blogger, pilih blog dan masuk ke tab Template , kemudian klik pada tombol Cadangkan/Pulihkan di sudut sebelah kanan. Setelah anda menyimpan salinan template .xml, klik pada tombol Edit HTML:
Membuat Tampilan Magazine dengan Ringkasan Artikel dan Thumbnail di Blogger
Edit Html
Langkah 2. Klik di mana saja di dalam kode area dan buka kotak pencarian dengan menggunakan tombol CTRL+F, lalu cari shortcode dibawah ini:
<data:post.body/>
Catatan: anda menemukan beberapa atau lebih dari satu untuk baris diatas, maka cukup berhenti pada baris yang kedua.

Langkah 3. Hapus baris tersebut dan tambahkan kode dibawah ini:
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<span class='post-comment-link'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/></a>
</b:if>
</b:if>
</span>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script>
<span class='readmorebutton' style='float:right'><a expr:href='data:post.url'>Read More &#187;</a>
</span></b:if></b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/></b:if>
Catatan: Anda dapat mengganti tulisan Read More, dengan teks lain seperti 'lebih lanjut', 'lanjutkan membaca', ataupun lainnya. 

Langkah 4. Sekarang cari (CTRL + F) baris dibawah ini:
<b:include data='post' name='post'/>
Langkah 5. Hapus baris itu juga dan gantikan dengan menambahkan code dibawah ini:
<b:if cond='data:post.isFirstPost'>
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<div id='first'>
<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>
<div class='first-body'>


<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<div expr:id='&quot;summary1&quot; + data:post.id'><data:post.body/></div>
  <script type='text/javascript'>createSummaryAndThumb1(&quot;summary1<data:post.id/>&quot;);</script>
<span class='post-comment-link'><b:if cond='data:blog.pageType != &quot;item&quot;'><b:if cond='data:post.allowComments'><a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/></a></b:if></b:if></span>
<span class='readmorebutton' style='float:right'><a expr:href='data:post.url'>
Read More &#187;</a></span>
</b:if></b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/></b:if>
</div> </div>
<b:else/>
<b:include data='post' name='post'/> </b:if>
<b:else/>
<b:include data='post' name='post'/> </b:if>
Catatan: Anda juga dapat mengubah teks Read More di sini, dengan teks yang ingin anda tampilkan. 

Langkah 6. Cari tag </ head> dan paste script dibawah diatasnya:
<script type='text/javascript'>
posts_no_thumb_sum = 290;
posts_thumb_sum = 240;
img_thumb_height = 80;
img_thumb_width = 80;
first_no_thumb_sum = 580;
first_thumb_sum = 450;
img_thumb_height1 = 145;
img_thumb_width1 = 165;

</script>

<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}

function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = posts_no_thumb_sum;
if(img.length>=1) {
imgtag = '<span class="posts-thumb" style="float:left;"><img src="'+img[0].src+'" 
width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = posts_thumb_sum;
}

  var summary = imgtag + '<div class="summary">' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}


function createSummaryAndThumb1(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = first_no_thumb_sum;
if(img.length>=1) {
imgtag = '<span class="first-post-thumb" style="float:left;"><img src="'+img[0].src+'" 
width="'+img_thumb_width1+'px" height="'+img_thumb_height1+'px"/></span>';
summ = first_thumb_sum;
}

var summary1 = imgtag + '<div class="summary">' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary1;
}
//]]> </script>
Langkah 7. Dan paste script css dibawah diatas tag </head> juga:
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<style type='text/css'>
.first-post-thumb {
    margin-right: 10px;
}

.summary {
    height: 100%;
}

#first { /* Styles for the First Post Container */
    width: auto;
    height: 250px;
    float: left;
    margin-bottom: 10px;
    background-color: #F4F4F4; /* background color for the first post */
    border: 1px solid #E5E5E5; /* border for the first post */}

.first-body { /* Style for the First Post summary */
    color: #545454;
    font-size: 13px;
    text-align: justify;
    padding: 5px 10px;
    line-height: 1.5em;
}

#first h3 a, #first h3 a:visited { /* Style for the First Post Title*/
    border-bottom: 2px solid #DFDFDF;
    color: #515151;
    font-size: 20px;
    display: block;
    margin: 10px auto;
    width: 95%;
    font-size: 20px;
    padding: 0px 0px 4px 0px;
    font-weight: bold;
    text-align: left;
    line-height: 1.4em;
    background: none;
}
#first h3 a:hover { /* Color on mouseover for the First Post Title */
    color: #1061A1;
}

.post { /* Styles for the small posts container */
    float: left;
    margin: 0px 6px 2% 5px;
    width: 46%;
    height: 230px;
    padding: 0px 5px 5px 5px;
    background: #FCFCFC; /* background color for the small posts */
    border: 1px solid #E5E5E5; /* border for the small posts */
    overflow: hidden;
}
.posts-thumb { /* Style for the small posts thumbnails */
    margin-right: 10px;
}
.post-body img, .post-body .tr-caption-container, .Profile img, .Image img, .BlogList .item-thumbnail img {
    background: none;
    border: none;
    box-shadow: none;
    padding: 0;
}

h3.post-title a{ /* Style for the small posts titles */
    font-size: 14px;
    color: #747474;
    text-transform: uppercase;
}

h2.date-header { /* Hide the post date */
    display: none;
}
.post-footer {
    display: none;
}
h3.post-title {
    margin: 0px;
}
.readmorebutton {
    margin-top: 5px;
}

.readmorebutton a { /* Styles for the Read More link */
    color: #767676;
    border: 1px solid #E1E1E1;
    background: #EAEAEA; /* Background color for the Read More link */
    text-decoration: none;
    padding: 3px 5px;
    font-weight: bold;
    font-size: 11px;
    float: right;
    position: relative;
}
.post-comment-link { /* Style for the comment bubble of posts below */
    position: absolute;
    top: -35px;
    right: -10px;
    display: block;
    border: 1px solid #E1E1E1; /* border for the comment bubble */
    background: #EAEAEA; /* background color for the comment bubble */
    font-size: 11px;
    position: absolute;
}

#first .post-comment-link { /* Style for the comment bubble of first post */
    position: absolute;
    top: 10px;
    right: 0px;
}
.post-comment-link a { /* Link color for the comments bubble*/
    padding: 10px;
    color: #6A6A6A;
    text-decoration: none;
    font-weight: bold;
}

#blog-pager {
    clear: both;
}</style>
</b:if>
</b:if>

Menyesuaikan Tata Letak Magazine

1. Pada awal script dari langkah 6, kita mengambil bagian ini:
posts_no_thumb_sum = 290;
posts_thumb_sum = 240;
img_thumb_height = 80;
img_thumb_width = 80;
first_no_thumb_sum = 580;
first_thumb_sum = 450;
img_thumb_height1 = 145;
img_thumb_width1 = 165;
  • Angka pertama pada baris pertama adalah jumlah karakter untuk pos-pos singkat ketika tidak ada gambar yang tersedia
  • Nomor kedua atau baris kedua adalah jumlah karakter yang akan muncul bila post singkat memiliki gambar.
  • baris 3 dan 4 adalah untuk tinggi dan lebar thumbnail(gambar) pada post singkat.
  • pada tulisan yang biru juga memiliki perlakuan yang sama seperti diatas, hanya saja yang berwarna biru untuk posting terbaru/pertama.
2. Dan akhirnya, kita memiliki style CSS. Itu kode yang menentukan bagaimana posting akan terlihat pada homepage dan juga pada halaman arsip, kecuali untuk posting pertamanya.

Untuk mengubah lebar dan tinggi, masing-masing ukuran untuk field posting pertama, ubah pada baris ini:
width: auto;
height: 250px;
Di bawah posting pertama nilai-nilai untuk posting lainnya, cari bagian ini: 
width: 46%;
height: 230px;
Lebar 46% dari lebar kolom utama dan tinggi diatur ke 230px. Di sini Anda mungkin perlu bereksperimen sedikit dengan ukuran untuk membuat mereka lebih bagus, jangan seperti di blog demo. 

Akhirnya, atur jumlah posting untuk ditampilkan di homepage, sehingga tidak akan ada ruang kosong. Pergi ke SetelanPos, komentar dan berbagi Tampilkan sebanyak mungkin dan pilih jumlah posting yang ingin ditampilkan.



Read more

Thursday, 13 October 2016

Cara membuat gambar header di tengah

Yang membuat website anda berbeda dengan yang lain yaitu pada headernya, itu merupakan identitas atau sidik jari digital. Setiap kali pengunjung mengakses blog anda untuk pertama kalinya, header adalah salah satu aspek utama yang digunakan untuk menentukan siapa anda dan jenis konten yang sesuai harapan. Oleh karena itu, penting untuk mengembangkan sebuah header yang bagus dan pada tempat yang mencolok dan menggambarkan nama merek.

Apa yang nampak akan berlawanan dengan gagasan bahwa pengaturan default Blogger sebagai penentuan posisi header. Setiap kali anda memasang header ke situs, maka secara otomatis akan rata di sebelah kiri page. Beberapa pengguna Blogger mungkin tak masalah dengan pengaturan ini, terutama jika mereka menggunakan desain header yang tidak mengandung latar belakang. Orang lain mungkin berpikir bahwa header latar belakang mereka tampak terpotong, tidak lengkap, atau tidak bisa dibedakan dari konten mereka.
Cara membuat gambar header di tengah #1
Gambar Header rata tengah
Jika anda merupakan bagian dari kategori yang kedua, ada cara untuk menyesuaikan posisi header anda sehingga ditampilkan di tengah blogger. Dengan header situs anda tepat ditengah, Anda memiliki fleksibilitas yang lebih besar dari desain keseluruhan. Sulit untuk melewatkan sebuah header yang ditempatkan di tengah layar pada setiap halaman seseorang menavigasinya.

Tutorial Membuat Gambar Header di tengah dengan Template designer blogger


Membuat perubahan itu relatif mudah. Anda dapat melakukan penyesuaian ini pada setiap halaman blog Blogger anda tanpa harus mengubah mereka secara satu-per-satu. Yang perlu anda lakukan adalah memodifikasi CSS dari blog anda yang dapat ditemukan secara langsung melalui dashboard Blogger Anda. Bahkan jika anda memiliki sedikit atau bahkan tidak ada pengalaman dalam desain web atau coding, Anda dapat membuat gambar header tepat ditengah dengan mengikuti beberapa langkah berikut ini.

Langkah 1. Masuk akun blogger anda dan pilih blog yang ingin di modifikasi, kemudian pergi ke tab "Template" dan klik tombol "Customize" di sisi kanan.
Cara membuat gambar header di tengah #2
Membuka template designer blogger
Langkah 2. Arahkan ke tab "Tingkat Lanjut" > "Tambahkan CSS" dan paste kode di kotak kosong:
#header-inner {
background-position: center !important;
width: 100% !important;
text-align: center;
 }
#header-inner img {
margin: auto;
}
Jika anda memiliki gambar kecil dan anda ingin menjadi lebar penuh, tambahkan CSS dibawah ini sebagai gantinya:
#header-inner {
background-size: cover;
width: 100% !important;
text-align: center;
}
#header-inner img {
 width: 100%;
height: 100%;
}
Langkah 3. Tekan ENTER setelah anda paste code css, kemudian klik tombol "Terapkan ke Blog" di sudut sebelah kanan-atas dari taksbar template designer.
Cara membuat gambar header di tengah #3
Memodifikasi CSS

Berikut adalah beberapa pilihan selaras lainnya untuk header Anda:

Gambar di sebelah kanan dan judul di sebelah kiri

#header-inner {
background-position: right !important;
width: 100% !important;
}

.titlewrapper, .descriptionwrapper {
float: left;
clear: both;
margin-left: 20px;
}

Gambar di sebelah kiri dan judul di sebelah kanan

#header-inner {
background-position: left !important; 
width: 100% !important;
}

.titlewrapper, .descriptionwrapper {
float: right;
clear: both;
margin-right: 20px;
}

Catatan: untuk gambar yang lebih besar, Anda mungkin harus mengubah ukurannya untuk membuat mereka tampil berdampingan dengan teks.

Akhir Kata!!!

Setelah melakukan perubahan ke CSS dan menyimpan modifikasi anda, anda mungkin ingin melihat kembali situs anda. Refresh halaman dan anda akan melihat header sekarang tepat ditengah, bukan di sebelah kiri. Klik pada beberapa halaman link anda dan pastikan bahwa modifikasi ini telah dibuat untuk setiap halaman atau posting di blog.

Jika kebetulan anda tidak melihat perubahan pada header, kembali ke kode yang anda ubah dan pastikan bahwa anda telah menyalin dan menyisipkan kodenya ke dalam kotak persis seperti yang diperintahkan. Bahkan perubahan kecil dalam kode, atau titik koma hilang akan gagal membuat perubahan yang anda inginkan, atau hasil yang berbeda dari apa yang diharapkan.

Pemikiran yang bagus tentang CSS adalah bahwa itu merupakan pusat kemenarikan dari situs anda untuk semua hal desain. Dari file CSS, anda dapat memodifikasi apapun dan bagaimanapun penampilan situs anda. Setelah anda merasa nyaman melakukan penyesuaian dengan tampilan situs anda, buatlah blog akan menjadi sesuatu yang berbeda dan menarik.
Read more

Tuesday, 4 October 2016

Cara Membuat Homepage Static di Blogger

Ketika masuk ke homepage blogger, sebagian besar situs web dibagi menjadi dua: statis dan non-statis. Seperti namanya, homepage statis itu permanen tidak peduli berapa kali website ini diperbarui, sementara homepage non-statis menampilkan perubahan yang dibuat ke situs tersebut dan menunjukkan pesan-pesan terbaru saat pertama.

Yang terakhir ini sudah sangat terkenal saat ini karena meningkatnya popularitas blog pribadi dan bahkan perusahaan. Namun, masih banyak orang yang lebih memilih homepage statis karena membuat situs Web mereka terlihat lebih terorganisir dan profesional.
Cara Membuat Static Page di blogger #1

Hal ini juga memberi mereka lebih banyak kontrol atas pengalaman para pembaca di situs mereka dan membantu mereka menciptakan lebih kuat brand awareness melalui beragam pesan bahwa homepage mereka menyediakannya.

Beruntungnya, jika anda memiliki situs Blogger dan ingin membuat homepage anda menjadi statis, anda akan dapat membuatnya tidak sesulit seperti yang terlihat. Anda dapat membuat homepage statis di Blogger dengan mengikuti langkah-langkah berikut:

Langkah #1 Buat Page Home Statis

Hal pertama yang harus anda lakukan adalah membuat halaman baru untuk blog anda. Ini berfungsi sebagai homepage statis, tetapi untuk saat ini, itu akan terlihat dan bertindak seperti page yang lainnya.

Untuk membuat page/ halaman ini, anda harus masuk ke Dashboard Blogger dan klik pada "Laman" lihat pilihannya di menu kiri pada layar. Itu akan membawa Anda ke Jendela menu "Semua Laman".

Di sini, klik pada tombol "New Page/Laman Baru" dan anda akan masuk ke text/html editor yang terlihat mirip dengan editor Blogger Post yang anda gunakan ketika mempublish sebuah posting blog baru.

Di kotak atas, masukkan judul sesuai dengan keinginan anda untuk page ini. Dalam hal ini, sebut saja Halaman "Welcome".

Dalam kotak teks dibawahnya, ketik konten yang ingin anda munculkan di homepage anda; Anda dapat mengetik suatu teks paragraf, atau tentang diri anda bahkan bisnis anda dan tentang situs anda.

Setelah Selesai, klik "Publikasikan". jendela akan kembali ke menu utama "Semua Laman", dan Anda coba lihat laman baru "Welcome" yang telah anda buat. Salin URL dari laman "Welcome" karena anda akan membutuhkannya nanti. Untuk melakukan ini, klik kanan pada link 'Lihat' dan pilih 'Copy Link Address' dari menu.
Cara Membuat Static Page di Blogger #2
Langkah 1

Langkah #2 Redirect homepage default ke homepage statis

Setelah Laman"Welcome" siap digunakan, hal berikutnya yang harus anda lakukan adalah mengubah situs default Blogger . Ini melibatkan redirect dari homepage asli situs anda ke homepage statis yang telah anda buat sehingga akan menjadi hal pertama yang pengujung lihat ketika mereka mengunjungi situs anda.

Untuk melakukan ini, Anda akan harus masuk ke menu Dashboard Blogger, klik pada "Setelan" di sisi kiri layar, dan pilih "Preferensi Penelusuran". Di bagiah bawah "Kesalahan dan pengalihan", Anda akan melihat pilihan "Pengalihan Khusus" dengan link "Edit" di sampingnya.

Klik pada link "Edit" untuk membuat pengalihan, di mana anda akan melihat dua kotak bernama "Dari" (dengan URL blog anda di sampingnya) dan "Kepada".

Dalam kotak "Dari", masukkan simbol garis miring saja "/". Dalam kotak "Kepada", paste URL yang anda copy tadi dan tambahkan bagian akhir URL page "Welcome". Misalnya, URL halaman ini dari blog demo kami adalah cara-membuat-homepage-static.blogspot.co.id/p/welcome_4.html, sehingga saya akan menghapus alamat "http://cara-membuat-homepage-static.blogspot.co.id" dan meninggalkan "/p/welcome_4.html" dalam kotak "Kepada". Tanda "/p" menandakan bahwa itu halaman statis.

Selanjutnya, centang kotak kecil di samping "Permanen", klik link teks "Simpan", dan tekan tombol "Simpan perubahan". Ini akan mengarahkan URL utama situs anda ke Laman home statis yang baru. Akses blog anda pada browser yang terpisah untuk melihat apakah ia bekerja.
Cara Membuat Static Page di Blogger #3
Langkah 2

Langkah #3 Membuat tab untuk situs Anda

Jika anda berencana untuk membuat tab tidak terlihat di blog anda. So, anda tidak perlu melanjutkan ke Langkah ini atau Langkah # 3 cukup hentikan sampai Langkah # 2. Tapi, jika Anda ingin situs anda untuk memiliki tab yang menunjukkan Homepage, Halaman DashBoard, atau halaman lainnya yang mungkin Anda miliki (seperti laman Sitemap dan Contact me), anda dapat mengikuti langkah ini sampai selesai.

Mengapa ini penting? Pada dasarnya, ketika tab terlihat atau aktif di situs anda, itu akan menunjukan bahwa situs anda memiliki dua halaman: homepage default dan Laman "Welcome" yang baru anda buat, tetapi itu sudah diarahkan ke halaman statis yang sama. Hal ini dapat membingungkan pembaca anda dan bahkan dapat mempengaruhi peringkat mesin pencari anda.

Untuk memperbaiki ini, Anda harus terlebih dahulu mengaktifkan tab dengan pergi ke menu "Tata Letak" dan klik pada hyperlink "Tambah Gadget". Anda dapat memilih untuk menambahkannya bawah header blog atau sidebar, itu sesusai keinginan anda. Dalam banyak kasus, disarankan untuk menambahkannya di bawah header blog, karena mereka lebih terlihat dan membuat website anda terlihat ramping, profesional.

Setelah jendela pop-up terbuka, scroll ke bawah dan klik pada link 'Laman', setelah jendela lain bernama "Konfigurasikan Daftar Laman" terbuka. Di sini atau di bawah bagian "Laman yang ditampilkan", Anda akan melihat homepage default dan homepage statis baru dengan kotak kecil di samping mereka. Hapus tanda centang pada kotak di samping home page default untuk menyembunyikannya dari pandangan, memeriksa halaman yang ingin ditampilkan dalam menu dan kemudian klik pada tombol "Simpan" untuk menyimpan perubahan.

Cara Membuat Static Page di Blogger #4
Cara menambah widget pages
Pada langkah ini, Tab sudah bekerja, tetapi, jika anda ingin membuat tab khusus yang akan mengarah ke halaman posting blog utama anda. Untuk melakukan hal ini, edit gadget "Pages" yang baru saja anda simpan dan klik "+ Tambahkan tautan eksternal".

Pada jendela baru yang akan terbuka, masukkan judul yang anda inginkan untuk laman ("Blog") bersama dengan alamat web /index.html, lalu tekan "Save Link" dan klik tombol "Simpan" pada Jendela "Konfigurasi Daftar Laman".
 
Cara Membuat Static Page di Blogger #5
Menambah homepage default
Sekarang, lihat situs anda dan anda akan melihat menu halaman yang berisi page "Welcome" dan tab "Blog". Untuk melihat bagaimana ini bekerja, Anda juga dapat mengunjungi blog demo kami.

FootNote

Memiliki halaman rumah statis dapat bermanfaat bagi blog anda. Ikuti langkah-langkah di atas sekarang untuk membuat homepage statis di Blogger!
Read more

Sunday, 25 September 2016

Cara Menyembunyikan Postingan Pada Homepage Blogger

Tujuan dari ngeblog adalah untuk membuat posting blog anda dapat dilihat atau dibaca oleh audiens anda serta untuk mesin pencari. Namun, ada kalanya anda perlu untuk menyembunyikan posting blog tertentu dari homepage. Misalnya, satu posting mungkin berisi informasi yang sudah usang, sehingga anda tidak ingin dilihat oleh audiens anda, tetapi juga ingin tetap ada di situs anda untuk tujuan sebagai catatan. Atau mungkin anda ingin post tertentu masih terlihat di blog Anda, tetapi Anda tidak ingin ditampilkan di halaman home.
Cara Menyembunyikan Postingan Pada Homepage Blogger #1

Cara terbaik yaitu anda harus menemukan cara menyembunyikan post blog tertentu. Namun, jika anda menggunakan Blogger. Anda dapat dengan mudah melakukannya dengan mengambil beberapa langkah sederhana. Anda dapat menggunakan panduan ini untuk memulainya.

Memundurkan waktu (Backdated) Posting Blogger

Mari kita bahas teknik ini terlebih dahulu, ini sangatlah sederhana dan tidak mengharuskan anda untuk menangani setiap baris kode. Pada dasarnya, satu-satunya hal yang perlu anda lakukan adalah untuk mengubah tanggal penerbitan post yang ingin anda sembunyikan. Tepatnya, anda harus mengundurkan tanggal post ke tanggal sebelumnya, mungkin. 

Melakukan hal ini efektif jika situs Blogger anda dikonfigurasi untuk menampilkan atau sort latest post di homepage (seperti kebanyakan blog), ini dikarenakan setelah posting ini dimundurkan waktu penerbitan, maka post itu tidak akan lagu ditampilkan di halaman rumah. 

Bagaimana Cara Membuatnya? 

Jika anda menerbitkan posting baru dan ingin menyembunyikannya, Cari "Jadwal" sesuai pilihan di sisi kanan dari editor posting dan klik pada "Set tanggal dan waktu". Pilih tanggal sebelumnya atau setelah di kalender, klik 'Selesai' dan Simpan pos, kemudian kembali ke halaman rumah blog Anda untuk memeriksa apakah pos telah menghilang.
Cara Menyembunyikan Postingan Pada Homepage Blogger #1
Backdated post

Proses yang sama berlaku jika anda ingin menyembunyikan sebuah pos yang sudah usang; satu-satunya perbedaan adalah bahwa anda harus klik pada judul posting atau edit post di dashboard untuk membukanya di editor. Backdate pos menggunakan langkah-langkah di atas dan simpan, kemudian buka blog anda untuk memverifikasi bahwa pos memang tersembunyi dari pandangan. 

Harap dicatat bahwa proses ini hanya akan menyembunyikan posting anda dari homepage. Orang akan tetap dapat melihatnya, jika mereka akan meluangkan waktu untuk membuka posting blog anda dari tahun-tahun sebelumnya. Ini juga berlaku untuk orang-orang yang datang di posting blog tersembunyi anda melalui mesin pencari.

Sembunyikan Post Blog Menggunakan Kode

Hal lain yang dapat anda lakukan untuk menyembunyikan posting blog adalah untuk mengedit kode. Ini agak rumit karena satu kesalahan kecil dapat mempengaruhi struktur tiang dan membuatnya tidak terbaca. Hal ini, pada waktunya dapat mempengaruhi pengalaman pembaca anda 'karena mereka menelusuri situs anda dan bahkan memiliki efek negatif pada teknik optimasi mesin pencari anda. Dengan pemikiran ini, penting untuk berhati-hati ketika berhadapan dengan kode.

Cara 1: Sembunyikan Blogger Posting Menggunakan label Post

Ada dua teknik yang dapat anda pilih, dan salah satunya melibatkan label posting blog yang ingin anda sembunyikan. Jika anda siap untuk melanjutkan dengan cara ini, pertama-tama anda harus membuat cadangan dari template anda. Memiliki cadangan penting karena memastikan Anda akan memiliki salinan untuk restore jika sesuatu berkerja tidak seperti sebelumnya. 

Setelah membackup template, masuk ke tab "Template", klik "Edit HTML" dan kemudian klik dimana saja di dalam kode editor  >>  tekan tombol CTRL + F dan cari baris ini:

<b:include data='post' name='post'/>

Setelah anda menemukan baris atau tag diatas, ganti dengan kode ini:

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:loop values='data:post.labels' var='label'>
         <b:if cond='data:label.isLast == "true"'>
                  <b:if cond='data:label.name != "Tambahkan Label Disini"'>
                             <b:include data='post' name='post' />
                 </b:if>
           </b:if>
</b:loop>
<b:else/>
          <b:include data='post' name='post' />
</b:if>
Catatan: Ganti teks "Tambahkan Label Disini " dengan label dari posting blog yang ingin anda sembunyikan di homepage Blogger. Perlu diingat bahwa kode di atas tidak akan bekerja jika post yang ingin anda sembunyikan memiliki beberapa label, jadi pastikan pos hanya memiliki 1 label. Serta disarankan agar dapat membuat label baru khusus untuk menyembunyikan post anda. 

Penting: Setiap posting yang ingin ditampilkan pada homepage harus memiliki setidaknya satu label kalau tidak post tidak akan terlihat karena penyataan b:loop tidak akan dieksekusi untuk post yang tidak memiliki label. 

Jika sudah, Simpan setiap perubahannya dengan menekan tombol 'Simpan template' di sisi kiri atas kode editor, kemudian lihat blog anda dan periksa apakah posting blog telah disembunyikan

Cara 2: Sembunyikan Post Blog Menggunakan ID Post 

Selain metode di atas, anda dapat menggunakan teknik lain yang melibatkan posting ID dari posting blog yang ingin anda sembunyikan. Untuk mengetahui nomor ID, anda harus masuk ke dashboard, dan temukan judul posting yang ingin disembunyikan, dan klik link teks"Edit" di bawahnya, agar membuka pos di editor blogger. 

Setelah anda dalam editor, klik pada address bar di atas dan pergi ke bagian paling ujung dari URL. Disana, anda akan melihat baris yang terlihat seperti ini: postID=, diikuti oleh serangkaian panjang angka. Angka itu adalah nomor ID posting anda. Jumlah ID biasanya berisi 19 nomor, sehingga akan terlihat seperti ini, misalnya: postID=6465556866200017417. Salin ID itu karena anda memerlukan untuk langkah berikutnya.
Cara Menyembunyikan Postingan pada hompage blogger #3
Find Post ID

Bila anda sudah mendapatkan ID posting blog anda, buka dashboard Blogger, masuk ke tab Template, dan klik "Edit HTML". Cari baris dibawah ini: 

<div class='post hentry uncustomized-post-template' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>

Ganti dengan kode yang satu ini: 

<div class='post hentry uncustomized-post-template' expr:id='&quot;post-&quot; + data:post.id' itemprop='blogPost' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>

Catatan: Jika Anda menemukan dua kejadian itu, menggantikan keduanya 

Sekarang cari tag ini: 

</head>

Setelah anda menemukan tag diatas, paste kode berikut di atasnya: 

<b:if cond='data:blog.url == data:blog.homepageUrl'><style type='text/css'>
#post-1234567890123456789{display:none;}</style></b:if>

Jangan lupa untuk mengganti "1234567890123456789" dengan 19 digit nomor ID dari posting blog yang ingin anda sembunyikan. 

Jika anda ingin menambahkan post yang ingin disembunyikan, anda tinggal manambahkan dibawahnya. Akan terlihat seperti dibawah ini. Jika anda ingin memperlihatnya kembali tinggal menghapus style untuk postID.

<b:if cond='data:blog.url == data:blog.homepageUrl'><style type='text/css'>#post-1234567890123456789{display:none;}
#post-5363726217837278812{display:none}</style></b:if>

Setelah selesai, pastikan untuk menyimpan template. Anda dapat membuka blog anda di tab lain atau browser untuk memeriksa apakah pos memang telah disembunyikan. 

Kesimpulan

Itulah cara menyembunyikan postingan pada homepage blogger. Jadi, sekarang bagaimana keputusan anda, Apakah anda cukup dengan memundurkan waktu posting anda atau memilih untuk menggunakan metode kedua dengan posting ID, Anda harus ingat bahwa posting blog anda tersembunyi, tetapi masih di website anda. Ini artinya bahwa hal itu masih akan diindeks oleh mesin pencari, muncul di hasil mesin pencari, dan mendapatkan ditemukan oleh orang-orang yang mencari kata kunci yang hadir di pos. 

Jika anda benar-benar ingin posting blog ini untuk dilihat oleh siapa pun, anda harus menggunakan robots.txt (dari google) untuk menghapusnya dari hasil pencarian. Lebih baik lagi, benar-benar menghapus posting dari dashboard blogger anda dan hanya menyimpan soft copy di komputer anda.
Read more