Perubahan Bentuk widget Follower

Dapet kabar dari blogger buzz serta mas ade sanusi katanya widget follower berubah tampilan menjadi sekaligus widget google friend connect, ternyata setelah saya buktikan benar apa katanya. widget follower yang memberikan fasilitas subscribe pada dashboard blogger yang mengikuti dan sekarang ada tambahan "google friend connect" pada widget tersebut.

Dengan perubahan tampilan dan tambahan fitur ini semoga para blogger lebih suka dan menikmati fasilitas yang baru dan keunggulannya. Untuk blogger maju terus memberikan tren gaya hidup digital.

Read More

PDF E-book Search Engine

Untuk para penggemar "Electronic Book" atau yang sering disingkat E-book berbentuk PDF (Portable document format) yang bisa dibaca dengan PDF reader misalnya Adobe Reader atau software sejenis, untuk mencari E-book sudah tersedia search engine yang melayani kita untuk mencari E-book dengan format PDF.
pdf-search-engine memberikan fasilitas PDF search engine dari berbagai situs yang menyediakan PDF dengan gratis.

Jadi tak usah pusing jika kita mau mencari e-book secara online tinggal cari di pdf-search-engine dengan cara masukkan kata kunci buku yang dicari kemudian klik tombol "search books" nah maka akan muncul e-book berformat PDF sesuai dengan kata kunci Anda.
Jika mau mencoba mencari PDF silahkan kunjungi disini.

Read More

Widget Penerjemah Dari Google

Widget penerjemah bahasa dari google ini sudah banyak digunakan dikalangan blogger dan webmaster, apabila ada pengunjung dari manca negara yang tidak bisa mengartikan bahasa indonesia kedalam bahasa yang diinginkan maka widget google translate bisa membantu menerjemahkan situs kita, tapi jika kita menggunakan bahasa yang tidak baku google translate akan kesulitan menerjemahkanya, jadi diharapkan menggunakan bahasa baku jika ingin sempurna diterjemahkan oleh google translate ini.

dibawah ini adalah bentuk widget tool dari google translate :



Udah dicoba belum? kalau sudah jika mau pasang widget ini silahkan baca dibawah ini.

Copy paste code dibawah ini kedalam blog Anda dengan cara :

1. Masuk menu Layout kemudian masuk menu Page Elements
2. Pilih box layout yang diinginkan kemudian klik Add a gadgets
3. Pilih Gadget HTML/JavaScript dan taruh code dibawah ini :

<script src="http://www.gmodules.com/ig/ifr?url=http://www.google.com/ig/modules/translatemypage.xml&up_source_language=id&w=160&h=60&title=&border=&output=js"></script>

Code yang berwarna merah diatas adalah ukuran dari widget yang bisa kamu ubah-ubah. Kalau sudah kemudian SAVE.

Nah sedikit info dari saya dan jika Anda mau menggunakan layanan dari google translate yang lain kunjungi : http://translate.google.com

Read More

Membuat Menu Tab View

Menu tabview adalah menu yang berbentuk tabel dengan pengelompokan halaman sesuai dengan tabel menu diatasnya. Menu ini banyak diapakai untuk menghemat tempat pada blog dengan sistem menampilkan atau menutupi halaman tabel sesuai dengan tabel menu diatasnya. Jadi jika kita mengklik menu diatasnya maka halaman tabel yang muncul adalah halaman tabel yang dibuat sesuai dengan menu tabel diatasnya, dan jika kita mengklik menu tabel lain maka yang muncul adalah halaman tabel yang bersesuain namun tetap pada satu tempat itu.

Coba perhatikan dibawah ini :


Gimana sudah paham belum? mau cara buatnya?

Oke kita pakai teori dari Mas Kendhin saja karena mudah dipahami.

Pertama yang harus kamu lakukan adalah Log In dan masuk menu Layout kemudian masuk bagian Edit HTML

Selanjutnya taruh code CSS dibawah ini diatas code ]]></b:skin>

