Tampilkan postingan dengan label Cara. Tampilkan semua postingan

Cara Membuat Artikel Terkait Berbentuk Gambar Thumbnails

Cara Membuat Artikel Terkait Berbentuk Gambar Thumbnails - Testimoni, baca dulu: 3 Cara Membuat Artikel Terkait atau Related Post di Blog. Bentuk artikel terkait dengan gambar thumbnail seperti sobat temui pada Blog sederhana ini. Di samping bentuk ‘style’ yang menarik, juga dilengkap screenshoot gambar yang menambah nilai plus ketertarikan pengunjung. Di sisi lain, jumlah tampilan perlabel relatif sedikit, tidak seperti artikel terkait dengan menggunakan scroll. Namun menurut penulis, artikel terkait ini cukup modis dan perlu diterapkan pada Blog. Untuk pemasangannya, silahkan ikuti langkah-langkah berikut ini:

1. Login diakun Blogger sobat,
2. Pada halaman Dasbor, pergi ke Template dan pilih Edit HTML,
3. Pada kotak editor template, sembarang klik disalah satu ‘box’ tersebut, dan
tekan Ctrl + F, silahkan cari kode </head>,
4. Letakkan CSS dan JavaScript berikut ini sebelum kode </head>,

<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}
#related-posts h2{
font-size: 1.3em;
font-weight: bold;
color: #000000;
font-family: Georgia, “Times New Roman”, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:#000000;
}
#related-posts a:hover{
color:#000000;
}
#related-posts a:hover {
background-color:#d4eaf2;
}
</style>
<script src='http://eflianda-blogzzz.googlecode.com/files/relatedthumbs.js' type='text/javascript'/>
</b:if>

5. Setelah script di atas, cari kode <div class='post-footer'> atau
<div class='post-footer-line post-footer-line-1'/>, letakkan script berikut di atas kode
tersebut.

<b:if cond='data:blog.pageType == "item"'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=6"' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'>
var currentposturl="<data:post.url/>";
var maxresults=5;
var relatedpoststitle="Artikel Terkait";
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div style='clear:both'/>
</b:if>

Angka berwarna biru adalah jumlah posting tampilan related post,
sesuaikan dengan lebar Blog sobat.

6. Terakhir, klik Simpan Template.

Baca Dulu...

Sabtu, 16 November 2013 // Label: Blog, Cara // 0 komentar //

Cara Memasang Artikel Terkait Dengan Scroll

Cara Memasang Artikel Terkait dengan Scroll di Bawah Posting - Testimoni, baca dulu: 3 Cara Membuat Artikel Terkait atau Related Post di Blog. Tips trik ini membuat arikel terkait berbentuk scroll yang biasa mondar-mandir’ ke atas dan bawah. Kelebihan teknik scroll ini, sobat dapat menampilkan jumlah artikel terkait tiap label sebanyak-banyaknya tanpa mengganggu panjang vertikal dari halaman posting karena disiasati menggunakan scrolling. Untuk pengunjung tentu dengan leluasa dan bebas menelusuri Blog sobat.

OK, sekarang berikut tutorial cara memasang artikel terkait dengan scroll:

1. Pastikan sobat ‘stand by’ di akun Blogger, pergi ke Template dan klik Edit HTML,
2. Muncul kotak editor template, sembarang klik disalah satu kotak tersebut,
kemudian tekan Ctrl + F, cari kode ]]></b:skin> dan letakkan CSS
berikut diatasnya:

