වැදගත් වාක්‍යකට Shadow Box Effect එක දාමු

දැන් මම කියලා දෙන්න යන්නේ ඔයාලට ඔයාලගේ Blog එක බලන කට්ටියට වැදගත් පණිවුඩයක් එහෙම දෙන්න තියනවනම්, ඒක ලස්සන Shadow Box එකක් ඇතුලේ සදහන් කරන්න පුළුවන් ක්‍රමයක් ගැනයි. නිකන් පණිවිඩය සදහන් කරනවට වැඩියෙන් මේ වගේ දෙයක් කරපුවාම බලන කෙනාගේ ඇසටත් ප්‍රියයි. අනික ඔයාලගේ Blog එකත් ලස්සන වෙනවා.

මම ඔය පහලින් දාලා තියෙන්නේ එහෙම කරලා තියෙන Shadow Box එකක්. මේ Shadow Box එක විදි 2 කට දාන්න පුළුවන්. එකක්  තමයි Shadow එක ඇතුලට එන විදිහටත් Shadow එක පිටතට එන විදිහටත්. මේකෙන් ඔයාලට ලස්සන විදිහකට දාගන්න පුළුවන්.

හරි අපි දැන් මේක කරන්නේ කොහොමද කියලා බලමු.

1.  මුලින්ම ඔයාලා Blogger Account එකට Log වෙලා Template එකට යන්න.

2.  ඊට පස්සේ කෝකටත් template එක download කරගෙන  ඉන්න. හදිස්සියේ හරි වැරදුනොත් ආයෙත් upload කරගන්න පුළුවන්නේ.

3.  මීලගට Ctrl+F ගහලා පහල තියන code එක template එකේ කොහෙද තියෙන්නේ කියලා හොයාගන්න ඕනේ.

]]></b:skin>

4.  දැන් මම පහල දාලා තියන script  එක අර හොයා ගත්ත code එකට උඩින් paste කරන්න. ඒ කියන්නේ,

Script එක

]]></b:skin>

යන ආකාරයටයි. මේ පහල තියෙන්නේ ඒ script එක. shadow එක පිට පැත්තටත්, ඇතුල් පැත්තටත් එන විදිහට script 2 ක් තියනවා.

Shadow එක පිට පැත්තට එන Script එක.

#Shadow-Outside{
-moz-box-shadow: 0 0 5px 5px #222;
-webkit-box-shadow: 0 0 5px 5px #222;
box-shadow: 0 0 5px 5px #222;
}

Shadow එක ඇතුල් පැත්තට එන Script එක.

#Shadow-inside {
-moz-box-shadow: inset 0 0 5px 5px #222;
-webkit-box-shadow: inset 0 0 5px 5px #222;
box-shadow: inset 0 0 5px 5px #222;
}

5.  ඊට පස්සේ template එක Save කරගන්න.

6.  හරි දැන් ඔයාලා මොකක් හරි වැදගත් දෙයක් ලියනවනම්, පහල තියෙන code එක අතරේ ඒක ලියන්න. ඒක බැලුවාම ඔයාලට පැහැදිලිවෙයි කොහොමද කරන්න ඕනේ කියලා.

පිටතට Shadow එක එන්නනම් මේ Code එක දාන්න.

<div id="Shadow-Outside">
ඔයා ලියන වැදගත් දේ
</div>

ඇතුලට Shadow එක එන්නනම් මේ Code එක දාන්න.

<div id="Shadow-inside">
ඔයා ලියන වැදගත් දේ
</div>

"ඔයා ලියන වැදගත් දේ" කියලා තියන තැනට තමයි ඔයාලා ලියන දේ ඇතුලත් කරන්න ඕනේ.

මොකක් හරි ප්‍රශ්නයක් වුනොත් Comment එකක් දාලා කියන්න. මම උදව් කරන්නම්. සියළු දෙනාටම සුභ දවසක්!

Saagaraya Blogger, Blogger Sinhala Tutorial, බ්ලොග් ට්‍රික්ස්, Blogger ගැන සිංහලෙන්, Blogger Tutorial සිංහලෙන්, බ්ලොග් ටිප්ස්, සිංහලෙන් ඉගෙන ගමු, බ්ලොගර් උදවු,