Border di Post Body

Salam...Jom wat tutorial neh...
Tutor untuk mereka yg nk ade border kat post body/kat kotak entry cam cik permata...

So...jom teruskan dgn tutorial....Ape2hal..korang back up dlu tau template korang...
Takut nnti xjdi..Menanges la plak...uhuhuhuh....
oh yer..For ur in4...Tutorial ini sesuai untuk classic template dan hanya sesetengah template 
designer je yang boleh guna.

1. Sign in Blogspot > Design > Edit Html

2. Cari code di bawah, Ctrl F dan paste dalam kotak find..enter!
/* Posts


3. Di bawah code tadi, korang akan jumpa code seperti ini ( lain template, lain code ) korang 
PADAM code je yang DIMERAHKAN.. Padam sehingga/sebelum code .post blockquote {.
kalau coding korang tak sama macam code .post blockquote { ni, korang padamkan 
sebelum sampai perkataan blockquote sahaja. *asalkan ada perkataan blockquote pun tak apa..


/* Posts

----------------------------------------------- */

.date-header {

  margin: 1.5em 0 0;
  font-weight: normal;
  color: $dateHeaderColor;
  font-size: 100%;
}
.post {
  margin: 0 0 1.5em;
  padding-bottom: 1.5em;
}
.post-title {
  margin: 0;
  padding: 0;
  font-size: 125%;
  font-weight: bold;
  line-height: 1.1em;
}
.post-title a, .post-title a:visited, .post-title strong {
  text-decoration: none;
  color: $textColor;
  font-weight: bold;
}
.post div {
  margin: 0 0 .75em;
  line-height: 1.3em;
}
.post-footer {
  margin: -.25em 0 0;
  color: $textColor;
  font-size: 87%;
}
.post-footer .span {
  margin-$endSide: .3em;
}
.post img, table.tr-caption-container {
  padding: 4px;
  border: 1px solid $borderColor;
}
.tr-caption-container img {
  border: none;
  padding: 0;
}
.post blockquote {
  margin: 1em 20px;
}
.post blockquote p {
  margin: .75em 0;
}
4. Gantikan tulisan yang merah tu dengan code ini, bawah code

/* Posts
----------------------------------------------- */
.date-header {
margin: 1.5em 0 .5em;
text-align: right;
background: white;
color: #000000;
line-height: 1.0em;
font-size: 16px;
font-family: verdana;
}
.post {
margin: .4em 0 2.5em;
padding-bottom: 1.5em;
border: solid #000000 3px;
background: #ffffff;
}
.post-title {
margin-bottom: 1px;
margin-top: 4px;
font-size: 18px;
font-weight: 500;
font-family: times new roman;
line-height: 1.3em;
text-align: left;
color: #000000;
background :#FC5DB4;
padding: 0 3px 3px;
}
.post-body {
margin: 0 0 .75em;
line-height: 1.6em;
padding-left: 5px;
padding-right: 4px;
}
.post-title a, .post-title a:visited, .post-title strong {
text-decoration: none;
color: #000000;
font-weight: bold;
}
.post-footer {
margin: -.25em 0 0;
color: #000000;
background :#FC5DB4;
font-size: 100%;
}

kedudukan tulisan - right, left, center
jenis font - ikut suka koranglah.
font-size - saiz font
#FC5DB4 - warna background post title dan footer, cari SINI
#000000 - warna tulisan  SINI
#ffffff - warna body entry background. SINI
border: solid #000000 3px; - solid boleh tukar kepada dotted, dashed, double. 3px - lebar,
#000000 warna border.

6. Kalau korang bosan dengan bentuk yg sedia ada,juz Klik laju2 kat BORDER..and letak kat 
BAWAH code
border: solid #000000 3px;
7. Preview, kalau menjadi sila SAVE je.Ok??Selamat mcube!!!

p/s: TQ to Cik Farah untuk tutorial yg sgt menarik neh....

Tip Penjagaan RAmbut???Jom BACE!!!

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

0 Doakan Cik Permata:

LinkWithin

Related Posts Plugin for WordPress, Blogger...