/* Artikel Terkait */
.rbbox{border: 1px solid #D8D8D8;padding: 5px;
background-color: #E0F8E0;-moz-border-radius:5px; margin:5px;}
.rbbox:hover{background-color: #EFFBEF;}

     1. #E0F8E0 = kode warna kotak background Related Post (ganti sesuai selera sobat),
     2. #EFFBEF = kode warna kotak background 'hover' related post
muncul pada saat disorot mouse (ubah dengan warna kesukaan sobat).

4. Cari kode <data:post.body/> atau <div class='post-body>,
    letakkan script berikut ini di bawah kode tersebut:

<b:if cond='data:blog.pageType == "item"'>
<H4>Related Post:</H4>
<div class='rbbox'>
<div style='margin:0; padding:10px;height:200px;overflow:auto;border:1px solid #ccc;'>
<div id='albri'/>
<script type='text/javascript'>
var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel = 5;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 50;
maxNumberOfLabels = 3;
function listEntries10(json) {
var ul = document.createElement('ul');
var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i < maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement('li');
var a = document.createElement('a');
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l < json.feed.link.length; l++) {
if (json.feed.link[l].rel == 'alternate') {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k<20; k++) label = label.replace("%20", " ");
var txt = document.createTextNode(label);
var h = document.createElement('b');
h.appendChild(txt);
var div1 = document.createElement('div');
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById('albri').appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement('script');
script.setAttribute('src', query + 'feeds/posts/default/-/'
+ label +
'?alt=json-in-script&callback=listEntries10');
script.setAttribute('type', 'text/javascript');
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = "<data:label.name/>";
var test = 0;
for (var i = 0; i < labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length <= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel < maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
<script type='text/javascript'>RelPost();</script>
</div>
</b:if>

    Prinsipnya, meletakkan kode tersebut berdekatan dengan post-entri atau
    di bawah postingan sobat. Angka 50 berwarna biru menunjukkan jumlah artikel terkait dalam
    satu label, bisa diubah sesuai selera sobat.
6. Klik Simpan Template, dan sobat silahkan lihat hasilnya.

Baca Dulu...

// Label: Blog, Cara // 0 komentar //

Cara Membuat Artikel Terkait Sederhana Pada Blog

Cara Membuat Artikel Terkait di Blogspot - Testimoni, baca dulu: 3 Cara Membuat Artikel Terkait atau Related Post di Blog. Model sederhana dari bentuk artikel terkait lebih ringan dalam me’load’ label ketika akses halaman posting. Bentuk yang friendly dan simpel dapat sobat terapkan langkah-langkah pembuatannya pada Blogspot di bawah ini, cekidot:
1. Login pada akun Blogger sobat,
2. Setelah berada di Dasbor, beralih ke Template dan klik Edit HTML,
3. Muncul kotak editor template, sembarang klik di salah satu kotak tersebut, kemudian tekan Ctrl + F,
cari kode </head>,
4. Letakkan kode css dan script di bawah ini sebelum kode </head>,

5. Setelah itu cari kode <data:post.body/> atau <div class='post-body> dan letakkan script berikut
di bawahnya,

<b:if cond='data:blog.pageType == "item"'>
<div id="related-posts">
<font face='Arial' size='3'><b>Related Posts : </b>
</font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/>
<b:if cond='data:label.isLast != "true"'>,</b:if><b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=5"' type='text/javascript'/>
</b:if></b:loop></font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();</script>
</div></b:if>

Intinya, meletakkan kode tersebut berdekatan dengan post-entri.

6. Klik Simpan Template, dan sobat lihat hasilnya.

Baca Dulu...

// Label: Blog, Cara // 2 komentar //

3 Cara Membuat Artikel Terkait atau Related Post Di Blogspot

Cara Membuat dan Memasang Artikel Terkait di Blogspot – Pageview Blog merupakan jumlah tampilan halaman per’klik’, yakni jumlah akses halaman oleh pengunjung di dalam suatu Blog. Hal ini dilakukan visitor biasanya adanya tautan link pada posting berisi tema artikel yang unik dan menarik. Di samping kunjungan visitor, pageview dari pengunjung ini sangat berpengaruh terhadap ranking Alexa. Pageview juga mensiratkan betapa penting dan berkualitasnya postingan sobat.

Nah, kali ini salah satu untuk meningkatkan pageview Blog dengan cara memasang artikel terkait pada Blog. Di bawah posting sobat akan terdapat list atau daftar artikel yang berhubungan dengan tema posting. Cara kerjanya merujuk pada label yang sobat buat pada postingan. Tanpa berlama-lama, berikut cara memasang artikel terkait (Related post) pada Blogspot. Silahkan pilih tiga kategori desain artikel terkait yang sobat suka di bawah ini:

1. Cara Membuat Artikel Terkait Sederhana Pada Blog,
2. Cara Membuat Artikel Terkait Scroll di Blog,
3. Cara Memasang Related Post Thumbnail di Blogspot.

Description: Klik! 3 Cara Membuat Artikel Terkait atau Related Post di Blog Rating: 3.5 Reviewer: walman hadi ItemReviewed: Klik! 3 Cara Membuat Artikel Terkait atau Related Post di Blog

Baca Dulu...

// Label: Blog, Cara // 0 komentar //

Cara Merubah atau Mengetahui Ukuran Header Blog

Sering tampilan standar suatu blog belum bisa memuaskan hati,selalu saja ada yang ingin dirubah. Nah, kunci untuk merubah tampilan pada blog kita tidak bisa lepas dari struktur template dan yang paling sering dirubah adalah ukuran bagian header, sidebar dan halaman posting. Untuk memudahkan perlu dipahami istilah-istilah pada blogspot sebagai berikut :

• Header-wrapper, (halaman title dan deskripsi blog)
• outer-wrapper, ( halaman body secara keseluruhan)
• main-wrapper, (halaman posting)
• sidebar-wrapper, ( halaman tempat widget)
• footer-wrapper, (halaman catatan kaki)

Dengan menggunakan istilah-istilah tersebut maka kita bisa mencari masing-masing bagian pada template blog serta mengetahui dan bisa langsung merubah ukurannya sesuai dengan keinginan. Cara mencarinya adalah dengan menambahkan tanda # didepannya. Contoh jika ingin mencari ukuran header maka kode pencariannya menggunakan #header-wrapper. Untuk mencari bagian yang lain cara yang digunakan sama seperti tersebut diatas. Berikut contoh cara mengetahui dan merubah ukuran header :

1. Masuk ke halaman Dasbor blog anda dan klik pada Rancangan.

2. Klik pada Edit HTML.

3. Kemudian carilah kode: #header-wrapper

4. Lebih mudahnya mencari tekan (Ctrl + F) pada keyboard lalu tekan Enter. Maka akan muncul kotak Find. Ketiklah kode yang akan dicari pada kotak tersebut lalu tekan Enter, maka secara otomatis akan muncul kode yang dicari dalam keadaan terseleksi dengan warna hijau.

5. Perhatikanlah beberapa baris kode dibawahnya. Sebagai contoh serta keterangannya akan tampak seperti di bawah ini:

#header-wrapper { (artinya halaman header)
width:900px; (artinya lebarnya 900 pixels)
height:120px; (artinya tingginya 120 pixels)

Sekarang kita sudah tahu itulah ukuran headernya, yaitu lebar 900px dan tingginya 120px. (Sebagai catatan, secara default ukuran yang ada pada header bisanya hanya lebar(width)nya saja. Untuk tinggi biasanya ditambahkan kemudian jika kita ingin memasang gambar pada header).

Untuk merubah lebar dan tingginya kita tinggal menggantikan angka tersebut sesuai dengan keinginan. Langkah ini juga berlaku untuk mencari dan merubah bagian sidebar dan halaman posting.

Selamat mencoba semoga berguna.

Baca Dulu...

Selasa, 08 Oktober 2013 // Label: Blog, Cara // 0 komentar //

Cara Membuat Open ID Versi Cara, Tips dan Informasi

Apa itu Open ID ?

Open ID adalah Identitas Digital (ID) adalah layanan otentikasi bagi pengguna (user) dengan kontrol akses serta sistem desentralisasi standar dan terbuka, sehingga memungkinkan pengguna untuk masuk (login) ke dalam berbagai platform situs pendukung OpenID hanya dengan satu Identitas Digital (ID) – Wikipedia.org
Beberapa situs besar yang menyediakan layanan OpenID diantaranya adalah Google, Yahoo, Paypal, AOL, Microsoft dan lainnya. Seperti juga pada Blogspot, layanan OpenID ini terdapat pada form komentar posting dimana si-komentator bisa mengisikan URL website blog kita masing-masing melalui OpenID itu.

Apa manfaat komentar menggunakan Open ID?

Komentar dengan OpenID merupakan salah satu teknikSEO dasar yang bisa kita lakukan dengan mudah. Jika blog yang kita beri komentar tersebut adalah jenis blog Dofollow, maka sudah pasti kita akan mendapatkan backlink gratis dari situ. Dan meskipun blog yang kita beri komentar tersebut bukanlah jenis Dofollow alias itu adalah blog Nofollow, toh dengan mengisi URL blog kita pada OpenID itu sama artinya kita telah membuat pintu masuk untuk orang lain yang ingin berkunjung ke blog kita. Mungkin karena itulah para blogger lebih memilih berkomentar menggunakan OpenID dibanding menggunakan opsi lain yang disediakan.
Namun opsi komentar dengan OpenID ini tidaklah semua blog menyediakan, tergantung masing-masing pemilik blog mengijinkan layanan OpenID tersebut atau tidak.
Di menu setting Blogspot, fitur komentar dengan OpenID bisa diaktifkan maupun tidak, tergantung si-pemilik blog tersebut.

Kenapa kita perlu mem-verifikasi OpenID?
Banyak kasus blog yang jika berkomentar dengan memilih opsi OpenID selalu muncul pesan erorr seperti ini :

"Your OpenID Credentials Could Not be Verified"

Pernah mengalami yang seperti itu?
Pesan seperti diatas maksudnya adalah akun OpenID dengan URL blog yang kita tautkan itu perlu dibuktikan kepemilikannya. Untuk itu kita perlu melakukan verifikasi terlebih dulu.
Meskipun ada juga beberapa kasus yang tanpa melakukan verifikasi-pun, berkomentar menggunakan OpenID bisa-bisa saja. Namun perlu saya infokan disini, menurut para senior jika berkomentar (di blog Dofollow) dengan OpenID yang tidak di verifikasi, URL blog yang kita tautkan itu tadi tidaklah dianggap sebagai backlink oleh Google.

Dan saran saya, apakah tidak sebaiknya OpenID kita verifikasi saja, caranya juga mudah dan gampang.

Kita hanya perlu menambahkan kode berikut dibawah ini tepat dibawah <head> pada HTML template.

<link href='http://www.blogger.com/openid-server.g' rel='openid.server'/>

<link expr:href='data:blog.homepageUrl' rel='openid.delegate'/>

Jika sudah tinggal disimpan saja template-nya.

Setelah itu berkomentarlah dengan OpenID pada kolom OpenID isilah dengan URL blog sobat, dijamin tidak akan mengalami pesan erorr! lagi.

sekian posting dari Cara, Tips dan Informasi yang berjudul Cara Membuat Open ID Versi Cara, Tips dan Informasi. Selamat mencoba...

Semoga berhasil...

Baca Dulu...

// Label: Blog, Cara // 5 komentar //

Cara Memasang / Membuat Menu di Blog Melalui Css Menu Maker

Selamat Malam, Para sobat blogger seperti yang kita ketahui menu itu mungkin salah satu yang penting untuk blog kita, manfaat menu :
1. Mempercepat Untuk Mendapatkan Sitelink
            Dengan adanya menu navigasi maka blog/web semakin cepat mendapatkan sitelink karena sebagian dari beberapa sitelinknya berasal dari menu navigasi

2. Dinilai Sebagai Web/Blog Profesional
             Mengapa dinilai sebagai profesional ? . karena kita telah menyusun rapih artikel artikel kita dan telah mengatur sekat antara post 1 dan post lainya serta kita telah mengatur web kita menjadi user friendly karena dengan mudah para visitor untuk menjelajahi blog kita dan dengan mudah mengunggah daya tarik pengunjung.

3. Dinilai Baik dari Google
             Dinilai baik oleh google karena kita telah memanjakan visitor dan google tau itu . maka dari itu google akan menilai lebih pada blog kita

Dari semua itu tidak menutup kemungkinan juga blog/web yang tidak memiliki menu navigasi bisa lebih baik dari blog/web yang memiliki menu navigasi , karena itu semua tergantung kita me-manage blog/web kita / apakah blog/web kita telah ditata dengan baik atau tidak .

Cara Memasang / Membuat Menu Melalui Css Menu Maker:
1. Masuk ke css menu maker disini.
2. Pilih salah satu menu pilihan sobat.
3. Pilih costumize.
4. Design sesuai yang sobat inginkan
5. Masuk ke dasbor blog sobat.
6. Pilih Tata letak
7. Pilih Tambah Gadget, lalu pilih java script masukkan code html java script.
8. Lalu simpan.
9. Pilih Template, lalu pilih Edit Html.
10. Masukkan code css tadi di atas ]]></b:skin> tekan Ctrl+F lalu ketikan ]]></b:skin> tekan Enter.
11. Kalau sudah, Simpan template.

