ඔන්න හා හා පුරා කියල අච්චාරුවෙනුත් blog widget එකක් දාගන්න හැටි කියල දෙන්නයි යන්නේ..ඉස්සල්ලාම ගේන widget ඒක නිසා,පහසුවෙන් දාගන්න පුලුවන් එකක් කියල දෙන්න හිතුනා.මේ ලිපියට ලැබෙන ප්රතිචාර මත,ඉදිරියටත් මේවගේ widget අරගෙන එන්න බලාපොරොත්තු වෙනවා.මේකෙන් වෙන්නෙ අපි ලියන සෑම blog post එකක් යටින්ම ලස්සන image එකක් add වෙන එක.. මුලින්ම
demo එක බලල ඉන්න.
හරි දැන් පහත පියවරවල් අනුගමනය කරන්න..
පියවර 1
මුලින්ම ඔයාලගේ අඩවියට ගිහින් Dashboard >> Layout >> Edit html වෙත යන්න.කැමතිනම් Download full template කියන එකෙන් template එක save කරගන්න.ඊට පස්සෙ Expand Widget Templates කියන තැනට හරියක් දාලා පහත දිලතියන code එක හොයාගන්න.
.post
පියවර 2
ඒ code එකට පිටි පස්සෙන් මේ විදිහට ඇති.
.post {
margin: 0 0 40px 0;
width: 90%
දැන් කරන්න තියෙන්නේ මම දැන් පහලින් දෙන code එක, ඉහත code එකට පහලින් paste කරන එක.
background: url(
your-Image-Url);
background-repeat: no-repeat;
background-position: bottom center;
margin:.5em 0 1.5em;
padding-bottom:2.5em;
}
පියවර 3
දැන් හරියට කරානම් ඔයාලගේ සම්පුර්ණ code එක තියෙන්න ඔන මේ විදිහට
.post{
margin: 0 0 40px 0;
width: 90%;
background: url(
your-Image-Url);
background-repeat: no-repeat;
background-position: bottom center;
margin:.5em 0 1.5em;
padding-bottom:2.5em;
}
දැන් ඔය
රතුපාටින් තියන 'your image url' කියන තැනට ඔයාලා කැමති image එකේ url එක දෙන්න.
වැදගත්...
දාගත්ත image එක තව ටිකක් පහලට කර ගන්න ඔන නම්,මේ code එක හොයාගන්න...
padding-bottom:2.5em;
දැන් ඒකේ 2.5 කියන එක වෙනුවට 3.5 හෝ 4.5 වගේ අගයක් දෙන්න..
දැන් ඔයාලගේ template එක save කරල බලන්න ඔයාල දාපු image එක blog post වලට යටින් add වෙලා ඇති.
කැමතිනම් මම පහල දෙන image වල urlවලින් එකක්,your-Image-Url කියන තැනට දෙන්න..
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXjtSikAkCaQBLXrKEHNZeJqhFDwCxaMF-JQnsvUdkm7v5VhUlhrVrb6EdVPxZP1nVq6T0Pk2_Bug2Pou2EvedZfH0iC_V4EGib64YA0NhyynxzNKMDn6h8YUUsvTg68H0LksHmga-ldcu/s1600/barsnake.gifhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZNnMq7zEiNi46c2Rqr_DUP_yvD65a_L-VH5FMHyU9-bJ4x6QhbBGCYl7-5aFLmgNkk7GKoYmiFDcnrVLm1nAhIyAFxDouj0pKzEEkLGqeFA-0MzIKrXPAtV69BHWuLrIq48Di0VM8mrH_/s1600/bar54.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1RgCcfIgZwH9QgNIasPzTSAvx1ClFU7Sp0HlT6yw6gOwZ1EEBKpZUaHcctu5Fn9j4U7-262lCRTdDA4WXGacBbOyC9T4gzV7WRW26_j-1syifyMIVgiIqc3a-_p2k2rJvWdE9S1Qz3Sm1/s1600/bar48.gifhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHkrNpJmKkkmTCeHzZ5Nr81Hyj8w45CxGbLpZxsl0bSno6dS4Gn9LGWWN2pRa7lg_ke7CTjySzjT1eF7tOsiWIgVQm0-L4PcVcXwtg-Dp9nqK_So9bVwkPKmr5cv8d5csSYfSsywhL6F8M/s1600/bar47.gifhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfBAfWJtK19keFmNOtkQQWZcIVMO_Rc7tia8_MDf6zC9yfSUzR_PHQjNjkFlv-amard75lRQirFu2LsE086XtKpDyO949jqU9G9GmiRzQxIqG29zgSRQOIE3_HpNNILBvWE1LxA73Dnu7D/s1600/astarl7s.gifhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdvxo7w6qt4lfxNRejQphECVWsxyU4OnuJHP2oWe5Ys2jyOrR3osHxmopHv3bY0yufOV3UVMjFnMMk6Wotwga9xMcYyBa4VLA-Kz_paDJXQiGyzy_mbbBwOo0kJJbgMbOyTIVf5KYqDA2w/s1600/dividers_129.gifhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMdNlvSFBf01so256OUJz3Jc8qPrGMTENS8zT1WJ8LrbNXx8Eu6-ti50yQV1WYZKAfs-X2ZV915asb0g7Gubj8UgG-ZMYLx4CxoTT6Ia9t3cVfHYnGVhooy79no_co27I3IpJpG2gSoK4Z/s1600/dividers_96.gifhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmRcFrEejb1sO-iZ5urDytT1SFolnYUR2_8E2sy8FiM8K1_MB7ewTxRdaVjgtArO2e9TySYcQwHYtroA5jUPBpBbc_ieZMCqYCvpWe6GhkekI6EwMWJpwEpe4TBoNJmsglEK0zcc9vBQxt/s1600/clipart-heart-border.jpghttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgc2LQkJjFLFoN_ue7vrDFLoZo2pF137UFSl3Z20u7tOJTsoph8xmG2Ly62OQPqo7fnmAw621QJ3G3WjNMACe-Gx_TVepl3J-dwlMuAfvYIuBikX_0FZ7SIi1S0g-mFP8_OwSnW7-SaiuFs/s1600/chain.gifhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuw25seSpAM6vvHGzHZLC5YH_jDBS_19p_rUtw9XC0Hgto8-4msSSJY-jP8z_tsauBeLXmkhqqm5eYYxsu2FRU0YX38udcfZtESm8it-OW5lWWORQ8qDx7FHT7qNpkVXo6boacwUqjYahU/s1600/bloodrose.gifhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgk-AT0p0FzsUDaVIYRgMWrNezE70vZbcM84ORqnOYB6lJx_XtL22fxVVYFedaQMsh7B8N8UPqhF0S_3p6m2IHeXCt6t51aVzB8Y4fgxIAyuIWNJcWdML-7fqsLRIejwUdiOEY7xC_Dhpw8/s1600/stonebar.gifhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTAR7xjNomSiq_et96czA2CIbVKgob8BH7OJqkCxsFWmGG3-bYChnC9dFRZ9fNCM96_RCn4iQ19Q8E3W4J8c9mOrRVPO3AorzvaGoAoSkUkvCEtorFHo-A5hipdBNubHvxKcFXsDUI47j-/s1600/resfiles_sdfp.gifhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgL6WVZ5nzgQT7KKiW6s2gJQJaHeiK1obReq1JaLmeTtwfUWYbMgHk84WQhd5Ki2JGeMZnt0nx8tE4R6QdJwi5Th8NZKdCOot_ZC-FAivKtPRXjQOEj0_iMMbx3he3agFLDTHEGgvHTVOt/s1600/resfileszcp.gifhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5qmqyOeuygaoUZJYonYRnwrEa_MFK8uT4G7OW_EYxADl8jcVEquRFRwx2SNXCJltH2glr8MG4w4qwBIvlzatFKPqSQ1agAk05WieQooVDDlZUufDQPob1gWXrMCSYvwG4b2-W1wZ7PDO8/s1600/resfiles_output.php.gifhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-lmIrFQH9HazmldGaieQx1h0meN33f1su9lVjcwfrVVS8uwe0STj7_UL_0OssOWOf4cppqH2oj2N_XNJbJAftzmR3DCQtkU8maDDrWSEn7ser4_7LOQHIZGMHhTzPHuiFjQHXoti18XTs/s1600/pumpkin-border-hth.gifhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLiZ_IPzJi8mNnKasCu9vo3ljGx6hNaPV4xiabKyecZ9F4n2Dd-xwuQ2zXigNf1INV4eYMOGMR0t1ud9zv1YHlvcRHlAI05l6aSe3kQIt_iKetEE77pQd16WKjMlrBGndFHkOXp8dIJIKb/s1600/irish-border4.gifhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmHfIo7v8UIBeGhm1XKDsdREqslnVSSa4IDatDBz_za3M_5Ops8A2MEqQj0KgOivjBZ53LV_q2o3zVa7Dz8K0bJxuzWkcIcwcUulzfkdTy-u-0Rol6dgLRkK65udPZhyh2fNoDZITAs7fP/s1600/ivy.gifhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2pMZzJei27PLFDkMbmoi_650-04g-0OaDdGCOSvwDgCP9HhZ4SNb65LPDkNo927MWoVsPqvoPYu-4sFpCcWKLR5LLe2FAYtBgirMR-kniFBdTFGT3Sxwo6qRznwWh6FH3oSV8i8Tp94nc/s1600/irish-border1.gifhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnlEiQPG3FDGs1F2pMvcHADkUW1LJvJcJ8iaoFMK-EJ_2agnINHsK3SxsDghJ-oSqyV6X9HEDyV3d6OZ64tki1Xzona2GL4Yby15AnNp4RFItF7vCT4vzNFDcuWxpQ9XAP6L4sQxNfhyphenhyphenPk/s1600/frog54.gifhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgX5xgOJp8bcT9FjGcgSSX6MbwVqtnHazMn4PsrIkfvOYK4lytGi06DkiTHMuFf2EshXxi0ZwG7AlgytwL4F5SXKxwroUaAJfROkERCqupIGl0K38nPZ5I751xw3Sge1nMDiYspUMpO45In/s1600/flowerbar.gifhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxN4TfvNS_Tg6BrnCKr6DNZ3lfKIr2gT41J8A7PgL8fxwrXKzZbNA4g6A1cZ50_PlGkIx9O7jBFVBRYtFoRM1p6Au_uay-lrzSiBu7f92aV23mybOP47JOLciTgLVDgP83kCu9Q9zSmxfr/s1600/drawing-separator.gifඑහෙනම් ඉතින් වැඩේ කොහොමද කියල කරලම බලන්න..කොමෙනෙට්ටුවක් දාන්නත් අමතක කරන්න එපා...ඊලග widget එක ලියන්න ඒවා ගොඩාක් වැදගත් වේවි!