இட்டது: மே 28th, 2014, 12:46 am
by பிரபாகரன்
Image

சென்ற இடுகையில் பிளாக்ஸ்பாட்டில் எவ்வாறு இணையுருக்களை இணைப்பது என்ற செய்முறையில் .post-body என்ற div ன் எழுத்துருவை எவ்வாறு மாற்றுவது எனப்பார்த்தோம்.

Code: [Select all] [Expand/Collapse]
.post-body {
line-height: 1.4;
font-size: 110%;
position: relative;
font-family:DroidSansReg,Arial;
}
GeSHi © Codebox Plus


இனி மற்ற DIV களில் உள்ள எழுத்துருக்களை எவ்வாறு மாற்றுவது என பார்ப்போம். அதற்கு முன் பூச்சரம் பகிரும் CSS கோப்பில் என்னென்ன எழுத்துருக்கள் உள்ளன அவற்றின் பெயர் என்ன என்று தெரிந்துகொண்டால் HTML நிரலை மேலும் எடுவு(Edit) செய்ய எளிமையாக இருக்கும்.




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



1) பிளாக்ஸ்பாட் பெயரின் எழுத்துருவை எவ்வாறு மாற்றுவது எனப்பார்ப்போம்.


படம் -1 பாருங்கள்.

படம்-1


HTML நிரல்களில்
Code: [Select all] [Expand/Collapse]
<Group description="Blog Title"
GeSHi © Codebox Plus
என்ற பகுதி எங்கு உள்ளது என கண்டுபிடிக்கவும்.

இதுபோல் இருக்கும்:

Code: [Select all] [Expand/Collapse]
<Group description="Blog Title" selector=".header h1">
     <Variable name="header.font" description="Title Font" type="font"
         default="normal normal 36px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 36px  Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>
     <Variable name="header.text.color" description="Text Color" type="color" default="#ffffff"  value="#ffffff"/>
</Group>
GeSHi © Codebox Plus


இந்த நிரலில் default=" என ஆரம்பிக்கும் வரியில் நீங்கள் விரும்பும் இணையுரு(Webfont) பெயரை சேர்த்துவிடவேண்டும். இதோ இவ்வாறு

Code: [Select all] [Expand/Collapse]
  <Group description="Blog Title" selector=".header h1">
     <Variable name="header.font" description="Title Font" type="font"
         default="normal normal 36px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 36px GISTTMOTKrishnanBold, Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>
     <Variable name="header.text.color" description="Text Color" type="color" default="#ffffff"  value="#ffffff"/>
   </Group>
GeSHi © Codebox Plus


நான் GISTTMOTKrishnanBold என்ற இணையுருவை இணைத்துள்ளேன். உங்களுக்கு பிடித்தமான எழுத்துருவை மேலே பட்டியலிட்டுள்ள அட்டவணையில் இருந்து தேர்ந்தேடுத்துகொள்ளவும்.



2)அடுத்து இடுகையின் (Post) தலைப்பில் உள்ள எழுத்துருவை மாற்றலாம்.


படம்-2 பாருங்கள்.

படம்-2


HTML நிரல்களில் <Group description="Post Title" என்ற பகுதி எங்குள்ளது என கண்டுபிடிக்கவும்.

இதுபோல் இருக்கும்:

Code: [Select all] [Expand/Collapse]
<Group description="Post Title" selector="h3.post-title, .comments h4">
     <Variable name="post.title.font" description="Title Font" type="font"
         default="normal normal 18px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 18px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>
   </Group>
GeSHi © Codebox Plus


இந்நிரலில் default="normal என்று ஆரம்பிக்கும் வரியில் நீங்கள் விரும்பும் இணையுரு(Webfont) பெயரை சேர்த்துவிடவேண்டும். இதோ இவ்வாறு

Code: [Select all] [Expand/Collapse]
<Group description="Post Title" selector="h3.post-title, .comments h4">
     <Variable name="post.title.font" description="Title Font" type="font"
         default="normal normal 18px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 18px GISTTMOTPadmaBold, Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>
