Kumpulan Nama Bayi Islami - Tips Memilih Nama Bayi

Bayi LucuKali ini saya akan share Kumpulan Nama Bayi Islami Laki-Laki maupun Perempuan dan Tips Memilih Nama Bayi yang mengandung kata-kata islami. Salam para pencari nama bayi, kalau saat ini kamu masih mencari nama bayi maka informasi berikut mungkin berguna bagi ibu. Dalam memberikan nama bayi islami hendaknya kita memperhatikan beberapa hal diantaranya adalah :PantasNama Bayi yang kita

Tips Memilih Kado Ulang Tahun Buat Pacar

Tips menemukan kado ulang tahun istimewa buat pacar kamu. Apakah Kamu dan pacar kamu telah berpacaran selama tiga bulan atau tiga tahun, ia berhak untuk memiliki hadiah yang indah dari kamu setiap kali dia merayakan hari ulang tahunnya. Dipikirkan dengan baik hadiah ulang tahun istimewa adalah cara yang bagus untuk menunjukkan kasih sayang dan cinta untuk pacarmu.Beberapa orang mungkin

Tips Merawat Komputer dan Laptop Supaya Tidak Cepat Rusak

Merawat Komputer / LaptopApa kabar sobat GudangBlog?? Kali ini saya akan membagi tips merawat komputer atau laptop kamu agar tidak cepat rusak. Biasanya komputer/Laptop rusak itu karena kita kurang merawatnya atau salah dalam menggunakannya. Berikut beberapa langkah yang bisa diterapkan untuk memelihara dan menjaga perangkat keras “hardware” dan perangkat lunak “software” komputer dan laptop.

Tips Jual dan Beli Blackberry | Tips Sebelum Membeli Blackberry

BlackberryTips Jual dan Beli Blackberry - Meski sudah digunakan oleh banyak orang dan disosialisasikan sedemikian rupa dengan segala cara, nampaknya produk Blackberry tidak serta merta dikenal dengan baik oleh masyarakat. Bukan hanya harganya saja yang mungkin tidak masuk akal bagi sebagian pengguna HP, namun sejumlah fitur yang dibawa serta layanan Blackberry-Nya itu sendiri masih terasa

Cara Meluruskan Rambut Secara Alami

Cara Meluruskan Rambut -  Rambut merupakan mahkota bagi wanita, Rambut yang baik dan lurus merupakan dambaan setiap setiap wanita. Hingga tidak sedikit dari mereka yang menggunakan cara instan untuk meluruskan rambut Bagi wanita modern, menggunakan alat pencatok telah menjadi solusi untuk meluruskan rambut. Sayangnya, alat pencatok dapat merusak enemel rambut. Beralihlah ke bahan-bahan

Cara Memasang Total Post & Total Komen

Assalamualaikum..Pekabor semua?? Sebagai permulaan setelah lama meniggalkan dunia blogging..kira post pertama yang ditulis di tanahair ni..kita mula dengan perkara mudah aje..Pasang Total Post dan Total Komen.

Macam biasa dalam keadaan Loggin. Copy kod2 dibawah dan paste di Add a Gadget => HTML/Javascript.

<script style="text/javascript">

function numberOfPosts(json) {
document.write('Total Posts: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');
}
function numberOfComments(json) {
document.write('Total Comments: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');
}
</script>
<ul><li><script src="http://NAMABLOG.blogspot.com/feeds/posts/default?alt=json-in-script&callback=numberOfPosts"></script></li>

<li><script src="http://NAMABLOG.blogspot.com/feeds/comments/default?alt=json-in-script&callback=numberOfComments"></script></li></ul>

Gantikan text merah dengan nama blog Antum..Dah siap klik save yer..

Highlight Script/Kode Pada Postingan

Membuat Highlight pada script atau kode di postingan akan lebih menampakkan pembaca. Macam blog ini. Setiap kali ada script/kode Ana akan highlightkan. Ini caranya.. Tapi Ana baru je upgrade highlight ni. BroSKL boleh pakai yang ni dulu.