Sekian postingan dari Cara, Tips dan Informasi yang berjudul Cara Memasang / Membuat Menu di Blog Melalui Css Menu Maker, semoga bermanfaat

Baca Dulu...

Kamis, 19 September 2013 // Label: Cara // 1 komentar //

Cara Membuat Background dan Border/Bingkai Pada Text di Postingan

Pada postingan kali ini saya akan share Cara yaitu menggunakan code html, kita tau bahwa penguasaan akan code - code yang diperlukan untuk membuat suatu postingan yang tertata dan menarik sangatlah diperlukan, termasuk diantaranya adalah code HTML untuk membuat background dan border / bingkai pada postingan. Penguasaan akan code - code ini sangat perlukan, terutama bagi anda seorang blogger ponsel seperti saya ini yang hanya berbekalkan sebuah hp dalam membuat setiap postingan.
Langsung saja pada inti dari postingan ini yaitu Cara membuat background dan border pada postingan blog. Untuk membuat background dengan border didalam postingan blog tidaklah terlalu sulit asalakan kita tau codenya. Berikut ini adalah code yang digunakan untuk membuat background dan border pada postingan blog .

<div style="background: Red;border:1px solid #000; padding:6px; margin-left:20px"> Ini adalah text yang akan anda rubah backgroundnya, text yang ada disini akan memiliki background dan berada didalam border / bingkai yang anda tentukan </div>

