Cara Membuat Spin Sharingan With CSS

Hay Sobat Kali Ini Saya Akan Shere''Cara Membuat Spin Sharingan With CSS"Hay teman Teman kamu Kamu Akan Mempunya Css Spin Keren ini Kalau Di Coba Tapi Kamu Harus Punya Blogger Berbentuk CSS Kamu Kamu  Nanti Pasti Terkejut Kalau Spin Ini Keren Kamu Kamu pasti Ngomong Gini Nih Wizz hahahah.....!!!!Ayo Kita Coba Langsung di bawah
1.Buka Blogger
2.Klik Template > Edit HTML > centang Expand Template Widget
( Saya sarankan backup dulu template kamu )

3.Cari code ]]></b:skin> , ( Pake CTRL+F biar lebih cepet )
4.Copy code dibawah ini , dan pastekan tepat di atas code ]]></b:skin>

/* EXSharingan */
.EXsharingan1 { -moz-animation:spin2Pulse 1s infinite linear; -webkit-animation:spin2Pulse 1s infinite linear;margin-top:-60px; margin-left:800px;position:absolute;z-index:999;height: 200px; line-height: 46px;border-radius:500px;border-left:10px solid black;border-right:10px solid black;width: 200px;; -moz-animation:EXspin 1s infinite linear; -webkit-animation:EXspin 1s infinite linear;animation:EXspin 1s infinite linear}
.EXsharingan {margin-top:-60px; margin-left:800px;position:absolute;z-index:999;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbwDecjxwUzBHI7d6hPb-jsMxaLrA8ErreERTE6KGBV6Lu4fPpgmFlcQEUNeHWcOafdi-coNtJzIxxhvuxx6JmjC8huojkb3tI4HjEKkC90I793g3dNgPb1Vkpmj7aMQ8s6oTlmp3bwlxi/s185/supers.png) no-repeat;height: 185px; line-height: 46px;border-left:20px solid black;border-radius:500px;border-right:20px solid black;width: 185px; -moz-animation:EXspin 1s infinite linear; -webkit-animation:EXspin 1s infinite linear;animation:EXspin 1s infinite linear}
@-moz-keyframes EXspin {0%{-moz-transform:rotate(0deg);} 100%{-moz-transform:rotate(-360deg);} }
@-webkit-keyframes EXspin {0%{-webkit-transform:rotate(0deg);} 100%{-webkit-transform:rotate(-360deg);} }
@keyframes EXspin {0%{-moz-transform:rotate(0deg);} 100%{-moz-transform:rotate(-360deg);} }

5.Cari code <div id='header-wrapper'> , lalu copy code di bawah ini dan pastekan tepat di atas
code <div id='header-wrapper'> :
( sebener nya bebas sih taro dimana  . .asalkan tidak error aja , disini saya taro nya di  atas kode <div id='header-wrapper'>)

<div id='EXsharingan1'><div class='EXsharingan'/></div>

6.Save / Simpan Template

Catatan :
-Teks berwarna kuning bisa kamu edit sendiri margin nya jika penempatan kurang tepat
-Teks berwarna biru bisa kamu ganti dengan URL gambar sharingan . .
Tenang sharingannya udah saya siapkan , Berikut Sharingannya :

1.Madara Eternal

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKOAD_zyIyY6vTg4JdNh03sqpecrfcwpAYn_LTCdjbkwgLMiHi_xi0V2RSLuwX0j-VI91gwrzL_k0osRg8tvprOGPDdnU-63U1KtFS1W5Mv6y3dIMjs9gofIBcpqb9lQD4gESZ2rtMysM/s1600/sharingan6.png

2.Pain Rinnegan

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtc1mnw8vTVNe7l1x1IdH6Ngnsft8-Vt_IfDacTGFxODXBBIO6lm2q0OWaIskezKTc8WG8C8U1LBg9pWhHkpkbI-aM2RO53PtQHh_1Ozf9243JGGtBkF30ZfX0nATsNh0-jgYOG2HaAd8/s1600/rinnegan1.png

