วิธีสร้าง Slider Page Navigation บน Blogger (V.3)

บทความนี้ผมจะแนะนำ Page Navigtion ของ Blogger อีกรูปแบบหนึ่ง ซึ่งเดิมนั้นผมได้เคยแนะนำไปแล้ว 2 เวอร์ชันในบทความ ได้แก่ บทความ การใส่เลขหน้า (Navigation) ให้ Blogger และ Page Navigation ใส่เลขกำกับหน้าบล็อก(V.2)

Page Navigtion ชนิดนี้ พัฒนาโดย Abu Fahan หากคุณต้องการอ่านบทความต้นฉบับสามารถอ่านได้จาก

http://www.abu-farhan.com/2009/12/beautiful-new-page-navi-for-blogger
แต่ในบทความนี้ผมได้ทำการดัดแปลง สคริปต์และปรับแต่ง CSS ให้มีความสวยงามมากขึ้น คุณสามารถดูตัวอย่างการทำงานของ Page Navigtion ชนิดนี้สามารถดูได้จากบล็อกของผมนี่เอง

สอนทำบล็อก

ข้อดีของ Page Navigtion ชนิดนี้

► โหลดได้เร็วกว่า Page Navigtion 2 เวอร์ชันที่แล้ว
► สามารถเลือกอ่านหน้าต่าง ๆ ได้สะดวกขึ้น อิสระมากขึ้น เพราะว่ามี Slider ช่วยในการหาหมายเลขของหน้าด้วย
► เหมาะกับบล็อกที่มีหน้าหลาย ๆ หน้าเพราะค้นหาแต่ละหน้าได้รวดเร็ว


วิธีติดตั้ง

Log in blogger เข้าไปที่  >> ไปที่แผงควบคุม >> รูปแบบ >> แก้ไข HTML >> ขยายแม่แบบเครื่องมือ


สอนทำ blogger

ขั้นที่ 1 ขั้นนี้เป็นการติดตั้ง CSS ซึ่งทำโดย

ค้นหาโค้ด ]]></b:skin> แล้ววางโค้ดต่อไปนี้ก่อนหน้าโค้ดดังกล่าว