Code Diatas, akan menghasilkan text dengan warna background hijau dan border hitam seperti dibawah ini:

Ini adalah text yang akan anda rubah backgroundnya, text yang ada disini akan memiliki background dan berada didalam border / bingkai yang anda tentukan

Silahkan dirubah sesuai yang dinginkan, Berikut ini penjelasan dari code diatas:

Background
ini berfungsi mengatur warna background text yang dikehendaki, dalam contoh diatas saya menggunakan warna hijau dengan code green. Silahkan ubah sesuai warna yang diinginkan.
back = hitam
white = putih
red = merah
blue = biru
yellow = kuning
grey = abu - abu
dan masih banyak lagi, anda juga bisa menggunakan code - code yang lebih terperinci, silahkan Klik Disini untuk melihat code - code warna html.

Border
ini berfungsi sebagai border atau bingkai, disana terdapat 1px dan solid #000. berikut adalah penjelasan masing - masing:

1px = mengatur ketebalan dari border / bingkai . Bisa anda sesuaikan dengan mengganti nilai px nya . Misal 3px , 4px dan seterusnya.

Solid= ini adalah style bordernya, ada banyak style atau jenis border pada code html, dan untuk jenis - jenis bordernya mungkin akan saya share dilain kesempatan...

#000 = mengatur warna dari border, silahkan diubah sesuai yang diinginkan dan untuk codenya silahkan klik pada link yang telah saya berikan diatas..