2.Mangekyou Sharingan Kakashi

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeuhAzzosM-Pii6t576aWYXMIPHcO1oico6OOYqVy2j5T7wu51MIo0jMtXQPJXV9eSUvk3cbeyn5-ZmS5A1qIewLwjWo4nukEPXskGKwQxN5r-A4SATq3yhhmEsZTjbSAThZn5bX7hyphenhyphenyk/s1600/sharingan3.png

3.Mangekyou Sharingan Itachi

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9RuMq-kCdKtthkC47vI1RkjSzvXHBNHR_1R3IC_ZftlbiHKr3hfvj9F5KkYjkQP9WCuohKq6Kg4eODgDdrbVvbdPT09SP9a11MnzeaKwQnTfq11-UBG-4caB67OiACQS4Y54-kIGtY78/s1600/sharingan8.png

 4.Mangekyou Sharingan Sasuke

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2vop6t45mB9GvqbeNgyQW02McAj1qTzvFeS98oPjcuvfXEBIR807qDMBoCAgWyKvGIFj_M0_HYm2d-erHJtS05yYwdspBrbkfE1-krXQRGOIlSRzxpIUutEF3OjbhWHqiBgtefWKFHb0/s1600/sharingan2.png

5.Sharingan Triple Stange ( Sasuke )

 https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiOYh-y53xG2ipKpsghJav_iltBCCatdYaqKdUzwq3ytftXODcO272kN7Za4b2KZOnGO1yi55m03SY0ticlXEjcZYs9qbwkORdI7lGKwPrU8ZxzGwaTYLReqlamhriGo9xkDz1Ob9FgIU/s1600/sharingan7.png

6.Mangekyou Sharingan Uchiha Shusui

 https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhA43vw3D5qF973A1-OLwtZnDa7ygMOkBvhNadsq_6OYDvahsF4fmaP2AOIQgeBJWOxALywKyXuwzVOB2iMIbsWHA-4VbRLHedxcV0Jq3L5bd6IrK94S-hBPkcrsvMRProMPi3wLuiblxk/s1600/sharingan4.png

7.Mangekyousharingan Uchiha Izuna

 https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiW0dQeqQTV3SPgZ6cxucVLG_Y21P1FQE02K58PwZbA6WwXLR3RJMdGyFK1Cgdysiddtm64Gw_yya-zv11vHluBUgCgsHJTIXn04lYUaECVoYjbq31XKsBkhyphenhyphentd7-pLsaECgZL1yV8ZQ28/s1600/sharingan5.png

8.Byakugan Eyes

 https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVYsVIjk93foxgObCeO6YZDN84uymrAM37UpvEinyNbvvm1A3nR3TkpG16bHcm-MYfFum9sZgV3HJ1qz1_V5VSFri70WBzyaTJvOnWA7hHH7XOd9WcZfPlVZTf9Ja2qtlNCx9s0bzGDKM/s1600/byakugan.png

9.Kyuubi Eyes

 https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2RZoFDunFdVLZdkwr6ILJbQYiZbuc6R5AaMQu-2Wx7rO8lz587Fcd8knU8cjcpd2QUcU3glBXoMwOWf0X_eXTGttn5tXbUXvhxvZp_aVFrM-x1pAlbDhAMFLONr-Uttc8ZaKc6IwS38U/s1600/kyuubi.png

Read More →

Sale Template Red Obito V.2

Hay Teman Teman Kali Ini Saya Akan Shere"Sale Template Red Obito V.2"kamu Kamu Bisa Beli template Saya Dengan Murah Gak Mahal Lagi Menghemat gitu loh ,nah kamu kamu kalau udah beli coba dulu template nya nanti bisa kok di download nah sekalian kamu bisa download disini doang

 

 

No Ponsel=0871215251 /Commentar Lalu Ngomong Mau Beli Di GOGLE + Tapi Harus Loggin/Register

Harga=RP.10.000

MURAH KAN

Semoga Bisa Membelinya ya

Read More →

Award 2 Tach Kamaru

