wanaseoby.com

Monday, April 25, 2016

Tutorial Classic Template/ Blogskin : Latest Entries Comel

 Assalamalaikum, tutorial ni ada yang request, hanya untuk blogskin je tau!

Macam ni lah rupa dia. 

  1. Cari code </style> kat dalam code blogskin awak, lepas tu paste code ni dekat atas </style> tadi.
    a.latest-entries-button{
    background:#fff;width:270px;
    display:block;
    border-radius:20px;
    border:0px;
    padding:5px;
    margin:0px;
    margin-bottom:3px;
    }
  2. Lepas tu, paste code ni dekat sidebar blogskin awak.
    <center><div style="background:#F2E8D2;  border-radius:20px;padding:10px; width:280; margin-top:10px;border:2px dashed #fff; box-shadow:0px 0px 0px 3px #F2E8D2;">
    <BloggerPreviousItems>
    <a class="latest-entries-button" href="<$BlogItemPermalinkURL$>">
    <$BlogPreviousItemTitle$>
    </a>
    </BloggerPreviousItems>
    </div>
    </center>
  3. Preview, save and done! :) 

Thanks to css-tricks , learned the stitched look border :)

Sunday, April 24, 2016

Tutorial Simple Template : Bloglist Style Comel

Assalamualaikum, 

Nak bloglist macam ni? meh meh ikut tutorial ni. 

  1. Mula-mula pergi ke Template --> Edit HTML
  2. Cari code /* Posts
  3. Paste code bawah ni dekat atas code /* Posts tadi.
#BlogList2_blogs li{
background:#DBE9E8;
margin:10px;
margin-bottom:10px;
padding:10px;
padding-left:10px;
border-radius:10px;
border:2px dashed #fff;
box-shadow: 0 0 0 2px #DBE9E8;
}
.blog-icon img{
background:#ffffff;
padding:10px;
margin-right:10px;}
.item-content{
margin-left:30px;
}
.blog-title a{
margin-left:30px;
background:#ffffff;
display:block;
text-align:center;
border-radius:20px;
}

Edit, preview, dan save!