padding
ini untuk mengatur jarak antara border dengan text yang ada didalam border. Semakin besar nilai px semakin jauh pula jarak text dengan border.

margin
ini adalah kebalikan dari padding yaitu mengatur jarak antara border dengan text atau elemen yang ada di bagian luar border. pada contoh diatas, untuk memperjelas fungsinya saya menggunakan margin-left, itu artinya hanya jarak kebagian luar sebelah kiri saja yang diatur. Dan bisa anda lihat perbedaannya. Untuk mengatur secara keceluruhan cukup menggunakan margin saja. Misal, margin:3px . Itu artinya jarak dari border ke elemen luar untuk setiap sisi adalah 3px. Untuk pembahasan lebih lanjut tentang penggunaan margin ini, mungkin akan saya share dilain kesempatan.

Sekian dulu postingan dari cara-tips-dan-informasi.blogspot.com tentang cara memberi background dan bingkai pada postingan blog , semoga bermanfaat.

Baca Dulu...

Jumat, 02 Agustus 2013 // Label: Cara // 1 komentar //

Cara Membuat Effect Teks Neon Pada Blog

Untuk Mempercantik Blog Sobat... mungkin tidak ada salah nya Coba....!!
Berikut Cara, Tips dan Informasi kembali dengan Postingan" Cara membuat Effect Teks Neon Pada Blog "

