യാഹുമെയിലില്‍ html signature കൊടുക്കാനുള്ള സൗകര്യം മുമ്പുതന്നെ ഉണ്ട്. ഏതെങ്കിലും html editor-ല്‍ ഒരു കുഞ്ഞു സിഗ്‌നേച്ചറുണ്ടാക്കി കോപ്പി എടുത്ത് അവിടെ പേസ്റ്റ് ചെയ്താല്‍ മതിയാവും. എന്നാല്‍ ജിമെയില്‍ പോലുള്ള പല മെയില്‍ സര്‍‌വീസുകളിലും ആ ഒരു സൗകര്യം നിലവില്ലില്ല. html ഉപയോഗിച്ച് അത്യാവശ്യം കളികള്‍ കളിക്കുന്നവരെ നിരാശരാക്കുന്ന ഒരു കാര്യമാണത്. എന്നാല്‍ വൈസ്‌സ്റ്റാമ്പെന്ന ഒരു മോസില്ല ആഡ്‌ഓണ്‍ ഉപയോഗിച്ച് നമുക്കിത് ഭംഗിയായി ചെയ്യാവുന്നതാണ്‌. എന്റെ ജീമെയില്‍ കിട്ടിയ പലരും, അതിലെ സിഗ്നേച്ചര് കണ്ടിട്ട് അതെങ്ങനെ ഉണ്ടാക്കിയെന്നു ചോദിക്കുകയുണ്ടായി. (ദാ ഇവിടെ ഉണ്ട് ആ സിഗ്നേച്ചര്!)അന്നേ തോന്നിയ ഒരാശയമായിരുന്നു, ജിമെയില്‍ സിഗ്നേച്ചറിനെ കുറിച്ചൊരു പോസ്റ്റ്. ഇതു കൊണ്ട് ജീമെയിലില്‍ മാത്രമല്ല, മറ്റു പല മെയില്‍സര്‍‌വീസുകളിലും നമുക്ക് സിഗ്നേച്ചര് ഉണ്ടാക്കാവുന്നതാണ്.
സിഗ്നേച്ചര്
മെയിലിനു കീഴെ അല്പം ഭംഗിയില്‍ പേരും അഡ്രസ്സും ഫോണ്‍ നമ്പറും അതുപോലെ അത്യാവശ്യം ചിലകാര്യങ്ങളും html കോഡുപയോഗിച്ച് എഴുതുക എന്നേ സിഗ്നേച്ചര് എന്നതുകൊണ്ട് ഇവിടെ അര്‍‌ത്ഥമാക്കുന്നുള്ളൂ. അതിനായ് വേണമെങ്കില്‍ ഇമേജുകളും ഉപയോഗിക്കാം. പിന്നീട് മെയില്‍ കം‌മ്പോസുചെയ്യുമ്പോള്‍ അതു താഴെ അറ്റാച്ച്‌ഡായി വരുന്നതു കാണാം. ഇമേജുകള്‍ ഉപയോഗിക്കുന്നവര്‍, ആ ഇമേജുകള്‍ ഓണ്ലൈനില് എന്നും സൂക്ഷിക്കാന്‍ ഒരിടം(പിക്കാസ വെബ്‌ആര്‍ബം, നിങ്ങളുടെ വെബ്‌സ്പേസ്, ഇതുപോലെ ഏതെങ്കിലും ഒന്ന്) കണ്ടെത്തുകയും അവിടെ ആ ഇമേജുകള്‍ ആദ്യം തന്നെ സൂക്ഷിക്കേണ്ടതുമാണ്‌.
ഡൗണ്‍ലോഡുചെയ്യുക
മോസില്ലയില്‍ ഈ ആഡ്‌ഓണ്‍ ഇന്സ്റ്റാള് ചെയ്യുക. ഇതു ഡൗണ്‍‌ലോഡ് ചെയ്തശേഷം തുറന്നു വെച്ച മോസില്ല ബ്രൗസറിലേക്ക് ഡ്രാഗ്‌ ചെയ്തുകൊണ്ടിട്ടാല്‍ മതി. അപ്പോള്‍ ഇന്സ്റ്റാള് ചെയ്യാനുള്ള ഓപ്‌ഷന്‍ കിട്ടും. സാധാരണ ആഡ്‌ഓണ്‍‌സ് ഇന്സ്റ്റാള് ചെയ്യുന്നതുപോലെ തന്നെയാണ്‌. ആഡ്‌ഓണ്‍ ഇന്സ്റ്റാള് ചെയ്തു കഴിഞ്ഞാന്‍ ബ്രൗസര്‍ ഒന്നു റീസ്റ്റാര്‍‌ട്ട് ചെയ്യാന്‍ പറയും. ഇതിനായി ബ്രൗസര്‍ ക്ലോസ്‌ ചെയ്ത ശേഷം വീണ്ടും ഓപ്പണ്‍ ചെയ്താല്‍ മതിയാവും. ഇനി മോസില്ലയുടെ മുകളിലെ മെനുവില്‍ ടൂള്‍‌സ് ക്ലിക്ക് ചെയ്ത് അതിലെ ആഡ്‌ഓണ്‍‌സ് (Add-Ons) ക്ലിക്ക് ചെയ്യുക. ആഡ്‌ഓണ്‍‌സിന്റെ ഒരു വിന്‍‌ഡോ ഓപ്പണ്‍ ചെയ്തു വരുന്നതു കാണാം. അതില്‍ എക്‌സ്റ്റന്‍‌ഷന്‍‌സ് (extensions) എന്നൊരു ടാബുണ്ടാവും. അതു ക്ലിക്കുചെയ്ത് താഴെ വൈസ്‌സ്റ്റാമ്പ് എന്നൊരു എക്‌സ്റ്റന്‍‌ഷന്‍ കൂട്ടിച്ചേര്‍‌ത്തിട്ടുണ്ടോ എന്നു നോക്കുക: ചിത്രം നോക്കിയാല്‍ കൂടുതല്‍ മനസിലാവും.
ഇതില്‍ വന്നാല്‍ നിങ്ങളുടെ ആഡ്‌ഓണ്‍ കൃത്യമായിതന്നെ ഇന്‍സ്‌റ്റാള്‍‌ഡ് ആണെന്നര്‍‌ത്ഥം.
സിഗ്നേച്ചര് ഉണ്ടാക്കുക
വളരെ ശ്രദ്ധിച്ചുചെയ്യേണ്ട ഒരു കാര്യമാണിത്. നിങ്ങള്ക്ക് ഏതെങ്കിലും html എഡിറ്റര്‍ ഉപയോഗിച്ച് നല്ലൊരു സിഗ്നേച്ചര് ഉണ്ടാക്കാവുന്നതാണ്. (ഞാന്‍ ഉപയോഗിക്കുന്നത് അഡോബിന്റെ ഡ്രീം‌വീവറാണ്‌) സ്റ്റൈല്‍‌സ് ഒക്കെ ഇന്‍ലൈന്‍ ആയിത്തന്നെ കൊടുക്കണം. ഇമേജുകള്‍ ഉപയോഗിക്കുന്നുണ്ടെങ്കില്‍ മുകളില്‍ പറഞ്ഞത് ഓര്‍‌മ്മയുണ്ടല്ലോ അവ ഓണ്ലൈനില് എന്നും ഉണ്ടാവുന്ന വിധം ഏതെങ്കിലും ഒരു സെര്‍‌വറില്‍ വേണം സൂക്ഷിക്കാന്‍. ഇനി ഇതൊന്നുമറിയാത്തവര്‍ക്ക് ഞാന്‍ ഉപയോഗിക്കുന്ന സിഗ്നേച്ചറിന്റെ കോഡുതരാം, അതിലെ കണ്ടറ്റുപാര്‍‌ട്ടില്‍ നിങ്ങള്‍ക്കു വേണ്ടുന്ന മാറ്റങ്ങള്‍ വരുത്തിയാല്‍ മതി. അതില്‍ കാണുന്ന ഇമേജ്‌സ് ഒക്കെ ഓണ്ലൈനില് തന്നെ ഉള്ളതിനാല്‍ അതിനേകുറിച്ചും വേവലാതി വേണ്ട.
എന്റെ സിഗ്നേച്ചറിന്റെ കോഡ്.
<div style=”padding: 5px 5px 5px 15px; background: none repeat scroll 0% 0% rgb(255, 255, 255); border-top: 1px solid rgb(238, 238, 238); border-bottom: 1px solid rgb(238, 238, 238); -moz-border-radius: 3px 3px 3px 3px; height: 110px; margin: 0pt;”> <img style=”width: 70px; height: 70px; float: left; border: medium none;” src=”https://chayilyam.com/stories/signature/rajesh-k-odayanchal.png”>
<div style=”font-family: Arial,Helvetica,sans-serif; font-size: 16px; color: rgb(187, 187, 187); font-weight: bold; margin-bottom: 3px;”>Rajesh K</div>
<div style=”font-size: 12px; color: rgb(136, 136, 136); line-height: 15px;”><span style=”font-size: 12px; color: rgb(0, 51, 102); padding-right: 5px; margin-top: 2px;”>Tel:</span>+91 – 9980591900</div>
<div style=”font-size: 12px; color: rgb(136, 136, 136); line-height: 15px;”><span style=”font-size: 12px; color: rgb(0, 51, 102); padding-right: 5px; margin-top: 2px;”>Email:</span><a href=”#” style=”font-family: Arial,Helvetica,sans-serif; font-size: 12px; color: rgb(91, 153, 254); text-decoration: none;”>rajeshodayanchal@gmail.com</a></div>
<div style=”font-size: 12px; color: rgb(136, 136, 136); line-height: 15px; margin-bottom: 9px;”><span style=”font-size: 12px; color: rgb(0, 51, 102); padding-right: 5px; margin-top: 2px;”>Website:</span><a href=”https://chayilyam.com/stories” target=”_blank” style=”font-family: Arial,Helvetica,sans-serif; font-size: 12px; color: rgb(91, 153, 254); text-decoration: none;”>https://chayilyam.com/stories</a></div>
<div style=”display: block; float: left;”>
<ul style=”margin: 0pt; padding: 0pt; list-style: none outside none; width: auto;”>
<li style=”float: left; list-style: none outside none; display: inline; width: 32px; margin: 0pt; padding: 0pt; outline: medium none; border: medium none;”><a style=”height: 32px; width: 32px; display: block;” target=”_blank” title=”My LinkedIn Profile” href=”http://in.linkedin.com/in/rajeshodayanchal”><img style=”margin: 0pt; padding: 0pt; border: medium none; outline: medium none; text-decoration: none;” src=”https://chayilyam.com/stories/signature/linkedin.png”></a> </li>
<li style=”float: left; list-style: none outside none; display: inline; width: 32px; margin: 0pt; padding: 0pt; outline: medium none; border: medium none;”><a style=”height: 32px; width: 32px; display: block;” target=”_blank” title=”My Twitter Account” href=”http://www.twitter.com/odayanchal/”><img style=”margin: 0pt; padding: 0pt; border: medium none; outline: medium none; text-decoration: none;” src=”https://chayilyam.com/stories/signature/twitter.png”></a> </li>
<li style=”float: left; list-style: none outside none; display: inline; width: 32px; margin: 0pt; padding: 0pt; outline: medium none; border: medium none;”><a style=”height: 32px; width: 32px; display: block;” target=”_blank” title=”My Facebook Account” href=”http://www.facebook.com/#%21/odayanchal”><img style=”margin: 0pt; padding: 0pt; border: medium none; outline: medium none; text-decoration: none;” src=”https://chayilyam.com/stories/signature/facebook.png”></a> </li>
<li style=”float: left; list-style: none outside none; display: inline; width: 32px; margin: 0pt; padding: 0pt; outline: medium none; border: medium none;”><a style=”height: 32px; width: 32px; display: block;” target=”_blank” title=”My Orkut Profile” href=”http://www.orkut.co.in/Main#Profile?uid=2307759227150664180″><img style=”margin: 0pt; padding: 0pt; border: medium none; outline: medium none; text-decoration: none;” src=”https://chayilyam.com/stories/signature/orkut.png”></a> </li>
<li style=”float: left; list-style: none outside none; display: inline; width: 32px; margin: 0pt; padding: 0pt; outline: medium none; border: medium none;”><a style=”height: 32px; width: 32px; display: block;” target=”_blank” title=”My Delicious Bookmarks” href=”http://delicious.com/rajeshodayanchal/”><img style=”margin: 0pt; padding: 0pt; border: medium none; outline: medium none; text-decoration: none;” src=”https://chayilyam.com/stories/signature/delicious.png”></a> </li>
<li style=”float: left; list-style: none outside none; display: inline; width: 32px; margin: 0pt; padding: 0pt; outline: medium none; border: medium none;”><a style=”height: 32px; width: 32px; display: block;” target=”_blank” title=”My Stumbled Sites” href=”http://www.stumbleupon.com/stumbler/rajeshodayanchal/”><img style=”margin: 0pt; padding: 0pt; border: medium none; outline: medium none; text-decoration: none;” src=”https://chayilyam.com/stories/signature/stumble.png”></a> </li>
<li style=”float: left; list-style: none outside none; display: inline; width: 32px; margin: 0pt; padding: 0pt; outline: medium none; border: medium none;”><a style=”height: 32px; width: 32px; display: block;” target=”_blank” title=”My Youtube Videos” href=”http://www.youtube.com/user/rajeshodayanchal”><img style=”margin: 0pt; padding: 0pt; border: medium none; outline: medium none; text-decoration: none;” src=”https://chayilyam.com/stories/signature/youtube.png”></a> </li>
<li style=”float: left; list-style: none outside none; display: inline; width: 32px; margin: 0pt; padding: 0pt; outline: medium none; border: medium none;”><a style=”height: 32px; width: 32px; display: block;” target=”_blank” title=”My Picasa Web albums” href=”http://picasaweb.google.com/rajeshodayanchal/”><img style=”margin: 0pt; padding: 0pt; border: medium none; outline: medium none; text-decoration: none;” src=”https://chayilyam.com/stories/signature/picasa.png”></a> </li>
<li style=”float: left; list-style: none outside none; display: inline; width: 32px; margin: 0pt; padding: 0pt; outline: medium none; border: medium none;”><a style=”height: 32px; width: 32px; display: block;” target=”_blank” title=”My Flickr Web albums” href=”http://www.flickr.com/photos/90118566@N00/”><img style=”margin: 0pt; padding: 0pt; border: medium none; outline: medium none; text-decoration: none;” src=”https://chayilyam.com/stories/signature/flickr.png”></a> </li>
<li style=”float: left; list-style: none outside none; display: inline; width: 32px; margin: 0pt; padding: 0pt; outline: medium none; border: medium none;”><a style=”height: 32px; width: 32px; display: block;” target=”_blank” title=”My Myspace Account” href=”http://www.myspace.com/328788045″><img style=”margin: 0pt; padding: 0pt; border: medium none; outline: medium none; text-decoration: none;” src=”https://chayilyam.com/stories/signature/myspace.png”></a> </li>
<li style=”float: left; list-style: none outside none; display: inline; width: 32px; margin: 0pt; padding: 0pt; outline: medium none; border: medium none;”><a style=”height: 32px; width: 32px; display: block;” target=”_blank” title=”My Google Profile” href=”http://www.google.com/profiles/rajeshodayanchal”><img style=”margin: 0pt; padding: 0pt; border: medium none; outline: medium none; text-decoration: none;” src=”https://chayilyam.com/stories/signature/google.png”></a> </li>
<li style=”float: left; list-style: none outside none; display: inline; width: 32px; margin: 0pt; padding: 0pt; outline: medium none; border: medium none;”><a style=”height: 32px; width: 32px; display: block;” target=”_blank” title=”My Yahoo Profile” href=”http://profiles.yahoo.com/u/LX5WYYFN6J3ZWSY2DPB257GRUE”><img style=”margin: 0pt; padding: 0pt; border: medium none; outline: medium none; text-decoration: none;” src=”https://chayilyam.com/stories/signature/yahoo.png”></a> </li>
<li style=”float: left; list-style: none outside none; display: inline; width: 32px; margin: 0pt; padding: 0pt; outline: medium none; border: medium none;”><a style=”height: 32px; width: 32px; display: block;” target=”_blank” title=”My WordPress Account” href=”http://en.wordpress.com/odayanchal/#my-blogs”><img style=”margin: 0pt; padding: 0pt; border: medium none; outline: medium none; text-decoration: none;” src=”https://chayilyam.com/stories/signature/wordpress.png”></a> </li>
<li style=”float: left; list-style: none outside none; display: inline; width: 32px; margin: 0pt; padding: 0pt; outline: medium none; border: medium none;”><a style=”height: 32px; width: 32px; display: block;” target=”_blank” title=”My Blog” href=”http://www.moorkhan.blogspot.com/”><img style=”margin: 0pt; padding: 0pt; border: medium none; outline: medium none; text-decoration: none;” src=”https://chayilyam.com/stories/signature/blog.png”></a> </li>
<li style=”float: left; list-style: none outside none; display: inline; width: 32px; margin: 0pt; padding: 0pt; outline: medium none; border: medium none;”><a style=”height: 32px; width: 32px; display: block;” target=”_blank” title=”My RSS Feeds” href=”http://feeds.feedburner.com/Chayilyam”><img style=”margin: 0pt; padding: 0pt; border: medium none; outline: medium none; text-decoration: none;” src=”https://chayilyam.com/stories/signature/rss.png”></a> </li>
</ul>
</div>
</div>
ഈ കോഡിന്റെ പ്രിവ്യു ഇവിടെ കൊടുത്തിരിക്കുന്നു. ഈ കോഡ് ഇതുപോലെ കോപ്പി എടുക്കുക.
- ഒരു നോട്പാഡില് അതു പേസ്റ്റ് ചെയ്യുക – ഒരു html എഡിറ്റാറാണെങ്കില്‍ വളരേ നല്ലത്.
- പേര്‍, നമ്പര്‍ എന്നിവ മാറ്റുക,
- സോഷ്യല്‍ നെറ്റ്‌വര്‍ക്കിലെ നിങ്ങളുടെ പ്രൊഫൈല്‍ ലിങ്ക് കണ്ടുപിടിച്ച് വളരെ ശ്രദ്ധാപൂര്‍‌വം മാറ്റുക,
- ഇനി ഇവിടെ കൊടുത്തിരിക്കുന്ന സോഷ്യല്‍ നെറ്റ്വര്‍ക്ക് ലിങ്കില്‍ ഏതെങ്കിലും ഒന്നില്‍ നിങ്ങള്ക്ക് പ്രൊഫൈല്‍ ഇല്ലെന്നു കരുതുക. അതപ്പോള്‍ ഒഴിവാക്കേണ്ടതാണല്ലോ. അതിന് ആ ലിങ്ക് ഉള്‍പ്പെട്ട <li> ടാഗ് ( <li> style=”float:…. മുതല്‍ </li> വരെ ഉള്ള ഭാഗം) എടുത്തു കളഞ്ഞാല്‍ മതി.
- ഇതില്‍ ഇല്ലാത്തൊരു ലിങ്ക് കൂട്ടിച്ചേര്‍ക്കാന്‍ അല്പം പാടാണ്‌.
ഇനി ചെയ്യേണ്ടത്
ഇനി, മോസില്ല ഓപ്പണ്‍ ചെയ്യുക. നേരത്തേ പറഞ്ഞ ആഡോണ്‍ എടുക്കക ( click: tools -> Add-ons then Extensions) അതില്‍ Options എന്നൊരു ബട്ടണ്‍ ഇടതുവശത്തുണ്ടാവും അതു ക്ലിക്ക് ചെയ്യുക. ഇപ്പോള്‍ വരുന്ന വിന്‍‌ഡോ ഒന്നു നന്നായി നോക്കുക. അതില്‍ Choose your Signature: എന്നുണ്ട്; Your Details: എന്നൊരു സെക്‌ഷന്‍ ഉണ്ട് – അതില്‍ തന്നെ HTML എന്നൊരു ബട്ടണ്‍ ഉണ്ട്. അതില്‍ ക്ലിക്ക് ചെയ്താല്‍ വിഷ്വല്‍ (Visual) എന്നായി അതിന്റെ പേരു മാറുന്നതു കാണാം. അതിനു താഴെ വലിയൊരു ടെക്‌സ്‌റ്റ്ബോക്‌സും കാണാം. HTML എന്നു പേരുള്ള ബട്ടണ്‍ ക്ലിക്ക് ചെയ്താല്‍ വരുന്ന ഈ ബോക്സില് നമ്മള്‍ നേരത്തേ നോട്പാഡില് തയ്യാറാക്കി വെച്ചിരിക്കുന്ന html code പേസ്റ്റ് ചെയ്താല്‍ മതി. ഇനി വേണമെങ്കില്‍ ഏറ്റവും താഴെ ഉള്ള Preview എന്ന ബട്ടണ്‍ ക്ലിക്ക് ചെയ്താല്‍ അതെങ്ങനെ വരുമെന്നു കാണാനുമാവും. ഇനി എല്ലാം OK കൊടുത്തു ക്ലോസ്‌ ചെയ്യുക.
ഇനി നിങ്ങളുടെ ജിമെയില്‍ ഓപ്പണ്‍ ചെയ്യുക. അവിടെ സെറ്റിം‌ങ്‌സില്‍ ജെനറല്‍ പാര്‍‌ട്ടില്‍ താഴെ സിഗ്നേച്ചര് എന്ന ഭാഗം നോക്കുക. അവിടെ താഴെ കാണുന്നതു പോലെ വന്നു കാണും.
അത്യാവശ്യം വേണ്ട എഡിറ്റിംങുകള്‍ ഇവിടേയും നടത്താം. രണ്ട് സിഗ്നേച്ചര് വന്നിട്ടുണ്ടെങ്കില്‍ ഒന്ന് ഇവിടെവെച്ചു തന്നെ ഡിലീറ്റ് ചെയ്തേക്ക്. സിഗ്നേച്ചര് ബോക്സില് സിഗ്നേച്ചര് വന്നു കഴിഞ്ഞാല്‍ വീണ്ടും മോസില്ലയുടെ ടൂള്‍സില്‍ ആഡോണ്‍‌സില്‍ പോയി ആ ആഡോണിനെ എടുക്കുക. അതിനി വേണ്ട. അതവിടെ കിടന്നാല്‍ മെയില്‍ സിഗ്നേച്ചറില്‍ ഇനി രണ്ട് സിഗ്നേച്ചര് വനുകൊണ്ടിരിക്കും. അവിടെ നിന്നു തന്നെ Uninstall ചെയ്തു കളഞ്ഞേക്ക്… അല്ലെങ്കില്‍ ഡിസേബിള്‍ ചെയ്തു വെച്ചേക്ക്. (ഡൗണ്‍ലോഡുചെയ്യുക എന്ന മുകളിലെ ഹെഡിം‌ങിനു കീഴിലുള്ള ചിത്രം നോക്കുക. uninstall ചെയ്യാനും disable ചെയ്യാനും ഉള്ള ബട്ടണുകള്‍ കാണാവുന്നതാണ്‌.)
വളരെ എളുപ്പമാണിത്. കോഡ് എഡിറ്റുചെയ്യുമ്പോള്‍ നല്ല ശ്രദ്ധ വേണം. എന്റെ ജീമെയില്‍ സിഗ്നേച്ചറിന്റെ ഗുട്ടന്‍‌സ് പിടികിട്ടിക്കാണുമെന്നു കരുതുന്നു. സ്വന്തമായി ഇതിനുവേണ്ട കോഡ് എഴുതുമ്പോള്‍ ശ്രദ്ധിക്കേണ്ട കാര്യം അതിന്റെ സ്റ്റൈല്‍ ഇന്‍ലൈനായി തന്നെ എഴുതണം എന്നതാണ്‌. പുതിയൊരു സിഗ്നേച്ചര് ഉണ്ടാക്കി തരണമെന്ന് ആരും പറഞ്ഞേക്കരുത് 🙂 പലര്‍ക്കും പല ഐഡിയ ആണല്ലോ ശ്രമിച്ചു നോക്കുക. വിജയിച്ചാല്‍ ഒരു മെയില്‍ എനിക്കും അയക്കാന്‍ മറക്കരുത്!