</Group>
GeSHi © Codebox Plus


நான் GISTTMOTPadmaBold என்ற இணையுருவை இணைத்துள்ளேன். உங்களுக்கு பிடித்தமான எழுத்துருவை மேலே பட்டியலிட்டுள்ள அட்டவணையில் இருந்து தேர்ந்தேடுத்துகொள்ளவும்.



3) பிளாக்ஸ்பாட்டில் இடுகைகளின் நிலவறையின் எழுத்துருவை மாற்றுவோம்.


படம்-3 பாருங்கள்

படம்-3


HTML நிரல்களில் <Group description="Page Text" என்ற பகுதி எங்குள்ளது என கண்டுபிடிக்கவும்.

இதுபோல் இருக்கும்:
Code: [Select all] [Expand/Collapse]
<Group description="Page Text" selector="body">
<Variable name="body.font" description="Font" type="font"
         default="normal normal 15px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 15px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>
<Variable name="body.text.color" description="Text Color" type="color" default="#333333" value="#333333"/>
 </Group>
GeSHi © Codebox Plus


இந்நிரலில் default="normal என்று ஆரம்பிக்கும் வரியில் நீங்கள் விரும்பும் இணையுரு(Webfont) பெயரை சேர்த்துவிடவேண்டும். இதோ இவ்வாறு

Code: [Select all] [Expand/Collapse]
<Group description="Page Text" selector="body">
<Variable name="body.font" description="Font" type="font"
         default="normal normal 15px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 15px DINAKARAN2WRegular, Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>
<Variable name="body.text.color" description="Text Color" type="color" default="#333333" value="#333333"/>
 </Group>
GeSHi © Codebox Plus


நான் DINAKARAN2WRegular என்ற இணையுருவை இணைத்துள்ளேன். உங்களுக்கு பிடித்தமான எழுத்துருவை மேலே பட்டியலிட்டுள்ள அட்டவணையில் இருந்து தேர்ந்தேடுத்துகொள்ளவும்.



4) அடுத்து பிளாக்ஸ்பாட்டில் பக்கதலைப்புகளின் எழுத்துருவை மாற்றுவோம்.


படம்-4 பாருங்கள்.

படம்-4


HTML நிரல்களில் <Group description="Tabs Text" என்ற பகுதி எங்குள்ளது என கண்டுபிடிக்கவும்.

இதுபோல் இருக்கும்:

Code: [Select all] [Expand/Collapse]
<Group description="Tabs Text" selector=".tabs-inner .widget li a">
     <Variable name="tabs.font" description="Font" type="font"
         default="normal normal 15px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 15px  Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>
     <Variable name="tabs.text.color" description="Text Color" type="color" default="#ffffff" value="#ffffff"/>
     <Variable name="tabs.selected.text.color" description="Selected Color" type="color" default="$(link.color)" value="$(link.color)"/>
</Group>
GeSHi © Codebox Plus


இந்நிரலில் default="normal என்று ஆரம்பிக்கும் வரியில் நீங்கள் விரும்பும் இணையுரு(Webfont) பெயரை சேர்த்துவிடவேண்டும். இதோ இவ்வாறு

Code: [Select all] [Expand/Collapse]
<Group description="Tabs Text" selector=".tabs-inner .widget li a">
     <Variable name="tabs.font" description="Font" type="font"
         default="normal normal 15px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 15px SUNDARAM0819Regular, Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>
     <Variable name="tabs.text.color" description="Text Color" type="color" default="#ffffff" value="#ffffff"/>
     <Variable name="tabs.selected.text.color" description="Selected Color" type="color" default="$(link.color)" value="$(link.color)"/>
</Group>
GeSHi © Codebox Plus


நான் SUNDARAM0819Regular என்ற இணையுருவை இணைத்துள்ளேன். உங்களுக்கு பிடித்தமான எழுத்துருவை மேலே பட்டியலிட்டுள்ள அட்டவணையில் இருந்து தேர்ந்தேடுத்துகொள்ளவும்.