div.TabView div.Tabs
{
height: 24px;
overflow: hidden;
}
div.TabView div.Tabs a
{
float: left;
display: block;
width: 90px; /* Lebar Menu Utama Atas */ text-align: center;
height: 24px; /* Tinggi Menu Utama Atas */
padding-top: 3px;
vertical-align: middle;
border: 1px solid #000; /* Warna border Menu Atas */
border-bottom-width: 0;
text-decoration: none;
font-family: "Times New Roman", Serif; /* Font Menu Utama Atas */
font-weight: 900;
color: #000; /* Warna Font Menu Utama Atas */
}
div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active
{
background-color: #FF9900; /* Warna background Menu Utama Atas */
}
div.TabView div.Pages
{
clear: both;
border: 1px solid #6E6E6E; /* Warna border Kotak Utama */
overflow: hidden;
background-color: #FF9900; /* Warna background Kotak Utama */
}
div.TabView div.Pages div.Page
{
height: 100%;
padding: 0px;
overflow: hidden;
}
div.TabView div.Pages div.Page div.Pad
{
padding: 3px 5px;
}

Perhatikan text yang berwarna merah itu keterangan dari menu tab view yang bisa kamu edit sesuai keinginan kamu, untuk code warna bisa dilihat disini.

kalau sudah pasang script dibawah ini diatas code </head>

<script src='http://sites.google.com/site/anasku2000/tabview.js' type='text/javascript'/>

kalu sudah silahkan "Save Template" Anda.

kemudian masuk bagian "Layout -> Page Elements, lalu cari tempat gadgetnya kemudian klik Add new gadget kemudian pilih HTML/JavaScript dan taruh Code dibawah ini :

<form action="tabview.html" method="get">
<div class="TabView" id="TabView">
<div class="Tabs" style="width: 350px;">
<a>Tab 1</a>
<a>Tab 2</a>
<a>Tab 3</a>
</div>
<div class="Pages" style="width: 350px; height: 250px;">

<div class="Page">
<div class="Pad">
Tab 1.1 <br />
Tab 1.2 <br />
Tab 1.3 <br />
</div>
</div>

<div class="Page">
<div class="Pad">
Tab 2.1 <br />
Tab 2.2 <br />
Tab 2.3 <br />
</div>
</div>

<div class="Page">
<div class="Pad">
Tab 3.1 <br />
Tab 3.2 <br />
Tab 3.3 <br />
</div>
</div>

</div>
</div>
</form>

<script type="text/javascript">
tabview_initialize('TabView');
</script>

Keterangan :

1. Code yang berwarna biru diatas adalah lebar dan tinggi tabview yang bisa kamu sesuaikan.
2. Code yang berwarna hijau adalah text judul dari menu tabel (tab 1, tab 2, tab 3 ....)
3. Code yang berwarna merah diatas adalah halaman dari tabel yang bisa kamu pasangi code-code gagdet, gambar atau link.
4. Dan jika ingin menambah halaman tabel perhatikan code yang berkedip, dan tambah seperti itu dibawahnya.

Kalau sudah tinggal SAVE.

Read More

Become the Star Gazer

So, you are sitting at home and really bored and do not know what to do? You feel like going out and sitting in your garden and staring at the stars, but its too cold outside and cant do that too?? Here is a way you can do that just by sitting at home. No, I am not asking you to break open your roof, all you need is the Star Laser. The Star Laser is an electronic device that projects green laser stars along with blue cloud formations to give you the feeling that you're floating in space.

The Star Laser Projector can be adjusted to fill up your ceiling, walls, floor, or even the side of your house with a soothing star field created by green lasers and holographic optics. Here are a few things that the Star Laser contains:

• 2 built-in glass lenses


• Thousands of green lasers


• Multiphase diffractive holographic optics

Read More

CSS Background

