பிளாகர் உத்திகள் : HTML/CSS நிரல்வரிகளை பதிவுகளில் காட்டுவது எப்படி?

பிளாகர் உதவிகள் பற்றிய பதிவுகள் எழுதும் போது கண்டிப்பாக HTML அல்லது CSS இல் அமைந்த நிரல் வரிகளை (codes) பற்றி குறிப்பிட வேண்டியிருக்கும். ஆனால் பதிவுகள் எழுதும் போது இந்த Html வரிகளை அப்படியே சேர்த்தால் நாம் post செய்யும் போது ஒரு பிழைச்செய்தியும் காட்டப்படும். அதை தவிர்த்தபின்னர் பதிவை பார்த்தால் தெளிவாக காட்டப்படாது அல்லது ஒன்றுமே இருக்காது. இதனால் படிக்கும் வாசகர்கள் குழப்பம் அடைய நேரிடும்.எனவே இவற்றை தனியாக விரும்பிய வண்ணத்தில் பெட்டிச்செய்தியாக(Coloured box) இட்டால் தெளிவாகவும் இருக்கும்.அவர்கள் அந்த நிரல்களை காப்பி (copy)செய்யவும் எளிதாக இருக்கும்.

என்ன செய்யவேண்டும்?

முதலில் html வரிகளை என்கோடிங் செய்யவேண்டும். அப்போது தான் வழக்கமான வரிகளோடு நாம் பயன்படுத்தும் நிரல்களை html parser எடுத்துக்கொள்ளக்கூடாது என்று முறைப்படி இருக்கும்.இதற்கு centricle என்ற தளத்திற்கு சென்று அதில் உள்ள பெட்டியில் உங்கள் நிரலை கொடுத்தால் அதை என்கோடிங் செய்து மாற்றித்தரும். அதை அப்படியே உங்கள் பதிவில் வைத்துவிட்டால் எந்த பிழையும் சொல்லாது.ஆனால் இன்னும் சில வரிகளை உங்கள் பிளாகில் சேர்ப்பதன் மூலம் தனியாக வண்ணப்பெட்டியில் அழகான முறையில் காட்டலாம்.

முறை 1:

உங்கள் Blog settings->Design->Edit Html செல்லுங்கள். அதில் வலது மேல் ஓரத்தில் உள்ள Expand Widget Templates என்பதில் டிக் செய்யவும். பின் F3 அழுத்தி
]]></b:skin> என்ற வரியை தேடி கீழ் உள்ள வரிகளை அதற்கு முன் பேஸ்ட் செய்யுங்கள்.

.csscode {
margin : 10px 25px 10px 15px;
padding : 10px;
clear : both;
list-style-type : none;
background : #F2F7FF;
border-top : 1px solid #AAAAAA;
border-right : 1px solid #AAAAAA;
border-bottom : 1px solid #AAAAAA;
border-left : 1px solid #AAAAAA;
}

இப்போது நீங்கள் பதிவிடும் போது என்கோடிங் செய்யப்பட்ட வரிகளை
<div class="csscode"> மற்றும் </div> வரிகளுக்குள் வருமாறு
சேர்த்து விடுங்கள்.
இதனால் Html நிரல்கள் வெளிர்நீல வண்ணப்பெட்டியில் தோன்றும். உதாரணத்திற்கு என்னுடைய பதிவில் இருப்பது போல தோன்றும்.

முறை 2 :

.postCode{
background: none repeat scroll 0 0;
border:1px solid Silver;
height:'auto';
margin:10px;
overflow:auto;
padding:6px;
text-align:left;
}

மேலே உள்ள முறையில் சொன்னபடி ]]></b:skin> க்கு முன் இந்த நிரலையும் சேர்க்கலாம். பின்னர் பதிவிடும் போது என்கோடிங் செய்யப்பட்ட வரிகளை
<div class="postcode"> மற்றும் </div> வரிகளுக்குள் சேர்த்து விட்டு உங்கள் பதிவை பார்த்தால் வேறொரு வண்ணத்தில் தோன்றும். நீங்கள் இந்த இரண்டையும் வலைபதிவு எழுதும் போது எங்கே வேண்டுமானாலும் பயன்படுத்தலாம். நன்றி.

Tweet