Saturday 13 April 2013

பிளாக்கருக்கான அழகிய Numbered page Navigation


வலைபூக்களில்  ஒவ்வொரு பக்கமாக செல்ல  Older Post என்பதை கிளிக் செய்து ஒவ்வொரு பக்கமாக பார்வையிடுவோம். இதனால் தொடர்ந்து ஒவ்வொரு பக்கமாகதான் நாம் பார்க்க முடியும் அதிகம் அதிக பக்கத்தையுடைய வலைபூக்களில் இவ்வாறு பார்ப்பது  ரொம்ப கடினமான வேலையாகிவிடும்.
இதனால் படிப்பவர்களுக்கும் சோர்வடைந்து விடுவார்கள்.


Older post என்பதற்கு பதிலாக  Numbered Page Navigation கொடுத்தால் விரைவாக பக்கங்களை பார்வையிடலாம்.... வலைப்பூவும் ஒரு சிறந்த காட்சியமைப்பையும் தரும்

(இந்த Numbered Page Navigation ஆனது ஏனைய Numbered Page Navigation ஐ விட விரைவாக லோடாகும் வகையில் வடிவமைக்கப்பட்டுள்ளது மற்றும் அழகிய தோற்றத்தையும் கொண்டுள்ளது)

Numbered Page Navigation எனது Demo Page ஐ பார்வையிட இங்கே அழுத்தவும்

அழகிய Numbered Page Navigation ஐ பிளாக்கரில் எப்படி இணைப்பது என்பதை பார்ப்போம்

படிமுறை - 1 -Apply Style

1. உங்கள் வலைபூவிற்கு சென்று Login செய்து கொள்ளுங்கள்,
2. பின்னர் Layout ---> Edit html கிளிக் செய்யுங்கள்,
3. அதன்பின் Expand Widget Templates’என்பதை கிளிக் செய்யுங்கள்

4. பின் கிடைக்கும் வார்ப்பு நிரலில்
]]></b:skin>
 என்பதை கண்டுபிடித்து அந்த வரிச் சொல்லுக்கு மேல் பின் வருவதை பிரதி பண்ணுங்கள்..
.showpageNum a {
  padding: 3px 8px;
  margin:0 4px;
  text-decoration: none;
  border:1px solid #999;
  -webkit-border-radius:3px;-moz-border-radius:3px;
  background: #ddd;
  }

.showpageOf {
margin:0 8px 0 0;
}
.showpageNum a:hover {
  border:1px solid #888;
  background: #ccc;
  }

.showpagePoint {
  color:#fff;
  text-shadow:0 1px 2px #333;
  padding: 3px 8px;
  margin: 2px;
  font-weight: 700;
  -webkit-border-radius:3px;-moz-border-radius:3px;
  border:1px solid #999;
  background: #666;
  text-decoration: none;
  }

படிமுறை - 2 -Apply Javascript

வார்ப்பு நிரலில்
</body>
 என்பதை கண்டுபிடித்து அந்த வரிச் சொல்லுக்கு மேல் பின் வருவதை பிரதி பண்ணுங்கள்..
&lt;script type='text/javascript'&gt;
var home_page=&quot;/&quot;;
var urlactivepage=location.href;
var postperpage=7;
var numshowpage=4;
var upPageWord ='Prev';
var downPageWord ='Next';
&lt;/script&gt;
&lt;script src='http://farhathcool.googlecode.com/svn/trunk/pagenaviv202-min.js' type='text/javascript'&gt;&lt;/script&gt;

*****உங்கள் பிளாக்குக்கு வேண்டிய மாற்றங்கள்****

var postperpage=7;

var numshowpage=4;
  • Postperpage : ஒரு பக்கத்தல் உள்ள Post களின் எண்ணிக்கை
  • numshowpage : எத்தனை இலக்கங்கள்  page Navigation தோன்ற வேண்டும் (4)

படிமுறை - 3

வார்ப்பு நிரலில்
 'data:label.url'
 என்பதை கண்டுபிடித்து அந்த வரிச் சொல்லுக்கு பதிலாக பின்வருவதை பிரதி பண்ணுங்கள்..
'data:label.url + &quot;?&amp;max-results=7&quot;'
* 7 என்பதற்கு பதிலாக ஒரு பக்கத்தல் உள்ள Post களின் எண்ணிக்கையை தரவும் *


Save Template என்பதை கிளிக் செய்து உங்கள் Template ஐ Save செய்து கொள்ளுங்கள்

இப்பொழுது உங்கள் பிளாக்கரில்  அழகிய Numbered page Navigation இணைத்தாகிவிட்டது

****நன்றி - எனது இந்த பதிவு பிடித்திருந்தால் மறக்காமல் ஓட்டு போடவும்****

No comments:

Post a Comment

ஆன்லைன் வயது கால்குலேட்டர்


Udanz