Hôm nay mình sẽ giới thiệu cho các bạn thêm một mẫu slider mới. Dạng này thích hợp với các blog phim, ảnh,... Về cơ bản nó tương tự như bài này. Được phát triển bởi maskolis. bạn có thể xem ảnh hoặc Demo.
VIEW DEMO
¤ Thêm Simple Slider bài mới trượt cho blogspot ves3 cho blogger!
1- Đăng nhập vào blog2- Chọn Mẫu (Template)
3- Chọn chỉnh sủa HTML (Edit HTML)
4- Dán code sau trước thẻ ]]></b:skin> :
/* Slider */ .sompret-wrapper {float:right; position: relative;} .sompret { overflow: hidden; position: relative; width:300px; height:400px;} .image_reel { position: absolute; top: 0; left: 0; } .image_reel img {overflow: hidden;float: left;width:300px; height:auto;} .paging {background:#878773; border:1px solid #676756;padding: 4px 0 2px; text-align: right;z-index: 100; } .paging a { text-indent:-9999px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHVopEjQOYP-0iUCPlCws2SX0yoytI7P08xGCFn8ClnuvFe1h1oBbapMcp2fOz297QjPHQEBH7Z8kEZgqjh_mzws-vI2BfmcnF6SePdrvlP1f1nTzLRhi4pwntCloylnRgDeChGs4FFmp5/s1600/slider_item_namkna-blogspot-com.png) no-repeat center; width:10px; height:10px; display:inline-block;margin:3px; border:none; outline:none; } .paging a.active { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGkG5z3iokoxU1-ELhBCX5xiEHMpv5xlikvNB_dOjEJ3CymMpLg9PofOGzL6lW2ZIizjTGYLN6a4LPtl70y2QZ9IPy7jKdWWswsxFPktdJjqivbhNx96JqpNMDJTfnjYz32rF4K2J2kF6M/s1600/slider_item_active_namkna-blogspot-com.png) no-repeat center; border:none; outline:none;} .paging a:hover {font-weight: bold; border:none; outline:none;} .crott { width:280px; display: none; position:absolute;bottom: 0; left: 0; z-index: 101; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_MzSgEqODbXam_M2gD8CCj722bfUgarc42cQrZFjxpIVyx_YJTyRdZqL1IXCyRBzFXnftfCF8L6QjgknRpvBhTUdaJrCIaNCk9_RtElwTlxw7PGatKCgZ-zrU9JjkUl8LUTcxyxubeOvK/s1600/uj-opacity-40_namkna-blogspot-com.png);padding:5px 10px; } .crott a{color: #fff;font: 16px Oswald } .crott p{color: #fff;font: 12px Arial;}
5- Dán code bên dưới trước thẻ </head>:
<script src='http://code.jquery.com/jquery-1.8.3.js' type='text/javascript'/> <script type='text/javascript'> //<![CDATA[ jQuery(document).ready(function() { //Set Default State of each portfolio piece $(".paging").show(); $(".paging a:first").addClass("active"); //Get size of images, how many there are, then determin the size of the image reel. var imageWidth = $(".sompret").width(); var imageSum = $(".image_reel img").size(); var imageReelWidth = imageWidth * imageSum; //Adjust the image reel to its new size $(".image_reel").css({'width' : imageReelWidth}); //Paging + Slider Function rotate = function(){ var triggerID = $active.attr("rel") - 1; //Get number of times to slide var image_reelPosition = triggerID * imageWidth; //Determines the distance the image reel needs to slide $(".paging a").removeClass('active'); //Remove all active class $active.addClass('active'); //Add active class (the $active is declared in the rotateSwitch function) $(".crott").stop(true,true).slideUp('slow'); $(".crott").eq( $('.paging a.active').attr("rel") - 1 ).slideDown("slow"); //Slider Animation $(".image_reel").animate({ left: -image_reelPosition }, 500 ); }; //Rotation + Timing Event rotateSwitch = function(){ $(".crott").eq( $('.paging a.active').attr("rel") - 1 ).slideDown("slow"); play = setInterval(function(){ //Set timer - this will repeat itself every 3 seconds $active = $('.paging a.active').next(); if ( $active.length === 0) { //If paging reaches the end... $active = $('.paging a:first'); //go back to first } rotate(); //Trigger the paging and slider function }, 10000); //Timer speed in milliseconds (3 seconds) }; rotateSwitch(); //Run function on launch //On Click $(".paging a").click(function() { $active = $(this); //Activate the clicked paging //Reset Timer clearInterval(play); //Stop the rotation rotate(); //Trigger rotation immediately rotateSwitch(); // Resume rotation return false; //Prevent browser jump to link anchor }); }); //]]> </script> <script type='text/javascript'> //<![CDATA[ imgr = new Array(); imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6e-ZwvQWlOhfrqCYGl388ei2jZHpeSk9YN0S_W4fwN78BZ1WMGxD_iAlHa1_Gz1rkzTApC24TBuiD5CL0l7a42viKbTQjLjoX1k2fr19SSMyKiz6zrfdLXDqEiK0YqQYfR5zCLT74QSmT/s1600/no+image-namkna-blogspot-com.jpg"; showRandomImg = true; aBold = true; summaryPost1 = 80; summaryTitle = 20; numposts1 = 6; function removeHtmlTag(strx,chop){ var s = strx.split("<"); for(var i=0;i<s.length;i++){ if(s[i].indexOf(">")!=-1){ s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length); } } s = s.join(""); s = s.substring(0,chop-1); return s; } function showrecentposts1(json) { j = (showRandomImg) ? Math.floor((imgr.length+1)*Math.random()) : 0; img = new Array(); for (var i = 0; i < numposts1; i++) { var entry = json.feed.entry[i]; var posttitle = entry.title.$t; var pcm; var posturl; if (i == json.feed.entry.length) break; for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'alternate') { posturl = entry.link[k].href; break; } } for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'replies' && entry.link[k].type == 'text/html') { pcm = entry.link[k].title.split(" ")[0]; break; } } if ("content" in entry) { var postcontent = entry.content.$t;} else if ("summary" in entry) { var postcontent = entry.summary.$t;} else var postcontent = ""; postdate = entry.published.$t; if(j>imgr.length-1) j=0; img[i] = imgr[j]; s = postcontent ; a = s.indexOf("<img"); b = s.indexOf("src=\"",a); c = s.indexOf("\"",b+5); d = s.substr(b+5,c-b-5); if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")) img[i] = d; //cmtext = (text != 'no') ? '<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>' : ''; var month = [1,2,3,4,5,6,7,8,9,10,11,12]; var month2 = ["January","February","March","April","May","June","July","August","September","October","November","December"]; var day = postdate.split("-")[2].substring(0,2); var m = postdate.split("-")[1]; var y = postdate.split("-")[0]; for(var u2=0;u2<month.length;u2++){ if(parseInt(m)==month[u2]) { m = month2[u2] ; break; } } var daystr = m+ ' ' + day + ' ' + y ; var trtd = '<div class="crott"><a href="'+posturl+'">'+posttitle+'</a><p>'+removeHtmlTag(postcontent,summaryPost1)+'... </p></div>'; document.write(trtd); j++; } } function showrecentposts2(json) { j = (showRandomImg) ? Math.floor((imgr.length+1)*Math.random()) : 0; img = new Array(); for (var i = 0; i < numposts1 ; i++) { var entry = json.feed.entry[i]; var posttitle = entry.title.$t; var pcm; var posturl; if (i == json.feed.entry.length) break; for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'alternate') { posturl = entry.link[k].href; break; } } for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'replies' && entry.link[k].type == 'text/html') { pcm = entry.link[k].title.split(" ")[0]; break; } } if ("content" in entry) { var postcontent = entry.content.$t;} else if ("summary" in entry) { var postcontent = entry.summary.$t;} else var postcontent = ""; postdate = entry.published.$t; if(j>imgr.length-1) j=0; img[i] = imgr[j]; s = postcontent ; a = s.indexOf("<img"); b = s.indexOf("src=\"",a); c = s.indexOf("\"",b+5); d = s.substr(b+5,c-b-5); if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")) img[i] = d; //cmtext = (text != 'no') ? '<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>' : ''; var month = [1,2,3,4,5,6,7,8,9,10,11,12]; var month2 = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]; var day = postdate.split("-")[2].substring(0,2); var m = postdate.split("-")[1]; var y = postdate.split("-")[0]; for(var u2=0;u2<month.length;u2++){ if(parseInt(m)==month[u2]) { m = month2[u2] ; break; } } var daystr = day+ ' ' + m + ' ' + y ; var trtd = '<a href="'+posturl+'"><img src="'+img[i]+'"/></a>'; document.write(trtd); j++; } } //]]> </script>
» Tùy chỉnh:
- summaryPost1 = 80; Là số ký tự mô tả khi dê chuột vào ảnh hoặc tiêu đề.
- summaryTitle = 20; Là số ký tự tiêu đề tối đa hiển thị trên slider. bạn nên để vừa phải không nên quá nhiều ký tự sẽ làm sấu slider.
- numposts1 = 6; là số bài viết hoặc ảnh thumbnail sẽ hiển thị trên slider. bạn không nên cho quá nhiều sẽ ảnh hưởng tới tốc độ load.
- Xóa màu xanh nếu đã có jquery
<div id='main-wrapper'>- Dán vào trước nó đoạn code bên dưới:
<b:if cond='data:blog.pageType == "item"'> <div class='sompret-wrapper'> <div class='sompret'> <div class='image_reel'> <script> document.write("<script src=\"/feeds/posts/default?max-results="+numposts1+"&orderby=published&alt=json-in-script&callback=showrecentposts2\"><\/script>"); </script></div> <div class='description'> <script> document.write("<script src=\"/feeds/posts/default?max-results="+numposts1+"&orderby=published&alt=json-in-script&callback=showrecentposts1\"><\/script>"); </script> </div> </div> <div class='paging'> <a href='#' rel='1'/> <a href='#' rel='2'/> <a href='#' rel='3'/> <a href='#' rel='4'/> <a href='#' rel='5'/> <a href='#' rel='6'/> </div> </div> </b:if>
» Tùy chỉnh:
- Nếu muốn tiện ích hiện ở cả trang chủ thì hãy xóa bỏ phần màu vàng đi.
- Phần này mình để lấu tất cả các bài viết thuộc các nhãn khác nhau. nếu muốn hiện theo một nhãn nhất định thì thêm phần /-/Tên nhãn vào sau default
7- Lưu mẫu lại và xem kết quả.
Nhận xét
bài này hay quá bạn cảm ơn nhé
Trả lờiXóaRất vui vì bạn thích nó :)
XóaNhận xét này đã bị tác giả xóa.
Trả lờiXóaa nam ơi vào chek mail đi , rồi e mời a làm quản trị , và nhờ a chỉnh sửa giúp e nhé
Trả lờiXóaOke để anh check ngay. :)
Xóasao chưa thấy a check mail vậy
Trả lờiXóaAnh đã check rùi mà.
XóaAnh Nam vào blog này. xem có cách nào giúp cái bài đăng không có hình ảnh, hiển thị một hình ảnh mặc định thế này được không (Hiển thị trên trang chủ )
Trả lờiXóahttp://tt-test-blog.blogspot.com/
Link ảnh để làm ảnh mặc định hiển thị trên trang chủ:
http://3.bp.blogspot.com/-PpjfsStySz0/UF91FE7rxfI/AAAAAAAACl8/092MmUHSFQ0/s1600/no_image.jpg
File scrip đó không có chức năng thay thế ảnh thum. Em hãy Remover nó đi và thay thế nó thành một trong các thủ thuât sau:
Xóahttp://namkna.blogspot.com/search/label/Blogspot%20Readmore
Nhận xét này đã bị quản trị viên blog xóa.
Trả lờiXóaNhận xét này đã bị quản trị viên blog xóa.
Trả lờiXóaMấy template Johny cái nào cũng đỉnh, hình như bác lấy từ template nó ra để có thủ thuật này đúng ko :D
Trả lờiXóaMà ko biết có cách nào làm cho slide này tự chạy, và có thể tùy chỉnh kích thức cho slide theo hình chữ nhật nằm ngang giống như mấy slider bt đc ko nhỉ? :D
Hehe, cuối cùng mình cũng đã chèn slide theo đúng ý mình rồi :D http://cover.vietdesigner.net/
XóaChỉ cần chỉnh lại các phần màu đỏ và xanh là được :)
XóaNhận xét này đã bị tác giả xóa.
Trả lờiXóa@Phạm Hữu Dư: rất tiếc cooment của bạn bí xóa do spamlink.
XóaBạn Namkna có cách nào tạo recent post như hình này không..rất hay đó..
Trả lờiXóahttp://2.bp.blogspot.com/-eCP7LuYhk2c/Ua3tt1JAZwI/AAAAAAAAIqI/qKnr5Qq45rc/s1600/Sam.jpg
Demo:
http://phim.clip.vn/watch/Pokemon-Season-8-412,ONqW/20818
Để mình thử coi sao đã :))
XóaAnh ơi sao cái slide của em tự nhiên nó lại không có hình đại diện thế hả anh? Mấy hôm trước vẫn tự lấy hình được cơ mà. Anh xem lại giúp em với :D
Trả lờiXóahttp://www.kenh22.net
Em lưu ý tiện ích lấy ảnh từ Album Picasa của google hoặc ảnh em upload trực tiếp lên blog nha. Với những ảnh Upload trên host khác sẽ không lấy được đâu.
XóaThêm nữa ảnh đó phải ở trước dấu ngắt nếu em dùng dấu ngắt readmore
Hì hì. Tại hôm qua em để Nguồn cấp dữ liệu trang web ngắn nên hnay nó không hiển thị. Dạo này mấy trang chuyên lấy bài của site khác làm thất thoát khá nhiều view. Haiz... Chẳng biết bgiờ blogspot với ngăn tình trạng này đây. Cứ đăng bài một cái là y như rằng hai trang kia có luôn
XóaEm để ngắn cũng được nhưng khi đăng bài hãy để một hình ảnh trước dấu ngắt <!--more--> là được.
XóaVề vấn đề sao chéo mình không cấm được em ak. Phương pháp dấu ngắt có thể ngăn cản người ta lấy một lượng lớn duc liệu, Tuy nhiên họ vẫn có thể lấy bằng cách copy từng bài một :) tất cả các nền tảng khác cũng thế thôi. ta chỉ có thể đăng ký DCMA để ngăn chặn copy. Tuy nhiên hình thức DCMA cũng không mấy khả quan nếu bài viết bị xào nấu lại hết nội dung.
XóaỞ bước 6, mình ko muốn đặt trong main-wrapper mà muốn tạo 1 wiget HTML bên sidebar thì làm sao được Nam? Mình làm thử nhưng nó ko có hiện ra???? Giúp mình thử nhé! Thanks
Trả lờiXóaSau 1 hồi mày mò thành công đặt bên sidebar, mình có phát hiện 2 lỗi sau (Dựa trên web của mình, còn web người khác chưa biết.^^):
Trả lờiXóaThứ 1: Phần css có đoạn ".crott {width:288px; ....}" thì phải chỉnh sửa vị trí thủ công theo vị trí đặt slider này. Cụ thể là phải chỉnh phần này: "bottom: 0; left: 0; z-index: 101;". Mới vào là phần này nó nằm tít bên trái website.:((. Như vậy mắc công quá!!!! Có cách nào nó tự auto luôn ko?
Thứ 2: Khi ở ngoài trang chủ thì phần "srott" này sẽ hiện lên summaryPost & summaryTitle, nhưng sao khi mình click vào bài để xem thì slider chỉ trượt hình nagng thôi chứ ko hiện lên summaryPost & summaryTitle nữa. Mình đã thử xem trong trang chuyên mục hoặc trang bải viết thì nó bị thế??? Nhảy ra ngoài trang chủ thì slider hoạt động bình thường. Ko biết có bạn nào bị trường hợp giống web mình ko nhỉ?
Hiện mình đang thử nghiệm demo trong link: http://nhapblogdau365.blogspot.com.
Có gì Nam vào xem giúp với (Ngay chỗ wiget Món ngon - Vào bếp).
Thanks
Như thế là hiển thị dduwwocj rồi nhưng phần mô tả của bạn lẹc rùi.
Xóawidth:288px; độ rộng của slider thường nhỏ hơn phần width:300px; vì thuopocj tính padding là 10px.
z-index: 101; mức dộ ưu tiên hiển thị ảnh so với nút chuyển giữa các slider.
bottom: 0; vị trí của slider so với viền dưới của sidebar (cái này phải chỉnh lại).
left: 0; vị trí của slider so với viền trái của sidebar.
Mình đang thắc mắc sửa cho cái phần lỡi thứ 2 ấy. Nam check xem thử từ trang chủ và click vào trang bài viết sẽ thấy bị mắc lỗi cho phần mô tả.
Trả lờiXóaOke để mình check.
XóaGiúp mình tìm ra cái lỗi thứ 2 giùm mình chưa Nam? Mong hồi âm. Thanks
XóaBạn gửi cái template đó vào tavannam01@gmail.com để mình thêm trực tiếp cho nha.
XóaNhận xét này đã bị tác giả xóa.
Trả lờiXóaNhận xét này đã bị tác giả xóa.
Trả lờiXóaBạn hãy tải nó theo link sau sẽ có phần code .xml để thêm nha: TẢI NGAY
Xóacảm ơn bạn nhiều mình đã làm đc rồi,cảm ơn nhiều nhé
Trả lờiXóaKhông có gi
Xóamình muốn hiện ở trang chủ không hiện ở sidebar thì mình thay sompret-wrapper thành main-wrapper sao lại không được nhỉ
Trả lờiXóabạn xem bài này: XEM NGAY
Xóamình đã làm được rồi,không biết nói gì ,chỉ biết nói 2 chữ CẢM ƠN .
XóaKhông có gì đâu bạn ak.
XóaSao mình không tìm thấy dòng < div id = " main-wrapper " >
Trả lờiXóaBlog mình là Tên
Để lại URL blog của bạn mình sẽ chỉ đoạn códe cho.
Xóablog là kenhtrasua.com nhé. Tìm mãi không thấy. Bực thật
XóaDòng này:
Xóa<div id='main-wrapper'>
Cô rất thích bài này và cô sẽ thực hành . NK cho cô hỏi . anh trượt ở đây là ảnh của bài đăng à. có thể thay linh ảnh không phải ảnh trong bài đăng vào không?
Trả lờiXóajquery là gì cô không hiểu nhờ cháu chỉ giúp nhé. chờ tin cháu..?
< div id = " main-wrapper " > cô không tìm được đoạn code này . và URL của blog là gi?
Trả lờiXóaVâng có gì cô cứ hỏi cháu.
Xóa- jquery hiện nay có rất nhiều định nghĩa khác nhau nhưng hiểu theo một cách dân dã nó là nền tảng để mình thiết kế các hiệu ứng các giao diện, nó giúp các hiệu ưng mượt mà hơn và một số trường hợp còn góp phần tăng tốc cả trang web nếu sử dụng hợp lý. ví dụ như trong một chiếc áo nó chính là những sợi vải.' Hiện nay trên mạng có rất nhiều bài viết về jquery cô có thể tìm đọc đó ak.
- Với blog thienduong9190 của cô thì cô tìm 1 trong 2 đoạn sau:
<div class='main-outer'>
hoặc
<div class='tabs-cap-bottom cap-bottom'>
cháu à . làm sao đặt được ảnh chiếu vào vị trí như ý muốn . cháu xem giúp cô xem , ở blog thiên đường như vậy thì ko hay chut nào ?
Trả lờiXóaMình chuyển nó đến các phần mà mình muốn vấn đề bậy giờ là cô muốn đặt nó ở đâu cô cứ nói cháu chỉ vị trí cho :))
XóaChau chỉ giúp cô , cô muốn thu nhỏ chiều cao và chiều rộng ảnh, đặt vào góc trên cùng ở cột bên phải cháu ạ . cô làm phiền cháu nhiều quá . cô xin lỗi và cảm ơn cháu nhé
Trả lờiXóaVầng lát nữa cháu sẽ chỉnh nó cho cô. :))
Xóacháu có vào chỉnh giúp cô thì cháu cho sider hiện ở trang chủ thôi nhé cảm ơn cháu nhiều
Xóasider ảnh trong blog ảnh cô muốn cho ảnh vào thì phải làm sao cháu nhỉ
Trả lờiXóaNam ạ cô sửa được rồi .nhưng bây giờ cô muốn cho slieder chỉ chạy ở trang chủ thôi thò sửa thế nào . và cách đặt vị trie slider nữa nam bảo nốt cho cô nhé?
Trả lờiXóaCháu có thể giúp cô về vấn đề này. Cô có thể thao tác như sau:
Xóa-Tại Bước 6 của bài viết này cô để ý đoạn code được tô màu vàng thứ nhất
<b:if cond='data:blog.pageType == "item"'>
-Cô thay thế bằng đoạn code sau
<b:if cond='data:blog.url == data:blog.homepageUrl'>
Ngoài ra cô có thể xem thêm các điều kiện để ẩn/hiện một widget trên blog tại bài viết này. Chúc cô thành công!
Cô cảm ơn cháu nhé Huy co vip cô sẽ làm thử xem sao nhé
XóaĐoạn code màu vàng đó cô đã cắt đi . cô thay bàng đoạn code của cháu vào máy ko chịu lưu cháu ạ? là sao nhỉ . cô nhờ cháu bảo giúp
XóaVâng nhưng đoạn code màu vàng thứ hai (</b:if>) cô vẫn phải giữ nguyên không bỏ mới được
Xóamình vẫn để () mình vẫn để mà có cắt đi đâu?
XóaCó thể cô đã xóa nhầm một thẻ DIV nên nó không lưu được. Cô làm lại như HUy nói nha cô.
XóaCô tìm đoạn:
<b:if cond='data:blog.pageType == "item"'>
-Cô thay thế bằng đoạn code sau
<b:if cond='data:blog.url == data:blog.homepageUrl'>
Cảm ơn bạn mình làm được rồi lần trước mình xóa cả thẻ nên ko được
Xóaà còn có thê sửa sao cho thứ tự ảnh , không quay lộn lại được không?
Trả lờiXóaHihi cháu xin lỗi cô./. Mấy hôm nay cháu bận quá giờ mới trả lời cô được
XóaCô chỉ cần sửa đoạn
aBold = true;
thành:
aBold = false;
Cô lại nhờ cháu chỉ giúp cô xem cô muốn định vị sleder này thì làm thế nào ? cô tháy bài này hay hơn bài cháu làm cho cô trong blog ảnh . vì loại đó là ảnh cố định . còn bài này . ảnh thay đổi theo bài mới phải không ?. cháu bảo cô cách cho thêm ảnh vào slider cháu làm cho cô ấy . co trong blog ảnh nhé. cô thấy chỉ có 3 ảnh thì chán quá . cô làm trong blog Vân anh đó , nhưng chỉ có 3 ảnh . cô chưa biết làm sao để cho thêm ảnh.
Trả lờiXóaCô làm cháu mất thời gian với cô rồi . cảm ơn cháu nhiều nhé
Đúng vậy code bài này hoàn toàn tự động cô ajk. Với blog của cô có thuộc tính posible trên sidebar nên khi chuyển nó lên đó các ảnh sẽ bị ẩn đi.
XóaCách thêm ảnh cháu đã trả lời cô trong bài viết này đó cô:
http://namkna.blogspot.com/2013/03/css3-image-slider-for-blogger-ves-2.html
Nhận xét này đã bị quản trị viên blog xóa.
Trả lờiXóaCháu vẫn chưa chỉ bảo giúp cô định vị sleder ảnh bài viết này. cháu xem blog thiên đường của cô , cô đã chỉnh kích thước slider . nhưng cô muốn cho nó ở góc bên phải trên cùng của cột bên phải blog. hiện tại chỗ đó để trống không thể để cái gì vào đó được. mà cô mở kích thước slider cho dài bằng chiều dài blog , nó vẫn không lui vào vị trí trống này , nó lại lệch hăn sang trái cháu ạ.
Trả lờiXóaCô muốn sleder chỉ chạy trên trang chủ thôi thì làm sao Nam Kha ơi?
Trả lờiXóaCô đặt trước đoạn nha:
Xóa<div class="sidebar section" id="sidebar-right-1">
Chỉ hiện trang chủ cô thay đoạn:
<b:if cond='data:blog.pageType == "item"'>
thành:
<b:if cond='data:blog.url == data:blog.homepageUrl'>
Anh ơi cho em hỏi là nếu mình muốn đặt nó ở những vị trí khác nhau thì mình phải làm như thế nào hả anh? Cám ơn anh ạ!
Trả lờiXóaCô đặt trước đoạn nha:
Trả lờiXóaLà đặt cái gì trước đoạn hả Nam Kha..?Cô thây đoạn code để slider chỉ hienj ở trang chủ mà máy ko lưu cháu ạ
Cháu bảo giúp cô định vị slider nhé nam kha . cảm ơn cháu
Trả lờiXóaCHắc namkna bận sao ý. Cô và bạn thử cho code ở bước 6 vào tiện ích HTML/?javarscript và di chuyển đến vị trí cô muon thôi a.
Trả lờiXóaCháu quyên không nhắc là cô hãy bỏ đoạn màu vàng đi cô ak.
Xóacô chỉ cho slider chạy ở trang chủ nên cô cặt đoạn màu vàng cháu ạ . cảm ơn cháu
Xóacô cho đoạn code ở bước 6 vào tiện ích HTML/?javarscript ảnh lại không hiện cháu ạ chán quá cô ko biết làm thế nào nữa?
XóaCô sửa đoạn sau:
Xóa.image_reel img {overflow: hidden;float: left;width:300px; height:auto;}
thành:
.image_reel img {overflow: hidden;float: left;width:300px; height:auto;z-index:9000}
và lưu lại coi sao nha cô.
vào cô sửa đoạn bên dưới để chỉnh lại vị trí ảnh nha:
bottom: 0; left: 0; z-index: 101;
Đoạn
Xóabottom: 0; left: 0; z-index: 101;
nếu sửa cô phải thêm thuộc tính px như bên dưới nha cô:
bottom: 100px; left: 100px; z-index: 101;
cảm ơn chau? cháu đi đâu vắng nhà lâu vậy? cô sẽ làm theo hướng dẫn của cháu. có gì cô hồi âm lại cháu nhé
Trả lờiXóaHì hì mấy hôm nay cháu phải đi công tác nên không lên mạng được thường xuyên, hy vọng cô và mọi người không giận :)
Xóacô làm không được Nam Kha ạ ?
Trả lờiXóamấy comments Nk bảo cô đánh bóng chữ ở chỗ nào mà cô tìm lại mãi không thấy . Chau cho cô xin linh bài này cháu nhé
Trả lờiXóaMấy comment đó cháu cũng ko rõ bài nào nữa cô ak. Nhưng cố có thể xem bài viết này nha cô. XEM NGAY
XóaMình muốn ứng dụng tiện ích này làm recent post ở khung giữa và chỉ hiện ở trang chủ thì làm thế nào vậy Namkna!
Trả lờiXóaChỉ hiện ở trang chủ thì bạn thay đoạn:
Xóa<b:if cond='data:blog.pageType == "item"'>
thành:
<b:if cond='data:blog.url == data:blog.homepageUrl'>
Muons hiện ở khung giữa thì hãy thêm bước 6 vào HTML và kéo nó đến vị trí bạn muốn nha,
Mình đưa vào dùng thì cái widget VIDEO CATEGORY của mình ở mẫu mà mình dùng, các hình nó ko nằm trong 1 ô nữa mà nó rời ra và nẳm thứ tự từ trên xuống dưới! Hình như code của Namkna mình đưa vào có xung khắc với mẫu có sẵn mà mình đang dùng. Mình cũng đã thử bỏ code jquery trong code Namkna đưa rồi mà vẫn bị lỗi. Có cách nào khắc phục ko vậy nhỉ!
Trả lờiXóaVới lại nhân tiện nhờ Namkna giúp giùm! Cái template của mình đang dùng như Namkna biết là 1 template miễn phí trên mạng, và cái vị trí mà mình đang dùng tiện ích của Namkna thì trong mẫu gốc cũng có 1 slider khá đẹp. Tuy nhiên không biết vì sao khi mình tải mẫu đó về dùng thì nó mất đi slider hay nói đúng hơn là nó không hiện ra và mình cũng ko biết chỉnh code của nó như thế nào cả. Namkna xem qua cái template mà mình đang dùng, nó bị lỗi gì với tiện ích slider gốc vậy! link template gốc: http://www.mastemplate.com/2012/07/johny-kenthir-banget.html
Cảm ơn Namkna nhiều! Chúc trang của bạn ngày càng có nhiều người biết đến!
1- Bạn chèn lỗi phần css của mình bạn ak.
Xóa2- Tem trên mạng bao giờ cũng có 2 file xml một file có slide và một file không có nha bạn.
Mình không thấy slide mà bạn nói bạn ak.
Trả lờiXóacó cách nào gộp hết vào 1 tiện ích javar/script không cậu
Trả lờiXóaBước 4 thêm vào giữa 2 thẻ <style> và </style>
XóaBước 5 giữ nguyên
Bước 6 xóa 2 đoạn b:if màu vàng đi sau đó chèn vào tiện ích HTML là được thôi mà bạn.
Lưu ý là nếu trùng Jquery thì bỏ đi nha :)
ok đấy
Xóamình ko thấy div id='main-wrapper'
Trả lờiXóaThử với một trong 2 đoạn code bên dưới coi có tìm thấy không nha bạn.
Trả lờiXóadiv class="column-center-outer"
div class="column-center-inner"
bạn ơi mình kiếm ko thấy đoạn: div id='main-wrapper'
Trả lờiXóamình cũng thử tìm 2 đoạn sau nhưng cũng đêu ko thấy:
1, div class="column-center-outer"
2, div class="column-center-inner"
bạn giúp mình với url của mình là: http://conducmethanhxuan.blogspot.com/
bẠN THay dấu nháy đôi thành đơn để tìm nha.
Xóadiv class='column-center-outer'
div class='column-center-inner'
thank you.
Trả lờiXóaNhận xét này đã bị tác giả xóa.
Trả lờiXóaNam Ta cho hỏi tí
Trả lờiXóaBlog mình dùng template temeforest trong đó người ta bảo cái video slider chi cần gõ label vào là nó tự nhận và sẽ chạy slide mà sao mình add label rùi mà nớ ko chạy, cứ load mãi ko thôi ko ra hình gì cả ? mong bạn giúp đỡ
Bạn gửi mình cái link xem thử nhé
XóaNhận xét này đã bị tác giả xóa.
Xóalink nè bạn caritashathocmon1.blogspot.com
Xóasao mà nó cứ load hoài mà ko chịu ra
hic
1 cái recent video slider với cái feature post slider
bạn xem có cách nào khắc phục giúp mình với !
Cảm ơn nhé :)
cái này rất hay cảm ơn anh nhé
Trả lờiXóabạn Nam Kha ơi, sao mình đặt code của bạn vào rồi mà nó không chạy chỉ hiện 1 có cái hình rồi đứng im.
Trả lờiXóaLàm ơn giúp mình với
Blog mình : http://coverdepmoingay.blogspot.com/
Bạn ơi, mình làm tới bước 6 thì ko tìm thấy id='main-wrapper' để chỉnh sửa tiếp. Mong bạn giúp đỡ mình hoàn thành bước này nhé. Thanks. Email: nguyenquoc.khanhtrinh@gmail.com
Trả lờiXóa< div id = " main-wrapper " > cô không tìm được đoạn code này . và URL của blog là gi?
Trả lờiXóa>>> đồng hồ chính hãng