1. Login ke blogger pastu pilih Layout-->Edit HTML
2. Kemudian copy kode dibawah ini dan letakkan sebelum kode ]]></b:skin>

.alert {
background: #DDE4FF;
text-align: left;
padding: 5px 5px 5px 5px;
border: 1px solid #223344;}

Kode yang berwarna merah (#DDE4FF) adalah warna background kotak highlight, Antum tukarla mengikut kesesuaian template Antum.Boleh dapatkan script warna DISINI.

3. Pastu klik butang save yer..

Cara Posting..

Tambahkan kode ini <p class="alert"> sebelum kode/script yang akan dihighlight. kemudian tambahkan kode </p> diakhir script/Kode.

Perhatikan contoh dibawah.

<p class="alert">.alert {
background: #DDE4FF;
text-align: left;
padding: 5px 5px 5px 5px;
border: 1px solid #223344;}</p>

Selamt Mencuba!!

Trik SMS-an di Komputer

Selama handphone kita terhubung ke komputer dengan Nokia PC Suite, kita bisa mengirim, menulis dan menyimpan SMS di komputer. Dengan cara ini, ber-sms menjadi lebih nyaman karena kita membaca pesan di layar yang lebih besar dan menuliskan pesan dengan keyboard komputer.Mengirimkan SMS di Komputer1. Sambungkan handphone ke komputer, dan jalankan Nokia PC suite.2. Klik ikon Message3. Klik tombol

Cara Menukar Icon Pada Address Bar

Assalamualaikum..ok..Kalau kita buka sesuatu website atau blog maka kekadang kita tengok ada gambar atau icon pada address bar (kat tempat alamat url tu). Contohnya disebelah alamat Ana ada icon greenstar dan jika di Blogspot maka icon default yang akan timbul adalah gambar seperti ini : Ini namanya "Favorite Icon/Favicon"

Kalau rasa nak tukar dengan icon/gambar yang kita inginkan, caranya sangat mudah, cuma dengan membuat gambar (gif, jpg, ico, dan lain2) dengan ukuran kira-kira 50x50 pixel (sebenarnya tiada ukuran yang tepat, cuma kita nakkan file yang lebih kecil dan cepat dibuka). ok .....next masuk ke "Layout => Edit HTML" pastu copy kode dibawah dan pastekan sebelum kode</head>

<link href='http://almansuqie-tips.com/starstar21.gif' rel='SHORTCUT ICON'/>

Tukar text yang ditebalkan dengan warna biru dengan link gambar/icon yang sudah Antum uploadkan. Ana biasa upload di Photobucket dan juga di Imageshack..Kalau Antum nak upload kat tempat lain pun boleh. Asalkan dapat link gambar tu.

ok setle...Selamat mencuba!!

Cara Membuat Link Download

Menjawab pertanyaan pkgkualapilah dengan detail, Ok caranya mudah sekali..Ada dua cara kita boleh gunakan untuk buat link download.

1. Pertama dengan text link.. Biasa kita tulis Download Disini. Ok untuk yang ini boleh refer pada Tip Memasukkan Link Di Postingan.

2. Cara kedua dengan menggunakan kod ini..

<a href="http://s302.photobucket.com/albums/nn113/aburifaie/?action=view&current=down.jpg" target="_blank"><img src="http://i302.photobucket.com/albums/nn113/aburifaie/down.jpg" alt="Download"></a>

3. Gantikan text merah dengan link Download Antum dan text ungu dengan link Icon Donwload Antum. Ini hasilnya.Klik icon untuk Download Mozilla Firefox 3.

Cara Menghilangkan Status Message

Status message ini akan muncul di atas posting bila kita tekan label atau kita search artikel dalam blog tersebut. Ada sesetengah orang tidak suka dan rasa menyemak je kan, dan terasa nak buang terus status ini. Ok jangan risau, ini cara membuangnya.

1. Sekiranya kita menekan label, ia akan muncul begini,


2. Sekiranya artikel yang kita cari menggunakan kotak search yang disediakan atau pada navbar tiada, maka status begini akan muncul.



3. Loggin ke Blogger, pada layout pilih Edit HTML. Jangan lupa tandakan pada kotak “Expand Widget Templates”. Untuk langkah berjaga2 sila "Download Full Template dulu".

4. Seterusnya cari kod ini.. Guna Ctrl+F untuk lebih cepat. Delete kod berwarna merah.

<!-- posts -->
<div class='blog-posts'>

<b:include data='top' name='status-message'/>

5. Siap padam klik butang save.. Insyaallah xkan muncul lagi. Kalau Antum memerlukannya kembali, cuma kembalikan kod merah tu ke tempatnya.

Cara Membahagikan Posting

Tutorial ni bukan la Ana yang buat.. Ini hasil kepandaian Amanda Fazani sohib BloggerBuster. Ana sekodar edit sikit2 aje.. Sebenarnya dah ade template yang dibuat khas dengan bentuk ini, namanya Minima Magazine Template. Contoh Template ni, tp lebih kemas.Ok caranya begini..

1. Pilih Layout => Edit HTML. Tambahkan kod dibawah selepas </head>

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<style>
.post {
height:285px;
width: 238px;
float: left;
overflow: hidden;
}
</style>
</b:if>

2. Antum ubahkan lebarnya mengikut lebar main-wrapper. Contoh blog Ana ni, saiz main-wrapper 512px, jadi Ana saizkan dengan 238px untuk dapatkan 2 kotak. Maby boleh dapat 3 kotak jika main-wrapper yang lebih besar.

3. Seterusnya klik preview dan lihat hasilnya... kalau dah berjaya savela.

p/s: sila gunakan Read More V2

Membuat Read More V2

Sebelum ini Ana dah postkan Cara Membuat Readmore yang bila ditekan akan teruskan memaparkan keseluruhan tanpa perlu loading. Ok sekarang ni kita buat readmore yang lain sikit. Tutorial ini sebenarnya terbit lebih awal.. kira version 1, tapi disebabkan Ana postkan kemudian maka jadilah V2. Ok ini caranya..

1. Pilih Layout => EditHTML. Tandakan pada kotak "expand widget template". Cari kod ini..

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

2. Kalau dah jumpa gantikan dengan kod di bawah.

<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>

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

<a expr:href='data:post.url'>Read More......</a>
</b:if>

3. Tulisan merah boleh diubah..Siap dah...Klik Save.

4. Seterusnya paling penting. Untuk buat readmore pada entry, gunakan kode ini. lihat contoh.

Awal penulisan bermula<span class="fullpost">Penulisan yang selebihnya yang ingin direadmorekan</span>

Jenis-Jenis Border, Tambah dan Buang

Ape itu border?? Entahla..Garisan luar la gitu.. Template kita biasa dihiasi dengan border, untuk image, header, sidebar dan macam² la. Ok kali ini kita sama² mengenali jenis2 border yang disediakan untuk blogger. Biasanya kod border adalah seperti ini.

border:1px solid $bordercolor;

1. Merah adalah saiz border, Boleh dibesarkan dan dikecilkan. Selain dari px, boleh juga menggunakan kod ini.

*1px (atau lebih)
*thin
*medium
*thick

2. Biru adalah jenis-jenis border, Antaranya ialah:

*none
*hidden
*dotted
*solid
*dashed
*double
*groove
*ridge
*inset
*outset

3. Ungu adalah warna border. Boleh juga guna kode warna. Dapatkan kod warna Disini.

Ok kita terus kepada jenis-jenis border. Contoh pada image pada posting.

.post img {
border:2px solid #ff00ff;
}

.profile-img {
border: 2px dashed #ff00ff;
}

.post img {
border:2px outset #ff00ff;
}

.post img {
border:2px inset #ff00ff;
}

.post img {
border:6px ridge #ff00ff;
}

.post img {
border:6px dotted #ff00ff;
}

Contoh lain tu kasi cuba sendirila di blog Antum ye..

Kalau nak buang border pula begini yer..

.post img {
border:0px;
}

Ok sampai sini dulu..

Sumber:Tip For New Blogger

Cara Memasukkan Gambar di Header v2

Sebelum ni Ana dah buatkan tips untuk memasukkan sebarang gambar ke dalam header. Tutorial ni Ana buat khas untuk sahabat Manns'gor kerana tidak berjaya memasukkan gambar ke dalam header dengan tips sebelum ni. Sian Manns. Ok caranya begini..

Sediakan gambar header berukuran 660x250 (tinggi ikut sukala) dan uploadkan untuk dapatkan linknya.. Mudah upload di Photobucket

1. Loggin => Layout. Kali ini kita ke bahagian Edit HTML. Cari kod dibawah..

#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}

2. Tambahkan kod berwarna merah..

#header-wrapper {
background-image:url(http://i302.photobucket.com/albums/nn113/aburifaie/91.jpg);
height:250px;
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}

3. Tukar link yang kelip² tu dengan link gambar Antum.Ini link header Ana. Xboleh guna. Tukarkan kod tinggi sekiranya gambar Antum lebih atau kurang dari 250px tinggi. Pastu klik preview dan lihat hasilnya.. Insyaallah gambar sudah muncul..

4. Tapi belum siap.. Border di dalam masih menyibuk kan.. Antum boleh buang atau besarkan die.. Cari kod ini, bawah sikit je.

#header {
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}

Kod merah tu ialah border, kalau nak buang delete aje.. kalau nak besarkan tambah dengan kod height:238px; seperti ini..

#header {
height:238px;
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}

Ok siap Alhamdulillah..

Understanding Blogger Template - 3

The blogger template is a xhtml document which is rendered based on variables. These tutorials aims at helping to understand the blogger template and hence to experiment, learn and change it. Blogger template has mainly three types of variables one which controls the flow of the code, one which pulls data from the databases behind and the third are expressions. This variables are then distinguished with the help of following xml namespaces.

This is third in the series of the three tutorial for Blogger Template and deals mainly with the explanation of the expr: namespace and understanding its usage. The other tuts are:

1. Blogger Template Explanation - Sections, widgets, includables, includes. b: namespace
   


2. Blogger Template Explanation - Data access. data: namespace elements.
   


3. Blogger Template Explanation - How to use expr: namespace - customize links.
   

Expr namespace is simple but its usage is very important. Expr is basically used in conjuction with data tags. For making the blogger engine aware that the xml tag attributes coming next are having data tags in them and have to be parsed. Whenever there is a tag say anchor tag, you will have attributes like href and in that case you want the href link created dynamically with help of some data say data:post.url then you will have to use href as expr:href.

Simple implementation of expr:href in the title includable.

This includable is the title section of your blog. Check the usage of expr:href with the anchor tag.

<b:includable id='title'>
 <b:if cond='data:blog.url == data:blog.homepageUrl'>
  <data:title/>
  <b:else/>
  <a expr:href='data:blog.homepageUrl'><data:title/></a>
 </b:if>
</b:includable>

See this code below for understanding the implementaion of expr:src and over other such tags. It is being used for parsing the data tags in image img tag attributes.

<a expr:href='data:blog.homepageUrl' style='display: block'>
 <img 
  expr:alt='data:title' 
  expr:height='data:height' 
  expr:id='data:widget.instanceId'
  expr:src='data:sourceUrl' 
  expr:width='data:width' 
  style='display: block'
 />
</a>

As you can see how expr tag is applied to the attributes selectively. Wherever data was to be used expr is applied and in style where data tag is not required the expr is ommitted. Therefore the expr namespace variables are all the attributes which might have some data namespace variable inserted in it. So use expr for data tags used in any attribute values like expr:title, expr:id, expr:onClick and so on. These attributes can be for any xml tag. I have seen it in anchor a, image img, span, div, select, input, button etc., so pretty much everything.

Example Social Bookmark StumbleUpon button for Blogger.

This code listing below explains how to insert stumble upon button for blogger. Although it serves as an example on how to do this but my main focus here is on the usage of quotes. So check how the single and double quotes are used in expr:href for creating and using the url to submit and/or thumbs up the specific post correctly. It generally does not matter that you are using single or double quotes, but when your attribute has to use both of them single quotes decide the attribute opening and closing and double quotes are understood as part of attribute.

Blogger uses single quotes for attribute values, and double quotes within, so change your code as necessary. Within the attribute value, if there are extra single or double quotes as part of the original code, e.g. Javascript, you need to escape them. Also check that the ampersand '&' is converted to '&amp;'. So you might have to create your url in this way. Check more on the stumble upon post url on their site StumbleUpon http://www.stumbleupon.com Widgets and button section.

<a 
 rel="nofollow" 
 target="_blank" 
 expr:href='"http://www.stumbleupon.com/submit?url=" + data:post.url + "&amp;title=" + data:post.title' 
 title="StumbleUpon">
 <img 
  src="../stumbleupon.png" 
  title="StumbleUpon" 
  alt="StumbleUpon" 
  class="sociable-hovers"
 />
</a>

Example Social Bookmark - Add Digg to Blogger

Again although the below code listing is an example of Adding Digg to Blogger template, my focus here is on the escaping done while using javascript. Check how data:post.url is used while inserting it in the javascript variable digg_url. You can use this code to display a counter of diggs done for your post in a neat compact manner on your blog. Check out the digg documentation of this on the http://www.digg.com tools section.

<script type="text/javascript">
 digg_url = &#39;<data:post.url/>&#39;;
 digg_skin = 'compact';
 digg_window = 'new';
</script>
<script src="http://digg.com/tools/diggthis.js" type="text/javascript"></script> 

So as you saw proper escaping of quotes is done above. Although this is not direct example of the expr: tag usage as javascript onclick or anyother such event is not used here. But you got the logic right? But if you didn't check this code listing displaying the button to add comments. This is generally found in the footer section of your post and its obviously customisable :).

<div class='post-footer-line post-footer-line-3'>
 <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'>
      <b:if cond='data:post.numComments == 1'>
       1 <data:top.commentLabel/>
      <b:else/>
       <data:post.numComments/> <data:top.commentLabelPlural/>
      </b:if>
    </a>
   </b:if>
  </b:if>
 </span> 
</div>

The data:post.addCommentOnclick generates appropriate javascript based on your blog setting for example a popup window or comment post page. And data:post.addCommentUrl will generate the url pointing to the comments for the post.

This comes to the end of the three tutorials which I was intending to write on the blogger template. But If you want anything else to be added in this tutorial series let me know and I will do it.

If you have done anything interesting with the blogger template create a back-link to it in this tutorial. Please share you comments about the things discussed and add information that you feel will benefit others. Thanks for reading.

Cara Memasang Chat Box

ChatBox atau Shoutbox..satu ruang untuk berkomunikasi diantara tuan blog dengan pengunjungnya. Ada macam² jenis chatbox yang biasa digunakan oleh blogger, antaranya Cbox, ShoutMix, Oggix, Tag-World, GoogleTalk dan lain².

Ok harini Ana nak buat tutorial khas untuk Cbox. Sebab Ana sendiri pun guna cbox, dan juga untuk yang bertanya. Ok caranya..

1. Masuk ke laman ini. Klik Cbox ni.


2. Klik pada Get your own free Cbox now! atau sign up di atas untuk daftar akaun.

3. Isikan maklumat di ruangan ini.. dan klik Create my Cbox jika selesai. Gambar dibawah akan muncul jika Antum sudah berjaya daftar.

4. Seterusnya Daftar masuk kedalam akaun menggunakan username dan pasword yang Antum create tadi.. Kalau boleh pasword ni sentiasa diingati.


5. Untuk mendapatkan kodnya klik pada publish!. Jika mahu menukar warna cbox ini klik pada Look & Feel => Edit Style.

6. Copy kod yang diberikan dan paste kedalam blog. Pergi ke bahagian Layout => Page Elements => Add a Gadget => HTML/Javascript.

Ok siap...!

p/s: Kalau nak edit color Cbox ini setelah ditambah di blog, cukup sekadar menekan butang save dan refresh blog Antum tanpa memasukkan kod yang baru.

Membuat Read More di Template Classic

Template Classic pun boleh buat readmore rupanya.. Manala Ana tau kan, xpernah guna pun tempalte classic ni. Terjun je dalam dunia blogging ni terus guna yang baru kan. Tutorial ni hanya untuk simpanan peribadi. Kalau ade kengkawan yang masih still classic bolehla dijadikan panduan. Ok ini cara...

1) Loggin => Template.

