I N F I N I T E: denim

Assalamualaikum :)

Kepada yang mengrequest tuto nie, sorry yea lambat. Pergi cari code untuk tuto nie balik sebab dah tukar template and tuto nie arrien ada guna untuk template arrien yang sebelum nie. Jadi terpaksa pergi godek-godek folder backup balik. HUHU.. Border sidebar bergambar tu adalah macam nie;

1) Dashboard > Template > Edit HTML.

2) Tekan ctrl+f serentak dan cari code nie;

.sidebar h2 {

3) Copy code nie dan pastekan bawah code yang dicari;

background:url(URL ATAS)no-repeat top;font-size:22px;

4) Buat cara sama no.2 dan cari code nie pulak;

.sidebar {

5) Copy and paste code bawah nie dibawah code yang anda cari tadi;

background:url(URL TENGAH)repeat-y;color: #333333;

6) Cara sama juga seperti di no.2 dan cari code ;

.sidebar .widget {

7) Copy code dan paste bawahnya;

background:url(URL BAWAH)no-repeat bottom;margin:0px 0px;

8) Preview & save.!

Note :
Yang arrien kata Atas, tengah, bawah tu ialah gambar untuk border tu. Jadi korang kena design sendiri dulu border tu using Photoshop oke.
Contoh untuk border tu ialah macam nie;

Atas

Tengah

Bawah

Jadi korang kena design satu-satu. Dia punya lebah mesti ikut lebah sidebar korang. Contoh kalau sidebar width korang : 225px, maka dekat Photoshop tu pun korang kena bubuh width dye 225px. Lepas dah siap design, save dan bila nak letakkan dekat blog kena guna URL, jadi nak dapatkan URL gambar tu.. uploadkan gambar tu di [SINI]. Dan apabila dah upload, ambil dye punya Direct Link.

Oke done, Kalau tak faham, sila tanya di fanpage or ask.fm arrien yea. But kalau tanya dekat ask.fm, make sure tinggalkan link blog korang kalau korang tak sign in ask.fm ^_-

P/s: Jangan ambil yea contoh gambar border yang arrien tunjuk dekat atas tu. 100% hak milik arrien :)

4 Comments

Assalamualaikum :)

Nampak tak post title arrien, first letter dye berbeza dari ayat yang lain kan? so arrien nak tunjukkan dekat korang cara nak jadikan first letter at post tittle berwarna. :D But,peringatan.. tutorial ini hanya untuk denim template coz arrien hanya try dekat denim template, so bagi simple or template yang lain, cuba-cuba lah yea. Try and error oke? hee :D

[Click untuk preview]

1. Dashboard > Template > Edit HTML.

2. Tekan Ctrl+f serentak dan cari code bawah nie;

/* Posts
----------------------------------------------- */

3. Copy code bawah nie;

.post-title:first-letter {
color: #000;
font-size: 20px;
font-family: 'Short Stack', cursive;
padding: 1px;
text-shadow: 1px 0px 1px #fff;
}

4. Then paste dekat bawah code yang korang cari di no.2 tadi.
5. Preview and save! done :)

Note:
Merah : Tukarkan dengan color code yang anda suka.

No Comments

Assalamualaikum :)

Dah 7 hari arrien private blog. Ada yang perasan tak? haha entah-entah takde pun orang yang terniat nak datang jeguk. perasan je lebih arrien nie kan? haha see anything diffrent? yeah,i'm changed my blog's skin. Tu yang tajuk macam atas tu.. Mencari ilham untuk ubah blog. But lepas 7 hari baru lah nampak hasilnya. Mana taknya.. jenuh perah otak nak buat macam mana skin baru nie. Godek sana, tak kena..godek sini, tak kena. But alhamdulillah.. siap jugak. :D

Cantik tak?? haha (sila muntah darah) Kesempitan idea betul. Tak tahu kenapa bekenan betul dengan warna-warna kelabu nie. Haha sorry lah yea kalau ada yang tidak suka. Lain orang lain taste dia kan? haha but this is my style. kekeke. Tapi memang satu yang arrien risaukan, kemahiran arrien dalam bermain code macam dah kurang je(??) wah.. memang kena practise selalu balik nie. Kalau tak memang tinggal kenangan je la jawabnya. huhu.

Anyway, hope u enjoy my blog and Salam Jumaat ^_- LOL

2 Comments

Assalamualaikum :)

Ada request mintak arrien tolong buat tuto untuk post title yang macam pengguna blogskin punya. Actually arrien tak pernah buat pun code tu untuk denim template, but ada yang mengrequestnya so arrien try and menjadi :D Jadi, tuto nie 100% code arrien and Credit juga kepada kak Nabila untuk tuto cara letak comment dekat bawah post title :)

| Live Preview |

No Re-post & Re-Tuto

1. Dashboard > Template > Edit HTML.
2. Use Ctrl+F dan cari code nie .post-title {
3. Kemudian bila dah jumpa code tu, bawah dia ada code post title korang kan?. So padam bawah post title tu sahaja and gantikan dengan code ini;

background : #676767;
margin-bottom: -1px;
border-radius: 3px;
padding: 2px;
font: 25px bebas neue ;
text-align:center;
border:1px solid #676767;
color:#ffffff;
margin-top:2px;
letter-spacing:0px;
}
@font-face { font-family: "bebas neue"; src: url('http://static.tumblr.com/cvlbtjz/cnsln9tpp/bebasneue.otf'); }

4. Next cari code ini pulak, <div class='post-header-line-1'/>
5. Copy code ini,

<div style='margin-top:0px; background:#fff; border:1px solid #000; font-size: 11px; padding:2px; padding-left:20px; letter-spacing:1px; text-transform:block;'>
<font style='background:transparent url(http://i1217.photobucket.com/albums/dd386/moonstonedaydreams/Silver%20Icons/clock.gif) no-repeat scroll left;padding-left:20px;font-size:11px;'>Masa : <data:post.timestamp/></font> |
<font style='background:transparent url(http://i1217.photobucket.com/albums/dd386/moonstonedaydreams/Silver%20Icons/comment.gif) no-repeat scroll left;padding-left:20px;font-size:11px;'>Comments : <b:if cond='data:post.allowComments'>
<a class='comment-bubble' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/><span style='font-size:11px'> </span></a>
</b:if></font>
</div>

6. Pastekan di ATAS code yang arrien suruh cari di no.4 tadi.
7. Preview and save.

Note:
Merah : Url Icon

3 Comments

Assalamualaikum :)

Tuto nie arrien pernah buat but ada someone minta arrien buat tuto untuk post footer yang sebijik macam arrien. So here arrien share codenye oke :D

*Just for simple/Denim & Washed Denim template yea :)

1. Dashboard > Template > Edit HTML.
2. Ctrl+F serentak dan cari code .post-footer {
3. Then copy code nie:

text-align:center;
padding:8px;
color: #333333;
font-size: 95%;
background: url(URL BACKGROUND);
border-left: 1px solid #eee;
border-right: 1px solid #eee;
moz-box-shadow: 0 0 1px 1px #eee;
-webkit-box-shadow: 0 0 1px 1px #eee;
border-radius:0px;
margin:6px;
}