.paginator {
font-family: Trebuchet MS;
margin-top:60px;
font-size:1.0 em;
}
.paginator table {
border-collapse:collapse;
table-layout:fixed;
width:100%;
}
.paginator table td {
padding:0;
white-space:nowrap;
text-align:center;
}
.paginator span {
display:block;
padding:3px 0;
color:#fff;
}
.paginator span strong,.paginator span a {
padding:2px 6px;
font-weight:bold;
font-family: Verdana;
}
.paginator span a {
border: 1px solid #707070; /* เส้นขอบสีเทาเข้ม*/
color:#6A6A6A; /* สีลิงก์เลขหน้าสีเทาเข้ม*/
}
.paginator span a:hover{
color:#AD0000;/* ลิงก์สีแดง */
border: 1px solid #AD0000;/* เส้นขอบสีแดง*/
text-decoration:none;
}
.paginator span strong {
background:#666666; /* สีเทาเข้ม */
font-style:normal;
font-weight:bold;color:#ffffff; /* ตัวอักษรสีขาว */
border: 1px solid #ffffff;
background:#666666;/* พื้นหลังหน้าเลขที่เลือกสีเทาเข้ม*/
font-style:normal;
}
.paginator .scroll_bar {
width:100%;   
height:20px;
position:relative;
margin-top:10px;
}
.paginator .scroll_trough {
width:100%;   
height:3px;
background:#E8E8E8;/* เส้นราง slider สีเทาอ่อน */
overflow:hidden;
}
.paginator .scroll_thumb {
position:absolute;
z-index:2;
width:0; height:3px;
top:0; left:0;
font-size:1px;
background:#363636; /* ตัว Sider สีเทาเข้ม*/
}
.paginator .scroll_knob {
position:absolute;
top:-5px; left:50%;
margin-left:-10px;
width:20px; height:20px;
overflow:hidden;
background:url(http://upic.me/i/9a/8knob.gif) no-repeat 50% 50%;
cursor:pointer; cursor:hand;
}
.paginator .current_page_mark {
position:absolute;
z-index:1;
top:0; left:0;
width:0; height:3px;
overflow:hidden;
background:#AD0000; /* ตำแหน่งหน้าที่ถูก mark สีแดงอ่อน */
}
.fullsize .scroll_thumb {
display:none;
}
.paginator_pages {
width:600px;
text-align:right;
font-size:0.8em;
color:#808080;
margin-top:-10px;
}

แนวทางการปรับแต่ง CSS ให้ดูจาก Comment ที่แทรกไว้ในโค้ดด้านบน และดูภาพด้านล่างนี้ประกอบ

วิธีทำ blogger


ขั้นที่ 2 ต่อเนื่องจากขั้นที่ 1 ขั้นนี้เป็นการติดตั้ง Java Script ทำโดย

ค้นหาโค้ด </body> แล้ววางโค้ดต่อไปนี้ก่อนหน้าโค้ดดังกล่าว

<script type='text/javascript'>
//<![CDATA[

var Paginator = function(paginatorHolderId, pagesTotal, pagesSpan, pageCurrent, baseUrl){
	if(!document.getElementById(paginatorHolderId) || !pagesTotal || !pagesSpan) return false;

	this.inputData = {
		paginatorHolderId: paginatorHolderId,
		pagesTotal: pagesTotal,
		pagesSpan: pagesSpan < pagesTotal ? pagesSpan : pagesTotal,
		pageCurrent: pageCurrent,
		baseUrl: baseUrl ? baseUrl : '/pages/'
	};

	this.html = {
		holder: null,

		table: null,
		trPages: null, 
		trScrollBar: null,
		tdsPages: null,

		scrollBar: null,
		scrollThumb: null,
			
		pageCurrentMark: null
	};


	this.prepareHtml();

	this.initScrollThumb();
	this.initPageCurrentMark();
	this.initEvents();

	this.scrollToPageCurrent();
} 

/*
	Set all .html properties (links to dom objects)
*/
Paginator.prototype.prepareHtml = function(){

	this.html.holder = document.getElementById(this.inputData.paginatorHolderId);
	this.html.holder.innerHTML = this.makePagesTableHtml();

	this.html.table = this.html.holder.getElementsByTagName('table')[0];

	var trPages = this.html.table.getElementsByTagName('tr')[0]; 
	this.html.tdsPages = trPages.getElementsByTagName('td');

	this.html.scrollBar = getElementsByClassName(this.html.table, 'div', 'scroll_bar')[0];
	this.html.scrollThumb = getElementsByClassName(this.html.table, 'div', 'scroll_thumb')[0];
	this.html.pageCurrentMark = getElementsByClassName(this.html.table, 'div', 'current_page_mark')[0];

	// hide scrollThumb if there is no scroll (we see all pages at once)
	if(this.inputData.pagesSpan == this.inputData.pagesTotal){
		addClass(this.html.holder, 'fullsize');
	}
}

/*
	Make html for pages (table) 
*/
Paginator.prototype.makePagesTableHtml = function(){
	var tdWidth = (100 / this.inputData.pagesSpan) + '%';

	var html = '' +
	'' +
		'' 
			for (var i=1; i<=this.inputData.pagesSpan; i++){
				html += '';
			}
			html += '' + 
		'' +
		'' +
			'' +
		'' +
	'
' +
'
' +
'
' +
'
' +
'
' +
'
' +
'
' +
'
' +
'
'; return html; } /* Set all needed properties for scrollThumb and it's width */ Paginator.prototype.initScrollThumb = function(){ this.html.scrollThumb.widthMin = '8'; // minimum width of the scrollThumb (px) this.html.scrollThumb.widthPercent = this.inputData.pagesSpan/this.inputData.pagesTotal * 100; this.html.scrollThumb.xPosPageCurrent = (this.inputData.pageCurrent - Math.round(this.inputData.pagesSpan/2))/this.inputData.pagesTotal * this.html.table.offsetWidth; this.html.scrollThumb.xPos = this.html.scrollThumb.xPosPageCurrent; this.html.scrollThumb.xPosMin = 0; this.html.scrollThumb.xPosMax; this.html.scrollThumb.widthActual; this.setScrollThumbWidth(); } Paginator.prototype.setScrollThumbWidth = function(){ // Try to set width in percents this.html.scrollThumb.style.width = this.html.scrollThumb.widthPercent + "%"; // Fix the actual width in px this.html.scrollThumb.widthActual = this.html.scrollThumb.offsetWidth; // If actual width less then minimum which we set if(this.html.scrollThumb.widthActual < this.html.scrollThumb.widthMin){ this.html.scrollThumb.style.width = this.html.scrollThumb.widthMin + 'px'; } this.html.scrollThumb.xPosMax = this.html.table.offsetWidth - this.html.scrollThumb.widthActual; } Paginator.prototype.moveScrollThumb = function(){ this.html.scrollThumb.style.left = this.html.scrollThumb.xPos + "px"; } /* Set all needed properties for pageCurrentMark, it's width and move it */ Paginator.prototype.initPageCurrentMark = function(){ this.html.pageCurrentMark.widthMin = '3'; this.html.pageCurrentMark.widthPercent = 100 / this.inputData.pagesTotal; this.html.pageCurrentMark.widthActual; this.setPageCurrentPointWidth(); this.movePageCurrentPoint(); } Paginator.prototype.setPageCurrentPointWidth = function(){ // Try to set width in percents this.html.pageCurrentMark.style.width = this.html.pageCurrentMark.widthPercent + '%'; // Fix the actual width in px this.html.pageCurrentMark.widthActual = this.html.pageCurrentMark.offsetWidth; // If actual width less then minimum which we set if(this.html.pageCurrentMark.widthActual < this.html.pageCurrentMark.widthMin){ this.html.pageCurrentMark.style.width = this.html.pageCurrentMark.widthMin + 'px'; } } Paginator.prototype.movePageCurrentPoint = function(){ if(this.html.pageCurrentMark.widthActual < this.html.pageCurrentMark.offsetWidth){ this.html.pageCurrentMark.style.left = (this.inputData.pageCurrent - 1)/this.inputData.pagesTotal * this.html.table.offsetWidth - this.html.pageCurrentMark.offsetWidth/2 + "px"; } else { this.html.pageCurrentMark.style.left = (this.inputData.pageCurrent - 1)/this.inputData.pagesTotal * this.html.table.offsetWidth + "px"; } } /* Drag, click and resize events */ Paginator.prototype.initEvents = function(){ var _this = this; this.html.scrollThumb.onmousedown = function(e){ if (!e) var e = window.event; e.cancelBubble = true; if (e.stopPropagation) e.stopPropagation(); var dx = getMousePosition(e).x - this.xPos; document.onmousemove = function(e){ if (!e) var e = window.event; _this.html.scrollThumb.xPos = getMousePosition(e).x - dx; // the first: draw pages, the second: move scrollThumb (it was logically but ie sucks!) _this.moveScrollThumb(); _this.drawPages(); } document.onmouseup = function(){ document.onmousemove = null; _this.enableSelection(); } _this.disableSelection(); } this.html.scrollBar.onmousedown = function(e){ if (!e) var e = window.event; if(matchClass(_this.paginatorBox, 'fullsize')) return; _this.html.scrollThumb.xPos = getMousePosition(e).x - getPageX(_this.html.scrollBar) - _this.html.scrollThumb.offsetWidth/2; _this.moveScrollThumb(); _this.drawPages(); } // Comment the row beneath if you set paginator width fixed addEvent(window, 'resize', function(){Paginator.resizePaginator(_this)}); } /* Redraw current span of pages */ Paginator.prototype.drawPages = function(){ var percentFromLeft = this.html.scrollThumb.xPos/(this.html.table.offsetWidth); var cellFirstValue = Math.round(percentFromLeft * this.inputData.pagesTotal); var html = ""; // drawing pages control the position of the scrollThumb on the edges! if(cellFirstValue < 1){ cellFirstValue = 1; this.html.scrollThumb.xPos = 0; this.moveScrollThumb(); } else if(cellFirstValue >= this.inputData.pagesTotal - this.inputData.pagesSpan) { cellFirstValue = this.inputData.pagesTotal - this.inputData.pagesSpan + 1; this.html.scrollThumb.xPos = this.html.table.offsetWidth - this.html.scrollThumb.offsetWidth; this.moveScrollThumb(); } for(var i=0; i" + cellCurrentValue + "" + ""; } else { html = "" + "" + cellCurrentValue + "" + ""; } this.html.tdsPages[i].innerHTML = html; } } /* Scroll to current page */ Paginator.prototype.scrollToPageCurrent = function(){ this.html.scrollThumb.xPosPageCurrent = (this.inputData.pageCurrent - Math.round(this.inputData.pagesSpan/2))/this.inputData.pagesTotal * this.html.table.offsetWidth; this.html.scrollThumb.xPos = this.html.scrollThumb.xPosPageCurrent; this.moveScrollThumb(); this.drawPages(); } Paginator.prototype.disableSelection = function(){ document.onselectstart = function(){ return false; } this.html.scrollThumb.focus(); } Paginator.prototype.enableSelection = function(){ document.onselectstart = function(){ return true; } } /* Function is used when paginator was resized (window.onresize fires it automatically) Use it when you change paginator with DHTML Do not use it if you set fixed width of paginator */ Paginator.resizePaginator = function (paginatorObj){ paginatorObj.setPageCurrentPointWidth(); paginatorObj.movePageCurrentPoint(); paginatorObj.setScrollThumbWidth(); paginatorObj.scrollToPageCurrent(); } /* Global functions which are used */ function getElementsByClassName(objParentNode, strNodeName, strClassName){ var nodes = objParentNode.getElementsByTagName(strNodeName); if(!strClassName){ return nodes; } var nodesWithClassName = []; for(var i=0; i4; var numshowpage=10; </script> <script type='text/javascript'> //<![CDATA[ eval(function(p,a,c,k,e,r){e=function(c){return(c35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('2 r;2 s;2 m;2 f;Q();n R(S){T=U(S/g)+1;2 I=h.1g("1h-1i");J=\'1y 1z 1A-W\';6(I){I.1B=J}1C=1D 1E(\'V\',T,1F,m,"")}n L(v){2 w=v.w;2 X=U(w.1G$1H.$t,10);R(X)}n Q(){2 4=9;6(4.3("/i/j/")!=-1){6(4.3("?x-5")!=-1){f=4.o(4.3("/i/j/")+14,4.3("?x-5"))}k{f=4.o(4.3("/i/j/")+14,4.3("?&5"))}}6(4.3("?q=")==-1&&4.3(".J")==-1){6(4.3("/i/j/")==-1){s="Y";6(9.3("#p=")!=-1){m=9.o(9.3("#p=")+8,9.Z)}k{m=1}h.11("<7 y=\\""+b+"z/A/B?5-c=1&C=D-E-7&F=L\\"><\\/7>")}k{s="j";6(4.3("&5-c=")==-1){g=1I}6(9.3("#p=")!=-1){m=9.o(9.3("#p=")+8,9.Z)}k{m=1}h.11(\'<7 y="\'+b+\'z/A/B/-/\'+f+\'?C=D-E-7&F=L&5-c=1" ><\\/7>\')}}}n 1J(d){6(d!=1){G=(d-1)*g;r=d;2 H=h.12(\'13\')[0];2 e=h.15(\'7\');e.16=\'17/18\';e.1a("y",b+"z/A/B?1b-1c="+G+"&5-c=1&C=D-E-7&F=M");H.1d(e)}k{l=b;N.u=l}}n 1K(d){6(d!=1){G=(d-1)*g;r=d;2 H=h.12(\'13\')[0];2 e=h.15(\'7\');e.16=\'17/18\';e.1a("y",b+"z/A/B/-/"+f+"?1b-1c="+G+"&5-c=1&C=D-E-7&F=M");H.1d(e)}k{l=b+"i/j/"+f+"?&5-c="+g;N.u=l}}n M(v){O=v.w.1L[0];2 1e=O.1f.$t.o(0,19)+O.1f.$t.o(1M,1N);2 P=1O(1e);6(s=="Y"){2 l=b+"i?x-5="+P+"&5-c="+g+"#p="+r}k{2 l=b+"i/j/"+f+"?x-5="+P+"&5-c="+g+"#p="+r}N.u=l}',62,113,'||var|indexOf|thisUrl|max|if|script||urlactivepage||home_page|results|numberpage|newInclude|lblname1|postperpage|document|search|label|else|alamat|nomerhal|function|substring|PageNo||nopage|jenis||href|root|feed|updated|src|feeds|posts|summary|alt|json|in|callback|jsonstart|nBody|blogPager|html|div|hitungtotaldata|finddatepost|location|post|timestamp|halamanblogger|loophalaman|banyakdata|maksimal|parseInt|paginator1|farhan|totaldata|page|length||write|getElementsByTagName|head||createElement|type|text|javascript||setAttribute|start|index|appendChild|timestamp1|published|getElementById|blog|pager|class|paginator|id|http|www|abu|com|style|font|size|7pt|display|none|target|_blank|Widget|by|Abu|innerHTML|pag1|new|Paginator|numshowpage|openSearch|totalResults|20|redirectpage|redirectlabel|entry|23|29|encodeURIComponent'.split('|'),0,{})) //]]> </script>

การตั้งค่า

► var postperpage=4; หมายถึง จำนวนบทความที่จะแสดงในแต่ละหน้า ในที่นี้ผมตั้งไว้ 4 บทความต่อหนึ่งหน้า
► var numshowpage=10; หมายถึง จำนวนเลขหน้าที่แสดงใน Slider ในที่นี้ผมตั้งไว้ 10 เลขหน้า

คุณสามารถปรับเปลี่ยนตัวเลขที่คุณต้องการได้ตามใจชอบ

 

ขั้นที่ 3 ต่อไปเป็นการตั้งค่าให้ ผลในการแสดงบทความในแต่ละหน้า มีจำนวนเท่ากับ ค่า var postperpage ที่คุณตั้งไว้ในขั้นที่ 2

ซึ่งทำโดยค้นหาโค้ด 'data:label.url' (อย่าลืมขยายแม่แบบเครื่องมือก่อน) เมื่อพบแล้วให้แทนที่ด้วยโค้ดต่อไปนี้
'data:label.url + &quot;?&amp;max-results=4&quot;'
ซึ่งตัวเลข 4 คือค่าของ var postperpage ในขั้นที่ 2


ดังนั้นหากในขั้นที่ 2 คุณตั้งค่า var postperpage=6; คุณก็จะต้องใช้โค้ด
'data:label.url + &quot;?&amp;max-results=6&quot;'
เป็นต้น


ขั้นที่ 4 เมื่อจบขั้นที่ 3 แล้วให้บันทึกแม่แบบ และในขั้นนี้เป็นการทำให้หน้าแรกแสดงจำนวนบทความเท่ากับหน้าอื่น ๆ ทำได้โดย

ไปที่แผงควบคุม >> การตั้งค่า >> การจัดรูปแบบ >> แล้วตั้งค่าให้แสดงบทความในหน้าหลักให้เท่ากับค่า var postperpage ที่ตั้งไว้ ซึ่งในบทความนี้คือ 4 บทความ

 สอนแต่งบล็อก

เมื่อจบ 4 ขั้นตอนคุณก็จะได้ Page Navigation บน Blogger ของคุณแล้ว  สำหรับบทความต่อไปผมจะนำเสนอ Page Navigation อีกชนิดหนึ่งซึ่งในการเปิดหน้าต่าง ๆ นั้นจะใช้วิธี Input เลขหน้าที่ต้องการได้ อย่าลืมติดตามอ่านต่อครับ

และถ้าหากคุณชอบบทความนี้ หรือเห็นว่ามีประโยชน์กับเพื่อน ๆ ของคุณ ก็ช่วย Submit หรือบอกต่อ ๆ กันด้วยนะครับ
(กรุณาอย่าลอกบทความของผม โดยเฉพาะเจ้าของบล็อก ThaiEditblog)

Credit: Abu Fahan

ตอนนี้มีความคิดเห็น : 22 ความคิดเห็น
หากคุณมีปัญหาหรือข้อสงสัยใดๆ สามารถสอบถามได้จากกล่อง comment ด้านล่างนี้ได้เลยครับ

  1. ขอโทษครับ ไม่เกี่ยวกับบทความนะครับ
    ผมเป็นมือใหม่ หัดใช้ รบกวนสอบถามหน่อยครับ
    คือผมสงสัยว่าผมจะหาเพื่อน (ผู้ทำบล็อกใน Blogger) ได้ยังไงครับ
    เช่นผมทำบล็อกเกี่ยวกับภาพยนตร์ และนิยาย ผมอยากหาคนที่สนใจแนว ๆ เดียวกันเพื่อ add ไว้เป็น friend blog แต่ไม่รู้จะไปหาได้จากที่ไหนน่ะครับ
    เพราะเวลาเข้า www.blogger.com มันก็มีแต่หน้าให้ล็อกอินเข้าบล็อกตัวเองเท่านั้น
    ยังไม่ค่อยเข้าใจน่ะครับ
    รบกวนถามผู้มีประสบการณ์หน่อยครับ
    ขอบคุณครับ

  1. @moviefic

    คุณควรเข้าร่วม Blodirectory ครับ แล้วหาเพื่อนจากในนั้น

    อ่านบทความนี้ครับ : http://hackublog.blogspot.com/2010/02/3.html

    ลองดูตัวอย่างการสมัคร(บางแห่ง) ที่บทความด้านล่างครับ :
    http://hackublog.blogspot.com/2010/02/networkedblogs-facebook.html

    ส่วนใหญ่จะเป็นต่างชาตินะครับ แต่ถ้าต้องการคนไทย แนะนำให้สมัครเป็นสมาชิกตามเว็บบอร์ดจะดีกว่าครับ

  1. ขอบคุณที่มาตอบครับ กำลังตามไปอ่านที่ลิงค์ครับ

  1. ไม่รู้ว่าทำผิดตรงไหนนะคะ่ ยากมากๆเลย อ่ะ แงๆๆ

  1. @ ChatTar
    ถ้าในบล็อกมีบทความน้อย ไม่ถึง 10 หน้า ควรตั้งค่า var numshowpage ในขั้นที่ 2 ให้เท่ากับจำนวนหน้าที่มีครับ เช่นถ้ามี 2 หน้าก็ตั้งค่าเป็น var numshowpage=2;

  1. ชอบจังเลยคะ...ตามมาจาก facebookคะ เห็นว่าเกี่ยวกับ page navigationก็เลยแวะมาเอาความรู้ แต่ว่ายังไม่ได้เริ่มทำเลยคะ เพราะกำลังขยันเขียนบทความอยู่ blogของมดมันไม่ค่อยได้เรื่องและสวยงามเหมือนของคุณ มือใหม่คะ...

  1. @Maliwan : ค่อย ๆ ทดลองทำไปเรื่อย ๆ เดี๋ยวก็เก่งครับ ถ้ากลัวว่าเปลี่ยนไปเปลี่ยนมาแล้วจะเกิดความผิดพลาดก็ Backup ข้อมูลเอาไว้ก่อน เท่านี้เราก็ปรับเปลี่ยนอะไรต่าง ๆ ได้ตามใจครับ

  1. ขอคุณมากครับ หามานานแล้ววิธีทำ เนวิเกเตอร์บาร์ เจ๋งมากครับ : )

  1. มือใหม่หัดทำเหมือนกัน ทำแบบงูๆปลาๆอ่ะคับ เข้ามาเอาความรุ้ในนี้บ่อยอ่ะคับ ผมกะว่าจะทำ blog หารายได้เสริมเกี่ยวกับ affiliate คับ ผิดพลาดอันใดช่วยแนะนำด้วยนะคับ

  1. @ namo : พยายามเรียนรู้ให้มากที่สุด และเรียนรู้ทุกวัน และเลือกแนวทางที่ตัวเองถนัดครับ บางอย่างที่สอน ๆ หรือแจก ๆ กัน เราไม่ต้องทำทุกอย่างก็ได้ เลือกทำเฉพาะที่สำคัญ ๆ เท่านั้น ที่สำคัญใจต้องสู้

  1. มีวิธีปรับเส้นรางสีเทาเข้มให้สั้นลงมั้ยคะ มันยาวเกินไป

  1. @ bebetalala : ความยาวหรือสั้นขึ้นอยู่กับจำนวนของหน้าที่มีครับ มันถูกสั่งด้วยจาวาสคริปต์

  1. ขอบคุนคับ ดีมากเลย ช่วยได้เยอะ

  1. แหล่มเลยครับพี่น้อง

  1. ตอนนี้จาวาสคริปต์มีปัญหาให้แก้สคริปต์ที่ใช้อยู่ หรือคนที่จะทำตามบทความนี้โดย

    แก้จาก

    <script src='http://hackublog.googlecode.com/files/paginator3000-hackublog.js' type='text/javascript'/>
    <script type='text/javascript'>
    var home_page=&quot;/&quot;;
    var urlactivepage=location.href;
    var postperpage=4;
    var numshowpage=10;
    </script>
    <script src='http://hackublog.googlecode.com/files/paginator3000-Hackublog-v1.0.0.js' type='text/javascript'/>

    เป็น

    <script src='http://sites.google.com/site/siiamtravel/home/server/paginator3000-hackublog.txt' type='text/javascript'/>
    <script type='text/javascript'>
    var home_page=&quot;/&quot;;
    var urlactivepage=location.href;
    var postperpage=4;
    var numshowpage=10;
    </script>
    <script src='http://sites.google.com/site/siiamtravel/home/server/paginator3000-Hackublog-v1.0.0.txt' type='text/javascript'/>

  1. ทำไม่ได้ครับ

  1. ผมอยากเรียนรู้การเขียนบล็อก อะครับ รบกวนใครรู้เทคนิคดีช่วยแนะนำด้วยนะครับ

  1. ทำไม่ได้ คนอื่นอย่าเสียเวลาทำตามเลยครับ

    -จบข่าว-

  1. งงครับแต่จะพยายามต่อไป^___^

  1. อ้าวกำ ว่าจะทำซะหน่อย

  1. ทำตามแล้ว เหมือนเดิมไม่มีไรเปลี่ยนเลยฮะ

แสดงความคิดเห็น

ถ้าต้องการโพส HTML ให้แปลงโค้ดที่เครื่องมือด้านล่างนี้ก่อนครับ

สร้างบล็อก Facebook SEO บล็อก Linkwheel iMacros Link Wheel