Membuat Posting Blog Tampil Otomatis di Facebook

Sesuai janjiku di postingan CARA MEMBUAT TWETS JADI STATUS DI FACEBOOK .
selanjutnya kita akan membuat POSTINGAN di blog kita otomatis  muncul sebagai Twets di twitter sekaligus jadi status di FAcebook kita.

dengan begitu kita bisa sekaligus memperkenalkan postingan-postingan di blog kita dengan teman-teman kita di FACEBOOK dan TWITTER dan juga tentunya menambah pengunjung blog kita.

Sebenarnya cara ini sudah lama ada, jadi bisa di bilang UnoZoneu

Sesuai janjiku di postingan CARA MEMBUAT TWETS JADI STATUS DI FACEBOOK .
selanjutnya kita akan membuat POSTINGAN di blog kita otomatis  muncul sebagai Twets di twitter sekaligus jadi status di FAcebook kita.

dengan begitu kita bisa sekaligus memperkenalkan postingan-postingan di blog kita dengan teman-teman kita di FACEBOOK dan TWITTER dan juga tentunya menambah pengunjung blog kita.

Sebenarnya cara ini sudah lama ada, jadi bisa di bilang UnoZoneu sudah sangat telat postingnya.
jadi caranya begini : kita pertama tama membuat postingan kita muncul dulu di twitter. lalu kita buat lagi agar twets kita muncul jadi status FB


LALU cara membuat postingan kita otomatis menjadi status facebook

register twitterfeed

1. Buka situs http://twitterfeed.com
  lalu daftar / register di sana . daftar seperti biasa lewat email atau bisa juga lebih gampang pakai openID .

2.Setelah itu kita akan langsung masuk.
  langkah pertama kita masukan nama dan alamat feed blog yang postingannya akan kita jadikan twets dan status FB.
(untuk alamat feed blogspot biasanya = http://NAMABLOGKAMU.blogspot.com/feeds/posts/default

keterangan advance setting twitterfeed

dibawahnya ada menu advance setting dan kalau di klik akan muncul pilihan pilihan sebagai berikut .
keterangannya:

- 'update frequency' and 'post up to' = setiap berapa waktu blog kita akan di cek postingannya dan berapa postingan yang akan di munculkan ke twitter ? misalnya kalau kita memilih '1 hour'  dan up to = 2 itu artinya setiap satu jam feed kita akan diupdate , jadi jika dalam jangka satu jam kita membuat 2 postingan, maka postingan tersebut akan muncul di twets kita, tapi kalau kita memilih '2 hour' atau seterusnya maka postingan kita akan muncul dalam jangka 2 jam atau seterusnya . kalau blognya sering update kusarankan pilih yang 30 minutes dan post up to 5, agar lebih banyak postingan kita yang di tampilkan.

- Post content = yang muncul nanti apakah title (judul postingan) dan description (isi postingan) atau hanya salah satunya saja. klik title saja kalau ingin manampilkan cuma judul postingan kita.

-post link = pemendek url yang ingin digunakan sebagai url menuju postingan kita

-Post prefix = Kata yang muncul sebelum twets postingan kita. misalnya: baca ya '.....'

-Post Sufix = kebalikan dari post prefix. kata yang muncul di akhir pot twets

-Keyword Filter = untuk menyaring atau memilih postingan tertentu saja yang akan dimasukkan .
sebaiknya sih tidak usah , agar semu postngan bisa masuk.

3. setelah itu kita tinggal pilih postingan kita itu mau di masukkan kemana , kalu dulu seh cuman bisa otomatis masuk ke TWITTER tapi sekarang pilihannya sudah banyak termasuk juga FACEBOOK.
misal kita pilih Twitter klik authenticate twitter .
kemudian masukan username dan password twiiter sobat, lalu pilih allow.

kalau sudah akan muncul tulisan 'Twitter auth successful' lalu klik create services yang ada di pojok kiri bawah.

dengan begitu setiap kita membuat postingan di blog, maka akan secara otomatis jadi TWETS dan STATUS FACEBOOK kita.


semoga bermanfaat !

Read more »

Membuat 3 Kolom Elemen di Bawah Posting

Footer 3 kolom yang saya maksud adalah kolom yang berada dibawah,jadi jika kamu pengen meletakkan widget anda yang pasti footer ini akan sangat berguna juga,saya juga baru menambahkan footer 3 kolom pada template saya ini, lhatlah keren gak ya ha ha ha.....Footer wraper dari template klasik hanya mempunyai satu widget, begitu pula template - template minima hasil design para master web.

Bagi anda yang ingin mengganti footer - nya menjadi 3,4,atau 5 kolom, anda bisa menggati kodenya dengan kode dibawah ini,caranya :

>>>login ke blog anda
>>>Klik Tata Letak
>>>Edit Html
>>>Cari kode #footer-wrapper atau yang mirip seperti itu, kalo sudah ketemu hapus kode tersebut dan ganti dengan kode dibawah ini:

---

---

/* ----- FOOTER ----- */

#footer-wrapper {
clear: both;width: 100%;
word-wrap: break-word;
overflow: hidden;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;

border: 1px solid $bordercolor;
}
#footer {
margin: 0px 0px 0px 0px;
padding: 0px 0px 10px 0px;
text-align: left;width: 960px;
color: #000000;
font: $footerTextFont;
line-height: 1.6em;
}
#footer h2 {
margin: 10px 0px 0px 0px;
padding: 3px 0px 3px 0px;
color: #cc0000;
font: $footerTextFont;
}
#footer1 {width:320px;float:left; padding: 0px;border: 1px solid #cccccc;}
#footer2 {width:320px;float:right;padding: 0px;border: 1px solid #cccccc;}
#footer3 {width:320px;float:left;padding: 0px;border: 1px solid #cccccc;}
#footer1 .widget-content {margin:0 .5em 0 ;}
#footer2 .widget-content {margin:0 .5em 0 ;}
#footer3 .widget-content {margin:0 .5em 0 ;}
#footer a { color: #3D81EE; text-decoration: none; }
#footer a:hover { color: #cc0000; text-decoration: none; }
#footer a:visited { color: #3D81EE; text-decoration: none;}