Masih membahas tentang CSS (Cascading Style Sheets) background yang memungkinkan Anda dapat mengatur posisi background, warna elemen background, pengulangan background dan yang lainya. Saya akan membahas CSS yang digunakan dalam pengaturan background secara singkat dan jelas, semoga bisa sedikit membantu Anda dalam mengontrol background dari elemen.

Ada beberapa macam property background yang memungkinkan Anda dapat mengontrol background dari elemen.

1. background-color

Memungkinkan Anda memberikan warna pada background

Property	Keterangan
transparent	Mengosongkan warna background atau membuat elemen menjadi transparan dengan elemen dibawahnya.
#FF3366	Memberi warna pada background, code #FF3366 adalah code warna hex dari warna merah, Anda bisa mengubah dengan code warna rgb atau nama warna misalnya: red (merah), black (hitam), dan sebagainya.

Contoh :
#kotak
{
background-color:#FF3366;
}

Menjadi

ELEMEN KOTAK

2. background-image

Memungkinkan Anda menambahkan gambar pada background

Property	Keterangan
url(URL_GAMBAR)	memberi gambar pada background elemen, code URL_GAMBAR bisa Anda ganti dengan url server gambar Anda.
none	Mengosongkan background gambar pada elemen.

Contoh:

#elemen-gambar
{
background-image:url(http://i725.photobucket.com/albums/ww258/anasceria/plays.jpg)
}

Menjadi :

ELEMEN GAMBAR

3. background-attachment

Memungkinkan Anda mengatur background gambar dengan pergeseran scroll bar

Property	Keterangan
scroll	Memungkinkan elemen background mengikuti penggeseran scroll bar.
fixed	Memungkinkan elemen background tidak mengikuti pergeseran dari scroll bar.

Contoh

#elemen-attachment
{
background-image:url(http://i725.photobucket.com/albums/ww258/anasceria/plays.jpg);
background-attachment:fixed
}

Menjadi

BACKGROUND FIXED

GESER SCROLL

BACKGROUND FIXES

GESER SCROLL

4. background-repeat

Memungkinkan Anda mengatur pengulangan background gambar

Property	Keterangan
repeat	Membuat elemen gambar background menjadi berulang-ulang
no-repeat	tidak ada pengulangan
repeat-y	pengulangan vertikal
repeat-x	pengulangan horizontal

Contoh :

#elemen-ulang
{
background-image:url(http://i725.photobucket.com/albums/ww258/anasceria/plays.jpg);
background-repeat:repeat-y;
}

Menjadi :

PENGULANGAN BACKGROUND SECARA VERTIKAL


PENGULANGAN BACKGROUND SECARA VERTIKAL


PENGULANGAN BACKGROUND SECARA VERTIKAL

PENGULANGAN BACKGROUND SECARA VERTIKAL

5. background-position

Memungkinkan Anda mengatur posisi background gambar Anda.

Property	Keterangan
top left	Penempatan posisi background gambar, top left adalah posisi background berada kiri atas, Anda bisa mengganti posisi menjadi : top center top right center left center center center right bottom left bottom center bottom right
x% y%	mengatur posisi background secara sumbu horizontal dan vertikal, misalnya 5% 30% adalah penempatan gambar horisontal 5% dan vertikal 30%. Atau bisa menggunakan pixel, 20px 30px artinya posisi horizontal berada pada 2o pixel dan vertikal 30 pixel.

Contoh:

#elemen-posisi
{
background-image:url(http://i725.photobucket.com/albums/ww258/anasceria/plays.jpg);
background-position:top left;
background-repeat:no-repeat;
height:200px
}

Menjadi :

ELEMEN BACKGROUND

PENGULANGAN

ATAS KIRI

Dari semua perincian diatas Anda dapat menggunakan satu perincian property background saja. misalnya :

#kotak
{
background:#FFFFFF url(http://i725.photobucket.com/albums/ww258/anasceria/plays.jpg) no-repeat top left fixed
}

Nah sedikit tutorial dari Saya semoga dapat membantu Anda. Sekian semoga bermanfaat.

Read More