கடந்த பாகத்தில் நமது சாதாரண HTML webpage -ல் இணைக்கும் படியான டேக் அதிகம் இல்லாததால், இந்தப் பாகத்தில் கூடுதலாக 4 டேக்குகளைப் பற்றிக் கூறிவிட்டு, இவற்றினையும் சேர்த்தே ஒர் அழகான வெப்பேஜ் கோடிங்க் கொடுக்கலாம் என்று இருக்கிறேன். இதன், இமேஜ் & கண்டண்டை மட்டும் மாற்றி அப்படியே நீங்களும் பயன்படுத்திக் கொள்ளலாம்.(பிடிச்சிருந்தால்) ... அல்லது நீங்களே சூப்பராக டேபுள் கொண்டு உருவாக்கிக் கொள்ளலாம்.
இன்று பார்க்க இருப்பது முக்கியமான இரண்டினைப் பற்றி Refresh & Favicon. Favicon, அட்ரஸ் பாரில் தெரியும் தள பெயருடன் சேர்ந்து தெரியும் இமேஜ் உருவாக்க பயன்படுகிறது. இவற்றின் கோடிங்கைப் பார்க்கலாம்.
இன்று பார்க்க இருப்பது முக்கியமான இரண்டினைப் பற்றி Refresh & Favicon. Favicon, அட்ரஸ் பாரில் தெரியும் தள பெயருடன் சேர்ந்து தெரியும் இமேஜ் உருவாக்க பயன்படுகிறது. இவற்றின் கோடிங்கைப் பார்க்கலாம்.
Favicon: Favorites Icon ( அட்ரஸ் பாரில் படுகை பெயருடன் இதனைப் பார்க்கலாம்)
இதுவரையில் <head> என்ற டேக் உள்ளே டைட்டில் மட்டும் கொடுத்து வந்திருப்போம், இப்பொழுது <title> tag அடுத்து அல்லது மேலே, கீழே உள்ள <link> டேக்கையும் சரியாக அதில் கொடுக்கப்பட்டுள்ள attribute உடன் இணைத்துக் கொள்ளுங்கள். அதற்கு முன், href= எனும் இடத்தில் இருக்கும் இமேஜ் முகவரியை மாற்றி, உங்களது தள பேவரைட் லோகோ இமேஜ் முகவரியைக் கொடுத்துக் கொள்ளுங்கள்.
<head>
<link rel="shortcut icon" href="http://www.iconj.com/ico/x/g/xg9a4vhb07.ico">
</head>
லோகோ இமேஜ் கொடுப்பது இருக்கட்டும், அதற்கு முன்னர், எவ்வாறு இத்தனை 16*16 என்ற சிறிய வடிவிலான இமேஜ் தயாரிப்பது என்று தெரியலையா? அல்லது எப்படி அதனை .ico என்ற பெயரில் சேவ் செய்வது என்று தெரியலையா? கவலையை விடுங்கள்.
முதலில், ஒர் சதுர வடிவில் உங்கள் லோகோ படத்தினை உருவாக்கிக் கொள்ளுங்கள். பின்னர், www.iconj.com என்ற தளத்திற்கு சென்று, அப்படத்தினை அப்லோடிங்க் செய்து, convert to ico என்று கொடுத்தால் போதும், அது சிறிய வடிவலான ico format image ஆக மாற்றிக் கொடுத்துவிடும். பின்னர், அவர்கள் கொடுக்கும் இமேஜ் லிங்கைப் பயன்படுத்தினாலும் சரி, அல்லது அந்த இமேஜை டவுன்லோடிங்க் செய்து, உங்கள் தளத்தில் அப்லோடிங்க் செய்துவிட்டு, முகவரியைப் பயன்படுத்தினாலும் சரி.
Refresh <meta> Tag
<meta> tag என்பதனையும் <head> tag உள்ளேதான் பயன்படுத்த வேண்டும். இப்பொழுது meta tag-n attribute கொண்டு எவ்வாறு மூன்று விதமாக வெப்தளத்தை Refresh செய்யலாம் என்று பார்ப்போம்.
Auto Refresh <meta> tag
கீழுள்ள கோடிங்கை அப்படியே ஹெட் டேக்கிற்குள் புகுத்திவிட்டால் போதும், ஒவ்வொரு 5 நொடிக்கு ஒர்முறையும் தளம் refresh ஆகிக் கொண்டே இருக்கும். கொஞ்சம் நேரத்தினை அதிகப்படுத்த நினைத்தால் content என்பதில் கொடுக்கப்பட்ட மதிப்பு 5 என்பதனை மாற்றி 20 எனக் கொடுத்தால் 20 நொடிக்கு ஒர் முறை, refresh ஆகும்.
Inside <head> tagமுதலில், ஒர் சதுர வடிவில் உங்கள் லோகோ படத்தினை உருவாக்கிக் கொள்ளுங்கள். பின்னர், www.iconj.com என்ற தளத்திற்கு சென்று, அப்படத்தினை அப்லோடிங்க் செய்து, convert to ico என்று கொடுத்தால் போதும், அது சிறிய வடிவலான ico format image ஆக மாற்றிக் கொடுத்துவிடும். பின்னர், அவர்கள் கொடுக்கும் இமேஜ் லிங்கைப் பயன்படுத்தினாலும் சரி, அல்லது அந்த இமேஜை டவுன்லோடிங்க் செய்து, உங்கள் தளத்தில் அப்லோடிங்க் செய்துவிட்டு, முகவரியைப் பயன்படுத்தினாலும் சரி.
Refresh <meta> Tag
<meta> tag என்பதனையும் <head> tag உள்ளேதான் பயன்படுத்த வேண்டும். இப்பொழுது meta tag-n attribute கொண்டு எவ்வாறு மூன்று விதமாக வெப்தளத்தை Refresh செய்யலாம் என்று பார்ப்போம்.
Auto Refresh <meta> tag
கீழுள்ள கோடிங்கை அப்படியே ஹெட் டேக்கிற்குள் புகுத்திவிட்டால் போதும், ஒவ்வொரு 5 நொடிக்கு ஒர்முறையும் தளம் refresh ஆகிக் கொண்டே இருக்கும். கொஞ்சம் நேரத்தினை அதிகப்படுத்த நினைத்தால் content என்பதில் கொடுக்கப்பட்ட மதிப்பு 5 என்பதனை மாற்றி 20 எனக் கொடுத்தால் 20 நொடிக்கு ஒர் முறை, refresh ஆகும்.
<meta http-equiv="refresh" content="5" >
உதாரணத்திற்கு viewonline.php?sg=1&sk=b&sd=d&start=0 என்ற லிங்க் சென்றால், எத்தனை பேர் ஆன்லைனில் இருக்கிறார்கள் என்பது 10 நொடிக்கு ஒர்முறை refresh ஆகிக் கொண்டிருப்பதனைப் பார்க்கலாம்.
Auto Redirection
கடந்த கோடிங்க், 5 நொடிக்கு ஒர்முறை அதே பக்கத்தினை மீண்டும் திறக்க பயன்படுத்தினோம். இப்பொழுது அதே கோடிங்க் மூலம் அதே பக்கத்திற்கு பதிலாக மற்றொரு தளத்திற்கு திசை திருப்பவிடச் செய்ய, எந்தப் பக்கத்திற்கு செல்ல வேண்டுமோ, அந்தப் பக்கத்தின் முகவரியைக் கூடுதலாகக் கொடுத்தால் போதும், அந்த தளத்திற்கு சென்றுவிடும்.
இதனை ஹெட் டேக் உள்ளே பயன்படுத்த வேண்டும்.
<meta http-equiv="refresh" content="5; url=http://freedomain.padugai.com">
உதாரணத்திற்கு, www.padukai.com என்ற நமது பழைய படுகைக்கு சென்றால், சிறிது நேரத்தில் padugai.com என்ற இன்றைய முகவரிக்கு வந்துவிடும்.
<iFrame> Tag :
தற்பொழுது அனேக வெப்தளங்களில் பயன்படுத்தப்படும் டேக், iFrame. இதன் மூலம் வேறு ஒர் பக்கத்தினை அப்படியே, ஒர் பக்கத்தின் சிறிய பகுதியாக கொண்டுவர முடியும். அதாவது ஒர் 200 *200 வடிவிலான ஒர் சின்ன பாக்ஸ் வெப்பக்கத்தினை உருவாக்கிவிட்டு, அதன் முகவரியினைக் கொண்டு Iframe டேக் மூலம், மற்றொரு வலைப்பக்கத்தில் பயன்படுத்தினால், அந்த முகவரியில் அல்லது அப்படியே இங்கு கிடைக்கும். ஆகையால் இதனைக் கொண்டும் ஒர் பக்கத்தின் ஒர் குறிப்பிட்ட பகுதியை மட்டும் refresh செய்ய முடியும். இதற்கு எடுத்துக்காட்டாக, கிரிக்கெட் நடந்து கொண்டிருக்கும் பொழுது ஒர் தளத்திற்குள் சென்றால், அந்த தளம் refresh ஆகாமலே, அங்கு இணைக்கப்பட்ட கிரிக்கெட் ஸ்கோர் பாக்ஸ் மட்டும் refresh ஆகிக் கொண்டிருப்பதனை நீங்கள் பார்த்திருக்கலாம். அப்படியில்லாவிடில், அடுத்தப்பாகத்தில் இதற்கான ஒர் உதாரணம் வெப் கோடிங்க் + பக்கங்களைக் கொடுக்கிறேன். ஆனால், அப்பக்கங்கள் புதிய கண்டண்டை மாற்றிக் கொண்டே இருக்க ஜாவாஸ்கிரிப்ட் கோடிங்க் மூலம் எழுதியிருக்கும். ஏனெனில் ஹெஸ்டிஎம் எல் மூலம் ரொட்டேட்டிங்க் கண்டண்ட் கொடுக்க முடியாது. நீங்களும் அடுத்து வரும் எடுத்துக்காட்டினைப் பயன்படுத்துங்கள். இப்போதைக்கு, iframe டேக் பயன்படுத்தும் கோடிங்க் முறை பார்த்துக் கொள்ளுங்கள்.
PUT iFrame in Body Section
<body>
welcome to padugai
<iframe src="http://padugai.com/test.htm" width=100 height=100 frameborder=0 scrolling=no>
</iframe>
No.1 Tamil online job tutorial site
</body>
மேலும் விளக்கமாக அடுத்தப் பாகத்தில் ஒர் வெப்பக்கம் + கோடிங்க் உடன் பார்ப்போம்.
தொடரும்....