---

---

>>Kemudian cari kode yang mirip dengan kode diwah ini:

<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>

>>>setalah menemukan code diatas selanjutnya ganti dengan code dibawah ini:

<div id='footer-wrapper'>
<div id='footer'>

<b:section class='footer' id='footer1' preferred='yes'>
</b:section>


<b:section class='footer' id='footer2' preferred='yes'>
</b:section>

<b:section class='footer' id='footer3' preferred='yes'>
</b:section>

</div>
<div style='clear:both;'/>
</div><!-- end footer-wrapper -->

>>>Simpan template
>>>Selesai,Kode di atas untuk membuat footer 3 kolom

NB:agar sesui pada blog anda sebaiknya anda ukur dulu lebar pada blog kamu, sesuaikan juga warna pada kode css seperti yang anda inginkan, lihat blog saya ini ini juga hasil otakatik aja seperti tutorial ini bagus gak,,he he he...
semoga bermanfaat.

Read more »

Membuat Related Post dengan Scroll

Sobat semua pasti sudah tahu semua tentang "Related Post". Tapi bagi yang belum tahu, related post adalah artikel yang berhubungan atau terkait. Widget ini dibuat agar di blog kita menampilkan artikel-artikel yang masih terkait atau masih berhubungan dengan artikel yang mereka baca. Tapi pada bahasan kali ini, saya tidak akan membahas bagaimana cara membuat "Related Post" yang biasa, tetapi kali ini saya akan berbagi cara membuat related post dengan fungsi scroll. Sobat semua bisa melihat contohnya seperti di setiap postingan blog saya ini.
Kenapa saya tidak membahas cara membuat related post yang biasa, karena kalau dalam satu kategori kita mempunyai banyak sekali artikel, maka kalau tetap menggunakan cara seperti itu akan memenuhi halaman blog kita.

Kalau diantara para Sobat ingin mencobanya, silahkan ikuti langkah-langkah berikut ini :
1. Seperti biasa, Login dulu di akun blogger Sobat
2. Klik "Tata Letak" => "Edit HTML"
3. Centang "Expand Template Widget"
4. Cari kode dibawah ini :

<p><data:post.body/></p>

   atau