Hay Teman Kali Ini Saya Akan Shere"Award 2 Tach Kamaru"Kamu Pernah Di Ajak Award gak Pernah kan nah ini Saya Senang karena Telah Di Beri Penghargaan Saya Telah Berterima Kasih Kepada Dukungan Dan YONDARKNEZZ


Nama Blogger  :Tach Kamaru
Pembuat Blog   :Tach Kamaru
Nama Template:Red Obito V.1
Juara                :10


Semoga Anda Juga Menang Award

Read More →

30 Trik Menarik CSS3

Kode HTML

Masukan kode html ini di elemen halaman sobat,tapi ganti class name pada kode html di bawah ini

<div class="ganti dengan nama css/kotak"></div>


Contoh:
<div class="kotak2"></div>
<div class="lingkaran"></div>

CSS3 Border radius

kotak1

.kotak1 {
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
background:#00C4FD;
width: 200px;
height: 50px;
line-height: 50px;
text-align: center;
}

Kotak2

.kotak2 {
-moz-border-radius-topleft: 15px;
-moz-border-radius-bottomright: 15px;
-webkit-border-top-left-radius: 15px;
-webkit-border-bottom-right-radius: 15px;
background:#00C4FD;
width: 200px;
height: 50px;
line-height: 50px;
text-align: center;
}

Segitiga atas

segitiga bawah

segitigakanan

segitigakiri

.segitigabawah {
border-color:#333333 transparent transparent;
border-style:solid;
border-width:20px 20px 0;
float:left;
height:0;
margin:0 10px;
width:0;
}
.segitigaatas {
border-color:transparent transparent #333333;
border-style:solid;
border-width:0 20px 20px;
float:left;
height:0;
margin:0 10px;
width:0;
}
.segitigakanan {
border-color: transparent transparent transparent #333333;
border-style:solid;
border-width:20px 20px 0;
float:left;
height:0;
margin:0 10px;
width:0;
}
.segitigakiri {
border-color:transparent #333333 transparent transparent;
border-style:solid;
border-width:20px 20px 0;
float:left;
height:0;
margin:0 10px;
width:0;
}

Lingkaran

.lingkaran {
-moz-border-radius: 50px;
-webkit-border-radius: 50px;
border-radius: 50px;
background:#00C4FD;
width: 80px;
height: 80px;
line-height: 70px;
text-align: center;
}

Kotak3

.kotak3 {
-webkit-box-shadow: 1px 1px 20px #781081, -1px -1px 20px #FFFF55;
-moz-box-shadow: 1px 1px 20px #781081,-1px -1px 20px #FFFF55;
box-shadow: 1px 1px 20px #781081, -1px -1px 20px #FFFF55;
background:#00C4FD;
width: 200px;
height: 50px;
line-height: 50px;
text-align: center;}

Kotak4