langkah-langkah berikut untuk membuat Effect Teks Neon Pada Blog Sobat.

Masuk Ke Blogger Sobat..
Pilih Tata Letak
Setelah itu pilih Tambah Gadget
Dan Pilih HTML / JAVA SCRIPT

Kemudian Copy dan Paste Script di bawah ini di HTML :

Simpan dan Lihat Hasilnya...!

Semoga berhasil, Selamat mencoba...

Baca Dulu...

Kamis, 01 Agustus 2013 // Label: Cara // 0 komentar //

Cara/Tips Mudah Membuat Readmore Otomatis di Blog

Cara/Tips Mudah Membuat Read More Otomatis di Blog – banyak para sobat blogger yang masih kebingungan untuk membuat readmore otomatis di blog mereka, walaupun banyak sekali artikel-artikel yang mebahas bagaimana cara membuat readmore otomatis. Hal ini disebabkan karena banyaknya artikel yang copas padahal si pemilik blog sendiri tidak faham dengan caranya. Disini saya akan menjelaskan cara membuat readmore otomatis secara detail sehingga blogger pemula sekalipun bisa membuatnya.

Mungkin para sobat blogger pemula atau newbie masih bingung apa itu readmore?. Read more adalah penggalan dalam sebuah artikel, biasanya hanya menampilkan beberapa kalimat saja dan biasanya di tandai dengan kata "Read more", Baca Selengkapnya, dll.

Manfaat readmore juga untuk mempersingkat atau merapihkan artikel yang panjang, jadi postingan artikel anda akan tersusun rapi dengan hanya menampilkan gambar dan beberapa kalimat saja, dan juga bisa ditambahkan Next Page Dengan Angka/Nomor

Cara membuat readmore otomatis dengan gambar :

Silahkan buka template anda. Pilih: Template >> Edit Html.
Cari Kode </head>.
Copy paste kode dibawah ini tepat di atas kode </head>

<script type='text/javascript'> var thumbnail_mode = "no-float" ; summary_noimg = 440; summary_img = 350; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://cara-tips-dan-informasi.blogspot.com/read-moreotomatis.js' type='text/javascript'/>

   Sobat dapat mengatur panjang dan lebar readmore dengan mengubah angka berwarna biru,
    berikut keterangannya:
- summary_noimg = 440: tinggi potongan artikel tanpa gambar.
    - summary_img = 350: tinggi potongan artikel dengan gambar.
    - img_thumb_height = 100: ukuran tinggi thumbnail.
    - img_thumb_width = 120: ukuran lebar thumbnail.

. Langkah selanjutnya cari kode <data:post.body/> lalu ganti tag <data:post.body/> dengan kode script di bawah ini :

<b:if cond='data:blog.pageType != "item"'> <div expr:id='"summary" + data:post.id'><data:post.body/></div><script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script><span class='rmlink' style='float:right;padding-top:20px;'><a expr:href='data:post.url'>»»  Readmore...</a></span> </b:if><b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>

Untuk mengubah kata ‘read more’, silahkan ganti tulisan yang berwarna merah.

Selesai, klik Simpan Template. Jika langkah-langkah di atas sudah benar, sobat sudah bisa melihat hasilnya.

Terlihat seperti sulit tetapi jika sambil di praktekan pasti bisa karena ini sudah sangat detail, jika saya menjelaskan dengan singkat mungkin para blogger pemula tidak akan mengerti atau kesusahan membuatnya.

sekian dulu sari saya cara-tips-dan-informasi.blogspot.com untuk Cara/Tips Mudah Membuat Readmore Otomatis di Blog semoga bermanfaat.

Baca Dulu...

Rabu, 31 Juli 2013 // Label: Cara // 2 komentar //

Cara Membuat Efek Metal Dengan Neon Di Photoshop

Dalam tutorial kali ini gambar bahan yang di perlukan adalah :

