ബ്ലോഗ് പോസ്റ്റിലെ ചില ഭാഗങ്ങള്‍ ഹൈഡ് ചെയ്യാന്‍ / വീണ്ടും കാണാന്‍.

ഒരു പാടു കാര്യങ്ങള്‍ വിശദീകരിച്ചെഴുതുന്ന,ബ്ലോഗ് പോസ്റ്റിലുള്ള, ചില ഏറെ പ്രാധാന്യമുള്ള / പ്രാധാന്യമില്ലാത്ത കാര്യങ്ങള്‍ (പ്രാധാന്യമില്ലാത്ത കാര്യങ്ങളാണ് നിങ്ങളൊക്കെ എഴുതുന്നതെന്ന് അര്‍ത്ഥമാക്കരുതേ..)തല്‍ക്കാലത്തേക്ക് ഒളിപ്പിച്ചു (Hide) വയ്ക്കുകയും,ആവശ്യമെങ്കില്‍ ഒരു മൗസ് ക്ലിക്കിലൂടെ തുറന്നുകാണിക്കുകയും ചെയ്യുന്ന തരത്തിലുള്ള (Show) ഒരു സൂത്രപ്പണി ഇതാ..!! എവിടെ ? ഒന്നും കാണാനില്ല അല്ലേ?ധൃതി കാട്ടല്ലേ.അതാണ്‌ പറഞ്ഞു വരുന്നതു.

ഉദാഹരണത്തിന്

ഇവിടെ ഒന്നു ക്ലിക് ചെയ്യൂ...

കണ്ടല്ലോ... ഇതാണ് സംഭവം.ഇതുപോലെ നിങ്ങളുടെ ബ്ലോഗില്‍ ചെയ്യാനായി,നിങ്ങളുടെ ബ്ലോഗിന്റെ ടെംപ്ലറ്റ് കോഡില്‍ ചില ചെറിയ കൂട്ടിച്ചേര്‍ക്കലുകള്‍ ചെയ്യേണ്ടതുണ്ട്.അതിനായി,ആദ്യം നിങ്ങളുടെ ബ്ലോഗിന്റെ edit html കോളത്തില്‍ ചെല്ലുക. അതിന് ശേഷം താഴെ കാണുന്ന കോഡ് കോപ്പി ചെയ്തു ഹെഡ് സെക്ഷനില്‍ പേസ്റ്റ് ചെയ്യുക.(അതായത്,മിക്കവാറും,നിങ്ങളുടെ ടെംപ്ലറ്റിന്റെ കോഡില്‍ ഡിസൈനുമായി ബന്ധപ്പെട്ട ഒരു ചെറിയ കുറിപ്പ് മുകള്‍ ഭാഗത്തായി കാണാം.പ്രസ്തുത കുറിപ്പ് നല്കിയ കോളത്തിനു താഴെയായി ഈ കോഡ് നല്കുക.)

.posthidden {display:none}
.postshown {display:inline}

ഇനി താഴെ കാണുന്ന കോഡ് കോപ്പി ചെയ്തു, ഹെഡ് സെക്ഷന്‍ അവസാനിപ്പിക്കുന്ന ടാഗിന്റെ (</head> ഇതാണ് ആ ടാഗ് ) തൊട്ടു മുകളിലായി പേസ്റ്റ് ചെയ്യുക.(ഈ ടാഗ് എളുപ്പത്തില്‍ കണ്ടുപിടിക്കാനായി,കീ ബോര്‍ഡില്‍ Ctrl+F എന്നത് അമര്‍ത്തിയാല്‍ വാക്കുകള്‍ തിരഞ്ഞുപിടിക്കാനുള്ള ഒരു ചെറിയ കോളം ആ പേജിന്റെ താഴെ വരുന്നതു കാണാം.അതില്‍ </head> എന്ന ടാഗ് നല്‍കിയാല്‍ ആ ടാഗ് hi-light ചെയ്തു കാണും).അതിന് ശേഷം,ടെംപ്ലറ്റ് സേവ് ചെയ്യുക.

<script type="text/Javascript">

function expandcollapse (postid) {

whichpost = document.getElementById(postid);

if (whichpost.className=="postshown") {
whichpost.className="posthidden";
}
else {
whichpost.className="postshown";
}
}
</script>

ഇനി,ബ്ലോഗില്‍ നിങ്ങള്‍ നല്കുന്ന കുറച്ചു കാര്യങ്ങള്‍ തല്‍ക്കാലത്തേക്ക് hide ചെയ്യുകയും,ആവശ്യമെങ്കില്‍ ഒരു മൗസ് ക്ലിക് വഴി അവ വീണ്ടും കാണാനുള്ള വിദ്യയുടെ അടുത്ത ഘട്ടതിലേക്ക് കടക്കാം.താഴെ കാണുന്ന കോഡ് കോപ്പി ചെയ്തു,അതില്‍ SHOW/HIDE THIS POST എന്നത് മാറ്റി നിങ്ങള്‍ക്കിഷ്ട്ടമുള്ള വാക്കുകള്‍ ചേര്ക്കുക.അതുപോലെ തന്നെ,എന്താണോ തല്‍ക്കാലത്തേക്ക് Hide ചെയ്യേണ്ടത്, CONTENT HERE എന്നത് മാറ്റി അത് നല്കുക.താഴെ കാണുന്ന കോഡില്‍ നേരത്തെ പറഞ്ഞ കാര്യങ്ങളില്‍ അല്ലാതെ മാറ്റം വരുത്താതിരിക്കാന്‍ ശ്രദ്ധിക്കുക.അതായത്,കോഡിന്റെ വലുപ്പം കുറച്ചു ഒരു ലൈനില്‍ ഒക്കെ ആക്കുന്ന പരിപാടി.അങ്ങിനെ എങ്കില്‍ കാര്യം കട്ടപ്പൊക.

<a style="text-decoration: none;" href="javascript:expandcollapse('25')">
<h4>SHOW/HIDE THIS POST</h4></a>
<span class="posthidden" id="25">
CONTENT HERE <br>
</span>


അപ്പൊ ഇനി ഇതൊന്നു പരീക്ഷിച്ചു നോക്കൂ.