2) Masukkan code CSS atau style sheet Summary post (Yg berwarna merah) tu di antara <style type="text/css"> dan </style>

Contoh:

Name: Ms. Moto (Pinky Lee variation)
Designer: Jeffrey Zeldman
URL: www.zeldman.com
Date: 23 Feb 2004
----------------------------------------------- */


/* Primary layout */

<MainOrArchivePage>
span.fullpost {display:none;}
</MainOrArchivePage>

<ItemPage>
span.fullpost {display:inline;}
</ItemPage>

body {
margin: 0;
padding: 0;
border: 0;
text-align: center;
color: #555;
background: #d7b url(http://www.blogblog.com/moto_ms/outerwrap.gif) top center repeat-y;
font: small tahoma, "Bitstream Vera Sans", "Trebuchet MS", "Lucida Grande", lucida, helvetica, sans-serif;
}

3) Kemudian untuk meletakkan pautan Read More.. Cari code Blog Item Body dan letakkan code pautan tersebut di bawahnya.

<$BlogItemBody$>

<MainOrArchivePage><br />
<a href="<$BlogItemPermalinkURL$>">Read more!</a>
</MainOrArchivePage>

4) Lepas tu Save Template.

5) Kemudian seperti biasalah letakkan code Span Full Post di setiap entri Antum atau bila nak Create post yg baru iaitu:

