Pengertian Web Design 3: 10 Cara edit tampilan Website Blog agar terlihat lebih keren part 1

10 Cara edit tampilan blog agar terlihat lebih keren part 1 – Halo semua pembaca setia Shortcut Web ID, kali ini saya akan memberikan anda tutorial untuk mengedit tampilan blog anda agar terlihat lebih keren.

Karena tampilan blog atau website kita ini bisa secara bebas diedit, maka kita akan dituntut untuk kreatif, agar tampilan website anda memberikan kepuasan kepada pengunjung. Nah, pada artikel part 1 disini sudah saya siapkan 2 tutorial agar Website  blog anda terlihat lebih keren terutama di mata para pengunjung.

1. Menggunakan background gambar
Cara pertama untuk membuat template Website blog kita menjadi lebih keren adalah menggunakan backgroung gambar. Banyak sekali blog yang sudah memakai trik ini, dan caranya pun berhasil terlihat blognya menjadi lebih keren. Berikut adalah code untuk melakukan hal ini.

body {
    background-image: url(http://2.bp.blogspot.com/-QoJaSNlPzoc/VK0-YFHSBnI/AAAAAAAAAG8/B3SuEzoeyww/s1600/noisy_grid.jpg) repeat scroll top left;
}

Anda dapat menaruh kode tersebut diatas kode ]]></b:skin> jika anda menggunakan blogspot, dan anda juga dapat mengganti gambar background dengan mengganti link http://2.bp.blogspot.com/-QoJaSNlPzoc/VK0-YFHSBnI/AAAAAAAAAG8/B3SuEzoeyww/s1600/noisy_grid.jpg dengan link gambar yang pastinya sudah anda siapkan terlebih dahulu.

2. Menggunakan tombol social share
Semua blog atau website sebenarnya sangat perlu tombol social share, untuk itu anda harus menggunakan tombol social share pada website anda, karena selain berpengaruh terhadap kecantikan dari blog anda, social share ternyata juga mempengaruhi SEO, dan bisa membuat website anda kebanjiran visitor.

Untuk membuat tombol social share juga cukup mudah, berikut adalah penjelasannya.

1. Masuk ke situs ShareThis di www.sharethis.com/get-sharing
2. Pilihlah menu social share button yang anda inginkan
3. Lalu klik Get The Code untuk mendapatkan kode widget tersebut.

Nah, jika anda tidak ingin ribet untuk melakukan hal itu, maka disini saya sudah menyiapkan kodenya.

<span id="st_finder">
</span>
<script type="text/javascript" src="http://w.sharethis.com/widget/stblogger2.js"></script>
<script type="text/javascript">
var switchTo5x= true;stBlogger2.init("http://w.sharethis.com/button/buttons.js",{"sharethis":["large","ShareThis",""],"facebook":["large","Facebook",""],"twitter":["large","Tweet",""],"linkedin":["large","LinkedIn",""],"pinterest":["large","Pinterest",""],"email":["large","Email",""]}, "df1fc1af-122f-4032-9a0f-49891335823b");var f = document.getElementById("st_finder");var c = f.parentNode.parentNode.childNodes;for (i=0;i<c.length;i++) { try { c[i].style.display = "none"; } catch(err) {}}
</script>

Nah, artikel ini akan disambung di part 2, tunggu yaa…

About

Your email will not be published. Name and Email fields are required.