1. Background

DOWNLOAD

2. Gambar efek baut

DOWNLOAD

3. Jenis Huruf Acens

DOWNLOAD

Atau jika anda ingin mendownloadnya dalam saru paket + hasil tutorial kali dalam format .psd silakan download di bawah ini :

DOWNLOAD SOURCE DAN HASIL FORMAT PSD DISINI

Unutuk membuat text effect metal neon, langkah-langkahnya adalah sebagai berikut :

1. Jika anda belum menginstall jenis huruf acens silakan install dulu

2. Setelah menginstall jenis huruf, sekarang buka photoshop anda.

3. Setelah itu, Buka dahulu gambar background yang telah anda download tadi (ctrl + o).

4. Setelah itu dengan menggunakan text tool, dan dengan jenis huruf acens dan ukuran sesuai keinginan anda mulailah menuliskan huruf yang anda inginkan.

5. Sekarang untuk membuat effect metal, langkah pertama adalah klik kanan pada layer tulisan dan pilihlah blending option. Unutuk pengaturannya silakan lihat gambar di bawah.

· Pengaturan Drop shadow

· Pengaturan Outer Glow

· Pengaturan Bevel anda Emboss

· Pengaturan Color Overlay

· Pengaturan Gradien overlay

· Pengaturan Satin

6. Langkah selanjutnya adalah, anda akan memassuka gambar efek baut.png yang telah anda download tadi, untuk menciptakan efek baut pada text. Caranya anda masuk ke menu file -> place dan pilihlah gambar efek baut yang telah anda download tadi.

7. Kemudian anda sesuaikan posisi dan ukurannya dengan menekan (ctrl + t), hingga sesuai jika sudah sesuai tekan enter.

8. Gandakan gambar baut tersebut secukupnya dengan cara menekan CTRL + J dan sesuaikanlah posisi baut-baut tersebut. Seperti pada gambar di bawah.

9. Sekarang kita akan membuat cahaya neon, caranya buatlah sebuah kotak merah dengan menggunkan rectagle tool. Lihat gambar....

10. Jika sudah di buat, untuk memberikan efek cahaya neon, caranya klik kanan pada layer neon tadi dan pilihlah blending option. Unutuk pengaturannya lihat gambar di bawah.

· Pengaturan Inner shadow

· Pengaturan Inner Glow

· Pengaturan Outer Glow

· Pengaturan Color Overlay

· Pengaturan Satin

· Pengaturan Stroke

11. Setelah itu anda tinggal menggandakan layer neon itu dengan menekan ctrl+j, gandakanlah secukupnya dan aturlah posisinya.

12. Jika sudah mengatur neon, untuk membuat neon itu lebih terang, sekarang buatlah layer level di atas layer huruf, dengan cara klik kanan pada simbol seperti gambar di bawah . kemudian pilih level dan aturlah level tersebut dengan cara menggeser, neon terlihat lebih terang. Lihat gambar.

13. Dan efek metal dengan neon menyalapun sudah selesai, anda tinggal menambahkan kreasi anda.

Demikian artikel Cara, Tips dan Informasi yang berjudul Cara Membuat Efek Metal Dengan Neon Di Photoshop

Baca Dulu...

Kamis, 25 Juli 2013 // Label: Cara // 0 komentar //

Cara Membuat Artikel Terkait Berbentuk Gambar Thumbnails

Cara Memasang Artikel Terkait Dengan Scroll

Cara Membuat Artikel Terkait Sederhana Pada Blog

3 Cara Membuat Artikel Terkait atau Related Post Di Blogspot

Cara Merubah atau Mengetahui Ukuran Header Blog

Cara Membuat Open ID Versi Cara, Tips dan Informasi

Cara Memasang / Membuat Menu di Blog Melalui Css Menu Maker

Cara Membuat Background dan Border/Bingkai Pada Text di Postingan

Cara Membuat Effect Teks Neon Pada Blog

Cara/Tips Mudah Membuat Readmore Otomatis di Blog

Cara Membuat Efek Metal Dengan Neon Di Photoshop

Blog Ini Dilindungi Oleh :

About This Blog

Partner

Popular Posts

Label

Translate

Followers

Iklan