.kotak4 {
background:-moz-linear-gradient(-90deg, #00C4FD, #FFFF55) repeat scroll 0 0 transparent;
background:-webkit-gradient(linear, left top, left bottom, from(#00C4FD), to(#FFFF55));
width: 200px;
height: 50px;
line-height: 50px;
text-align: center;}

CSS3 Gradient

Kotak5

.kotak5 {
background: -webkit-gradient(
radial, 500 25%, 20, 500 25%, 40, from(blue), to(#eee)
) yellow;
background: -moz-radial-gradient(
500px 25%, 20px, 500px 25%, 40px, from(blue), to(#eee)
) yellow no-repeat;
width: 500px;
height: 200px;
line-height: 50px;
text-align: center;}

Kotak6

.kotak6 {
background: -webkit-gradient(
radial, 480 25%, 20, 500 25%, 40, from(blue), to(#eee)
) yellow;
background: -moz-radial-gradient(
480px 25%, 20px, 500px 25%, 40px, from(blue), to(#eee)
) yellow no-repeat;
width: 500px;
height: 200px;
line-height: 50px;
text-align: center;}

Kotak7

.kotak7 {
background: -webkit-gradient(
radial, 450 25%, 40, 500 25%, 20, from(blue), to(#eee)
) yellow;
background: -moz-radial-gradient(
450px 25%, 40px, 500px 25%, 20px, from(blue), to(#eee)
) yellow no-repeat;
width: 500px;
height: 200px;
line-height: 50px;
text-align: center;}

Kotak8

.kotak8 {
background: -webkit-gradient(
radial, 500 50%, 10, 500 50%, 80, from(orange), color-stop(0.6, #fff), to(lightblue)
);
background: -moz-radial-gradient(
500px 50%, 10px, 500px 50%, 80px, from(orange), color-stop(0.6, #fff), to(lightblue)
) no-repeat;
width: 500px;
height: 200px;
line-height: 50px;
text-align: center;}

Kotak9

.kotak9 {
background: -webkit-gradient(
radial, 500 50%, 20, 500 50%, 100, from(red), color-stop(0.2, orange), color-stop(0.4, yellow), color-stop(0.6, green), color-stop(0.8, blue), to(#fff)
);
background: -moz-radial-gradient(
500px 50%, 20px, 500px 50%, 100px, from(red), color-stop(0.2, orange), color-stop(0.4, yellow), color-stop(0.6, green), color-stop(0.8, blue), to(#fff)
) no-repeat;
width: 500px;
height: 200px;
line-height: 50px;
text-align: center;}

Kotak10

.kotak10 {
background: -moz-linear-gradient(top, #e4f5fc 0%, #bfe8f9 50%, #9fd8ef 51%, #2ab0ed 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e4f5fc), color-stop(50%,#bfe8f9), color-stop(51%,#9fd8ef), color-stop(100%,#2ab0ed));
width: 500px;
height: 200px;
line-height: 50px;
text-align: center;}

Kotak10

.kotak11 {
background: -moz-linear-gradient(top, #f3e2c7 0%, #c19e67 50%, #b68d4c 51%, #e9d4b3 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f3e2c7), color-stop(50%,#c19e67), color-stop(51%,#b68d4c), color-stop(100%,#e9d4b3));
width: 500px;
height: 200px;
line-height: 50px;
text-align: center;}

CSS3 Animation

horizontal

.kotak1animasi {
border-radius: 8px;
background:#00C4FD;
width: 200px;
height: 50px;
line-height: 50px;
text-align: center;
-webkit-transition: all 0.6s ease-in-out;
}
.kotak1animasi:hover {-moz-transform:translate(4em, 0pt);
-webkit-transform:translate(4em, 0pt);}

berputar

.kotak2animasi {
border-radius: 8px;
background:#00C4FD;
width: 200px;
height: 50px;
line-height: 50px;
text-align: center;
-webkit-transition: all 0.6s ease-in-out;
}
.kotak2animasi:hover {
-moz-transform:rotate(30deg);
-webkit-transform:rotate(30deg);}

horizontal+vertikal

.kotak3animasi {
border-radius: 8px;
background:#00C4FD;
width: 200px;
height: 50px;
line-height: 50px;
text-align: center;
-webkit-transition: all 0.6s ease-in-out;
}
.kotak3animasi:hover {
-moz-transform:translate(-3em, 1em);
-webkit-transform:translate(-3em, 1em);}

Ukuran

.kotak4animasi {
border-radius: 8px;
background:#00C4FD;
width: 200px;
height: 50px;
line-height: 50px;
text-align: center;
-webkit-transition: all 0.6s ease-in-out;
}
.kotak4animasi:hover {
-moz-transform:scale(1.3);
-webkit-transform:scale(1.3);}

border

.kotak5animasi {
background:#00C4FD;
width: 200px;
height: 50px;
line-height: 50px;
text-align: center;
-webkit-transition: all 0.6s ease-in-out;
}
.kotak5animasi:hover {
-moz-border-radius-topleft: 20px;
-moz-border-radius-bottomright: 20px;
-webkit-border-top-left-radius: 20px;
-webkit-border-bottom-right-radius: 20px;}

Lingkaran

.kotak6animasi {
background:#00C4FD;
width: 100px;
height: 100px;
line-height: 50px;
text-align: center;
-webkit-transition: all 0.6s ease-in-out;
}
.kotak6animasi:hover {
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
border-radius: 50px;}

ukuran box

.kotak7animasi {
background:#00C4FD;
width: 100px;
height: 100px;
line-height: 50px;
text-align: center;
-webkit-transition: all 0.6s ease-in-out;
}
.kotak7animasi:hover {
width: 300px;}

Warna

.kotak8animasi {
background:#00C4FD;
width: 100px;
height: 100px;
line-height: 50px;
text-align: center;
-webkit-transition: all 0.6s ease-in-out;
}
.kotak8animasi:hover {
background:#D2506C;}

shadow+background trasparant

.kotak9animasi {
background:#00C4FD;
width: 100px;
height: 100px;
line-height: 50px;
text-align: center;
-webkit-transition: all 0.6s ease-in-out;
}
.kotak9animasi:hover {
-moz-box-shadow:0 0 20px #D2506C;
-webkit-box-shadow:0 0 20px #D2506C;
background-color:rgba(255, 255, 255, 0.8);}

Shadow 2 warna

.kotak10animasi {
background:#00C4FD;
width: 100px;
height: 100px;
line-height: 50px;
text-align: center;
-webkit-transition: all 0.6s ease-in-out;
}
.kotak10animasi:hover {
-webkit-box-shadow: 1px 1px 20px #781081, -1px -1px 20px #FFFF55;
-moz-box-shadow: 1px 1px 20px #781081,-1px -1px 20px #FFFF55;
box-shadow: 1px 1px 20px #781081, -1px -1px 20px #FFFF55;
}

multi animasi

.kotak11animasi {
background:#00C4FD;
width: 100px;
height: 100px;
line-height: 50px;
text-align: center;
-webkit-transition: all 0.6s ease-in-out;
}
.kotak11animasi:hover {
-webkit-animation-name: pulsate;
-webkit-animation-duration: 3s;
-webkit-animation-timing-function: ease-in-out;
}
@-webkit-keyframes pulsate {
0% { width:100px; }
5% { width:150px; left:-25px; }
10% { width:100px; left:0px; }
15% { width:150px; left:-35px; }
20% { width:100px; left:0px; }
40% { width:100px; background-color:#38374A; }
45% { width:150px; left:-25px; background-color:#FFFF55; }
50% { width:100px; left:0px; background-color:#FFFF55; }
55% { width:150px; left:-25px; background-color:#FFFF55; }
60% { width:100px; left:0px; background-color:#3FFFF55; }
80% { width:100px; background-color:#45002D; }
100% { width:100px; background-color:#00C4FD; }
}

Bounce effect

.kotak12animasi {
background:#00C4FD;
width: 100px;
height: 100px;
line-height: 50px;
text-align: center;
-webkit-transition: all 0.6s ease-in-out;
}
.kotak12animasi:hover {
-webkit-animation-name: bounce;
-webkit-animation-duration: 1s;
-webkit-animation-iteration-count: 2;
-webkit-animation-direction: alternate;
}
@-webkit-keyframes bounce {
from {
margin-left: 0px;
}
to {
margin-left: 250px;
}
}

Fade effect

.kotak13animasi {
background:#00C4FD;
width: 100px;
height: 100px;
line-height: 50px;
text-align: center;
-webkit-transition: all 0.6s ease-in-out;
}
.kotak13animasi:hover {
-webkit-animation-name: fade;
-webkit-animation-duration: 3s;
}
@-webkit-keyframes fade {
0% {
opacity: 1.0;
}
50% {
opacity: 0.5;
}
100% {
opacity: 1.0;
}
}

infinity Bounce effect

.kotak14animasi {
background:#00C4FD;
width: 100px;
height: 100px;
line-height: 50px;
text-align: center;
-webkit-transition: all 0.6s ease-in-out;
}
.kotak14animasi:hover {
-webkit-animation-name: scale;
-webkit-animation-duration: 0.5s;
-webkit-animation-iteration-count: infinite;
}
@-webkit-keyframes scale {
from{
-webkit-transform: scale(1);
}
50%{
-webkit-transform: scale(0.85);
animation-timing-function: ease-out;
}
to{
-webkit-transform: scale(1);
animation-timing-function: ease-out;
}
}

rotate

.kotak15animasi {
background:#00C4FD;
width: 100px;
height: 100px;
line-height: 50px;
text-align: center;
-webkit-transition: all 1.0s ease-in-out;
}
.kotak15animasi:hover {
-moz-transform:rotate(360deg);
-webkit-transform:rotate(360deg);
}

Hello

apa kabar n_n

.kotak16animasi {
background: #e3e3e3;
border: 1px dashed #666;
margin: auto;
width: 400px;
height: 200px;
cursor: pointer;
position: relative;
-webkit-transition: all 1s;
-moz-transition: all 1s;
transition: all 1s;
}
.kotak16animasi::after {
content: '';
position: absolute;
width: 70%;
height: 10px;
bottom: 0;
left: 15%;
z-index: -1;
-webkit-box-shadow: 0 9px 20px rgba(0,0,0,.4);
-moz-box-shadow: 0 9px 20px rgba(0,0,0,.4);
box-shadow: 0 9px 20px rgba(0,0,0,.4);
}
.kotak16animasi > div {
position: absolute;
width: 100%; height: 100%;
top: 0; left: 0;
background: #e3e3e3;
-webkit-transition: all .5s ease-in-out;
-moz-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
font: 45px/200px bold helvetica, arial, sans-serif;
text-align: center;
text-shadow: 0 1px 0 white;
}
.kotak16animasi > div:first-child {
position: relative;
z-index: 2;
}
.kotak16animasi:hover {
-webkit-transform: rotateY(180deg);
-moz-transform: rotateY(180deg);
transform: rotateY(180deg);
}
.kotak16animasi:hover > div:first-child {
opacity: 0;
}
.kotak16animasi:hover div:last-child {
-webkit-transform: rotateY(180deg);
-moz-transform: rotateY(180deg);
transform: rotateY(180deg);
}

Khusus untuk trik ini,kode html'a seperti dibawah ini
<div class="kotak16animasi">
<div>
Hello</div>
<div>
apa kabar n_n </div>
</div>

moving

.kotak17animasi {
background:#00C4FD;
width: 100px;
height: 100px;
line-height: 50px;
text-align: center;
-webkit-transition: all 1.0s ease-in-out;
}
.kotak17animasi:hover {
-webkit-transform: translate(540px,-200px);
}

Read More →

Template Red Obito V.1

Hay Sobat Kali Ini Saya Akan Shere"Template Red Obito V.1"Hay Sobat kali Ini Saya Akan Kasih Template Saya Dengan Gratis Tapi jangan DI Copas Kalau Di Copas Blogger Kamu Yang Bagus SEmoga Ke Hapus Sendiri . Maaff .... !!! Nah Kamu Mau Coba Tinggal download Disini

                                                                          Download

MAff Kalau Template Ini Harus Di Instal


Cara Install Template:

1.Klik Extract
2.Tunggu Porses Sampai Beres
3.Folder Template Nya Ada Di  Cari My Documen Lalu Di My Documment Cari Download
4.Nah Beres Deh template Nya bernama template red obito v.1

Read More →

Cara Membuat Posting Blog Menjadi Thumbnail

Hay Sobat Kali Ini saya Akan Shere"Cara Membuat Posting Blog Menjadi Thumbnail"Kamu Kamu Di Blogger Kamu Bisa Pake Ini Posting Nya Keren Kan Langkah Langkah Nya saaja Mudah tingal Itu Saja Satu Pasti Kamu Kamu Pengen Coba Nah Di Sini Kamu Bisa Coba Ayo kita Coba.................!!!!!!!!!!

oke langsung saja kita ke pembahasannya :D

1. Pertama" Masuk ke Blogger Account
2. Pergi ke Template
3. Kemudian Klik Edit HTML Nah
4. Lalu Centang "Expand Template Widget"
5. Sekarang Cari Kode </head> atau memakai pencarian menekan tombol F3 / CTRL + F...
6. Kemudian Pastekan Kode Dibawah ini Di atas kode </head>

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<style>
.post {
background:#fff;
background-image: url();
background-repeat:repeat;
border:4px solid #F6F6F6;
font-size:12px;
margin: 1px;
width:276px;
height:250px;
float:left;
margin-bottom:10px;
}
.post h1 {
text-color:;
font-size: 120%;
font:arial black;
}
h3.date-header {
font-size:10px;
background:#fff;
color:red;
}
</style>
<script type='text/javascript'>var thumbnail_mode = &quot;no-float&quot; ;
summary_noimg = 240;
summary_img = 200;
img_thumb_height = 90;
img_thumb_width = 90;
</script>

<script type='text/javascript'>
//<![CDATA[

function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}

function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}

var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}


//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
var relatedTitles = new Array();
var relatedTitlesNum = 0;
var relatedUrls = new Array();
function related_results_labels(json) {
for (var i = 0; i < json.feed.entry.length; i++) {
var entry = json.feed.entry[i];
relatedTitles[relatedTitlesNum] = entry.title.$t;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
relatedUrls[relatedTitlesNum] = entry.link[k].href;
relatedTitlesNum++;
break;
}
}
}
}
function removeRelatedDuplicates() {
var tmp = new Array(0);
var tmp2 = new Array(0);
for(var i = 0; i < relatedUrls.length; i++) {
if(!contains(tmp, relatedUrls[i])) {
tmp.length += 1;
tmp[tmp.length - 1] = relatedUrls[i];
tmp2.length += 1;
tmp2[tmp2.length - 1] = relatedTitles[i];
}
}
relatedTitles = tmp2;
relatedUrls = tmp;
}
function contains(a, e) {
for(var j = 0; j < a.length; j++) if (a[j]==e) return true;
return false;
}
function printRelatedLabels() {
var r = Math.floor((relatedTitles.length - 1) * Math.random());
var i = 0;
document.write('<ul>');
while (i < relatedTitles.length && i < 20) {
document.write('<li><a href="' + relatedUrls[r] + '">' + relatedTitles[r] + '</a></li>');
if (r < relatedTitles.length - 1) {
r++;
} else {
r = 0;
}
i++;
}
document.write('</ul>');
}
//]]>
</script>
<script type='text/javascript'>
if (window.jstiming) window.jstiming.load.tick('headEnd');
</script>
</b:if>
<script type='text/javascript'>
//<![CDATA[

function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}

function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}

var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}


//]]>
</script>

Pengertian Code Berwarna Merah = yaitu warna latarnya
Pengertian Code berwarna Biru = Width : Lebarnya
Pengertian Code berwarna Hijau = Height : Tingginya

Read More →

Membuat Swirl Keren ( Chain Version )

Cara Memubat Swirl Keren Chain Version

 

Mau tau cara bikinnya, langsung ikuti Admin saja.

• Perlengkapan :

1. Photoshop (Cari Di Google/di Blog ini)

2. Chain Brush (Download)

3. Ketelitian

• Tutorial

1. Buka Photoshop

2. Buat layer baru (Ukurannya bebas, tapi besar ya. Biar leluasa yang edit)

3. Gunakan brush chain, ukuran bebas

4. Buat garis” pakai pen tool (Sama seperti cara yang lama) tetapi kali ini usahakan lengkungannya tidak terlalu runcing, buatlah yang agak tumpul (seperti gambar dibawah)

5. Jika sudah membuat seperti gambar diatas,, kalian tinggal click kanan à Stroke Path.. à Ok (Jangan lupa centang Simulate Priview)

6. Maka akan selesai, jika anda mengikuti tutor, maka akan jadi seperti ini :

Ingin Lihat Tutorial via Video, silahkan Download Videonya di --==SINI==--

Read More →