5) அடுத்து பிளாக்ஸ்பாட்டில் இடுக்கை(Widget) தலைப்புகளின் எழுத்துருவை மாற்றுவோம்.


படம்-5 பாருங்கள்.

படம்-5


HTML நிரல்களில் <Group description="Gadgets" என்ற பகுதி எங்குள்ளது என கண்டுபிடிக்கவும்.

இதுபோல் இருக்கும்:

Code: [Select all] [Expand/Collapse]
<Group description="Gadgets" selector="h2">
     <Variable name="widget.title.font" description="Title Font" type="font"
        default="bold normal 13px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="bold normal 13px  Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>
     <Variable name="widget.title.text.color" description="Title Color" type="color" default="#888888" value="#888888"/>
 </Group>
GeSHi © Codebox Plus


இந்நிரலில் default="bold normal என்று ஆரம்பிக்கும் வரியில் நீங்கள் விரும்பும் இணையுரு(Webfont) பெயரை சேர்த்துவிடவேண்டும். இதோ இவ்வாறு
Code: [Select all] [Expand/Collapse]
<Group description="Gadgets" selector="h2">
     <Variable name="widget.title.font" description="Title Font" type="font"
        default="bold normal 13px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="bold normal 13px tau_elango_rewathyregular, Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>
     <Variable name="widget.title.text.color" description="Title Color" type="color" default="#888888" value="#888888"/>
 </Group>
GeSHi © Codebox Plus


நான் tau_elango_rewathyregular என்ற இணையுருவை இணைத்துள்ளேன். உங்களுக்கு பிடித்தமான எழுத்துருவை மேலே பட்டியலிட்டுள்ள அட்டவணையில் இருந்து தேர்ந்தேடுத்துகொள்ளவும்.

இந்த வகையில் உருவாக்கப்பட்ட ஒரு மாதிரி பிளாக்ஸ்பாட் http://poocharamtamilforum.blogspot.in/ ... -post.html




கடைசியாக மேலே சொன்ன அணைத்து மாற்றங்களையும் செய்தபின்பு HTML நிரலை பட்டியின் மேலே இருக்கும் Save Template என்ற button -ஐ அழுத்தி சேமித்து விடவும். இப்போது உங்கள் பிளாக்ஸ்பாட்டை நீங்கள் இணைக்க விரும்பிய எழுத்துருக்கள் இணைக்கப்பட்டு புதுபொலிவுடன் தெரிவதை காணலாம்.

இதுவரை உங்கள் பிளாக்ஸ்பாட்டில் எவ்வாறு இணையுரு எழுத்துக்களை பயன்படுத்துவது என்று பார்த்தோம். இதில் உங்களுக்கு ஏதேனும் சந்தேகங்களோ அல்லது உதவியோ தேவைப்பட்டால், தயங்காமல் இப்பதிவின் பின்னூட்டத்தின் வழியாகவோ அல்லது மின்னஞ்சல் முகவரி மூலமாகவோ தொடர்பு கொள்ளலாம்.


(குறிப்பு : இந்த வசதியை பயன்படுத்துவதால் பூச்சரத்தின் விளம்பரமோ விவரங்களோ உங்கள் பிளாக்ஸ்பாட்டில் இடம்பெறுமோ என்ற ஐயம் வேண்டாம்.
இந்த வசதி பூச்சரத்தில் இருந்து தனித்து வைக்கப்பட்டுள்ளது. இது பூச்சரத்தின் விளம்பர பதிவு இல்லை, தமிழை உங்கள் ப்ளாக்ஸ்பாட்களில் அழகுற செய்யும் விளம்பரம் தான். முடிந்தவரை மற்ற தமிழ் நண்பர்களுக்கும் தெரியப்படுத்துங்கள் அல்லது இந்த இடுகையை பகிருங்கள்...... நன்றி )