<data:post.body/>

 5. Copy kode berikut dan paste di bawah kode no 4

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<H2>Artikel Terkait</H2>
<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 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 50;
maxNumberOfLabels = 3;
function listEntries10(json) {
var ul = document.createElement(&#39;ul&#39;);
var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i &lt; maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k &lt; entry.link.length; k++) {
if (entry.link[k].rel == &#39;alternate&#39;) {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement(&#39;li&#39;);
var a = document.createElement(&#39;a&#39;);
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 &lt; json.feed.link.length; l++) {
if (json.feed.link[l].rel == &#39;alternate&#39;) {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
var txt = document.createTextNode(label);
var h = document.createElement(&#39;b&#39;);
h.appendChild(txt);
var div1 = document.createElement(&#39;div&#39;);
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById(&#39;albri&#39;).appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement(&#39;script&#39;);
script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
+ label +
&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
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 = &quot;<data:label.name/>&quot;;
var test = 0;
for (var i = 0; i &lt; labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel &lt; maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
<script type='text/javascript'>RelPost();</script>
</div>
</b:if> 

 Silahkan ganti tulisan yang berwarna merah sesuai dengan keinginan Sobat. Misalnya : "Related Post" atau "Artikel Yang Berhubungan".

Read more »

Menampilkan Widget di Halaman yang Diinginkan

Sebagaimana Kalian ketahui bahwa, widget itu banyak manfaat-nya, mungkin sebagai penghias blog, sebagai layanan instant di blog kita, dan lain sebagainya. kata orang, yang terpenting dari blog adalah postingannya, itu memang betul, tapi alangkah bagusnya jika postingan itu di selingi oleh sebuah widget? mungkin tanpa widget, blog kita terasa hampa. Tapi ada tanggapan bahwa kalo kebanyakan widget akan membuat blog kita berat, itu pernyataan yang benar, tapi sekarang ada solusinya. Yaitu Dengan Menampilkan Widget Di halaman Yang Diinginan. Keuntungannya adalah agar side bar lebih hemat, tidak memberatkan blog dan masih banyak lagi fungsinya. Contohnya sepert: Widget langganan Muncul Di HompePage saja, tp jika membuka artikel, widget itu hilang. Gimana cara mengaturnya? lihat ayat-ayat di bawah ini:


Masuk ke Blog >> tata letak >> Edit HTML

Lalu cari kode ini:

<b:widget id='HTML1' locked='false' title='Judul Widget' type='HTML'>

<b:includable id='main'>

<b:if cond='data:blog.pageType == "index"'>

<!-- only display title if it's non-empty -->

<b:if cond='data:title != &quot;&quot;'>

<h2 class='title'><data:title/></h2>

</b:if>

<div class='widget-content'>

<data:content/>

</div>

</b:if>

<b:include name='quickedit'/>

</b:includable>

</b:widget>

ket:-kata yang berwarna merah adalah widget yang ada di blog kalian
-kata yang berwarna biru adalah kode yang harus ditambahkan(halaman depan saja)

Adapun kode kode yang lain:

Untuk halaman depan saja(seperti contoh diatas)

<b:if cond='data:blog.pageType == "index"'>

untuk di halaman artikel saja:

<b:if cond='data:blog.pageType == "item"'>

untuk dihalaman archive saja:

<b:if cond='data:blog.pageType == "archive"'>

Untuk di halaman tertentu:

<b:if cond="[URL halaman anda]" == data:blog.url'>

Begitu aja hal-hal yang bisa saya sampaikan, semoga berhasil. Jika masih bingung, silahkan berkomentar di bawah ini

Read more »

Compress CSS Untuk Mempercepat Loading Blog

Wah padahal saya sedang pusing ketika menulis posting ini, dengan penuh penuh perjuangan melawan kepala saya yang hampir meledak ini saya akhirnya selesai juga postingan ini. Yah, artikel hari ini Insya Allah, sangat di butuhkan oleh beberapa kawan-kawan blogger semua. Amiinnnn.....

Lha kenapa kok sangat di butuhkan? iya, karena kebanyakan blogger sangat senang yang namanya memperhias blog, sehingga membuat blog kita menjadi berat. Betul tidak???

Oke Kita mulai saja ya????

Ada banyak cara agar blog kita tidak berat. Tapi ada 1 cara yang menurut saya paling ampuh.

1. Kompress Kode CSS anda

tips ini saya rasa sebagai tips yang sangat manjur, apalagi jika anda banyak menggunakan CSS, pasti blog anda langsung cepat secepat valentino rossi. hehehehe...

Lha gimana cara kompressnya???

• Login ke blogger
• Masuk ke Tata letak
• Masuk ke Edit HTML
• centang kotak Expand Template Widget
• Jangan lupa back up dulu template anda
  
• Copy semua kode setelah kode <b:skin><![CDATA[/* dan sebelum kode ]]></b:skin> ke dalam notepad
• Masuk ke alamat: http://www.csscompressor.com/
• Dan letakan Kode yang kamu copy tadi di kotak yang telah disediakan
• Klik Compress
• Lalu setelah menunggu, kode yang sudah di kompress tadi keluar
• Masukan Kode Yang sudah kompress tadi, setelah kode <b:skin><![CDATA[/* dan sebelum kode ]]></b:skin>
• Simpan Template anda, dan ukur kecepatan blog anda di sini: http://www.iwebtool.com/speed_test

Read more »