<span class="fullpost"></span>

Contoh:

Ini adalah ringkasan ceritaku blabla pokpek!
<span class="fullpost">
Dan ini adalah selebihnya dari ringkasan tersebut
</span>

6) Kalau nak buat read more setiap kali posting, Antum boleh letakkan kode ini di bahagian Settings=> Formatting=>Post Template.

summary here
<span class="fullpost">
Type rest of the post here
</span>

Sumber : Muncet.com

Memasang Emoticon Di Post Entry

Emoticon Yahoo! Messenger..Sebenarnya dah ramai yang buat tutorial ni.. Ana tulis balik untuk simpanan peribadi..Kalau nak emoticon lain Antum boleh ke Chokilala.com. Disana ada macam² emoticon yang comel dan menarik. Chokilala memang pandai buat emoticon. Ok untuk yang ini, caranya begini..

Tutorial ini memerlukan kepada langkah berikut:-

1. Menggunakan Web Browser Firefox, mesti guna Firefox, yang lain tak boleh.. nak pulak IE yang kurang best tu. Maka bertukarla ke Firefox. Download Sini. Pastikan sudah menggunakan Firefox untuk step seterusnya.

2. Memasang Add-ons Greasemonkey. Kalau belum Install Disini. Senang aje. Ikut arahannya. Bila selesai, akan muncul icon kepala monyet yang berjambul dibawah.

3. Seterusnya install script emoticon Yahoo! Messenger dengan mengetik Script Ini. Bila keluar satu kotak, klik pada Install.

Ok selesai.. Emoticon sudah wujud di post editor Antum. Selamat beremosi dalam menulis.

Tambahan: Kalau gambar di posting Antum telah diborderkan, maka setiap emoticon yang ditampilkan akan berserta dengan border. Untuk hilangkan border tersebut, tambahkan kode ini sebelum ]]></b:skin>

img.emoticon {
border: 0;
}