Thủ thuật yêu cầu: Script liệt kê và gọi script

Posted by chiasedamme on Monday, August 1, 2011

Trong quá trình thiết kế weblog trên nền tảng Blogspot, hẳn bạn đã, đang và sẽ vọc rất nhiều script, dẫn đến thực tế là gắn nhiều script vào Template sẽ gây ảnh hưởng đến tốc độ load trang. Có một yêu cầu của bạn đọc về việc làm sao có script gọi được script, tức là gom các file script vào một chỗ rồi đến lúc nào cần script đó hoạt động thì mới gọi nó ra, chứ không cho nó load hết toàn bộ trong trang. Mình viết thủ thuật này theo yêu cầu của bạn MrWinni.

Mình có thể mô tả thủ thuật này như sau: Trước hết mình tạo một tiện ích để chứa các file script và mình đặt tiện ích này lên trên tiện ích Header để dễ bề quản lý, sau đó mình dùng script liệt kê tất cả các file js cần dùng trong Template rồi đặt vào tiện ích này; mỗi khi cần bất kỳ một file js nào hoạt động thì chỉ cần dùng lệnh gọi script đó ra là được, như vậy sẽ không load tất cả các file js ra cùng một lúc. Nói như thế nghĩa là giả sử mình sử dụng đến 1000 file js trong Template song vẫn không hề ảnh hưởng đến tốc độ load trang của Template.

Đến đây, mình tin rằng bạn sẽ cần đến thủ thuật này hơn bao giờ hết. Vậy thì hãy thực hiện như sau:

Bước 1. Đăng nhập Blogger, vào Design >> Edit HTML, chọn Expand Widget Templates. Tìm sau thẻ <body> rồi đến thẻ <div id='header'> hoặc thẻ <div id='topnavbar'> (nếu Template của bạn có thanh menu đỉnh) và đặt trước thẻ đó bằng đoạn code bên dưới:
<b:section class='scripcontainer' id='scriptcontainer'>
<b:widget id='HTML100' locked='false' title='' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
</b:includable>
</b:widget>
</b:section>
Lưu Template.

Bước 2. Vào Page Elements, kéo đến đầu Layout, sát trên phần Header, chọn Edit để chỉnh sửa tiện ích HTML/Javascript rồi đặt đoạn code như bên dưới vào đó:
<script type="text/javascript">
// ScriptListing&Reading Script by www.thuthuatblogger.info
function readScript(index) {

URLBase="http://tenban.googlecode.com/files/";
scriptLIST=new Array(

0,"",
1,"code1.txt",
2,"code2.txt",
3,"code3.txt",
4,"code4.txt",
5,"code5.txt",
6,"code6.txt",
7,"code7.txt",
8,"code8.txt",
9,"code9.txt",
10,"code10.txt",

1000,""
);

regNum = index * 2 +1;
document.write('<script src="' + URLBase + scriptLIST[regNum] + '"><\/script>');
}
</script>
Trong trường hợp này, bạn upload các file js có đuôi .js hoặc .txt vào cùng một nguồn lưu trữ file (ví dụ googlecode hoặc host riêng của bạn), đặt URL ngồn (URLBase) cho script. Cứ mỗi lần dùng thêm file js thì bạn chỉ cần thêm số thứ tự theo định dạng như trên.

Mỗi khi bạn muốn một script nào đó hoạt động tại vị trí theo ý bạn thì chỉ cần sử dụng lệnh gọi script như sau:

<script>readScript(1);</script>

Hoặc <script>readScript(2);</script>

Hoặc <script>readScript(3);</script>

Cứ như thế chỉ cần thay số thứ tự cho file js cần gọi ra là được.

Nếu bạn upload các file js (lưu tên lộn xộn theo đuôi .js và .txt) lên các host khác nhau thì ở Bước 2, bạn sử dụng code như sau:
<script type="text/javascript">
// ScriptListing&Reading Script by www.thuthuatblogger.info
function readScript(index) {
scriptLIST=new Array(
// Đây là danh sách các URL dẫn đến nguồn script
0,"",
1,"http://www.tenmien1.com/files/code1.js",
2,"http://www.tenmien2.com/files/code2.txt",
3,"http://www.tenmien3.com/files/code3.js",
4,"http://www.tenmien4.com/files/code4.txt",
5,"http://www.tenmien5.com/files/code5.js",
6,"http://www.tenmien6.com/files/code6.txt",
7,"http://www.tenmien7.com/files/code7.txt",
8,"http://www.tenmien8.com/files/code8.js",
9,"http://www.tenmien9.com/files/code9.txt",
10,"http://www.tenmien10.com/files/code10.txt",

1000,""
);
regNum = index * 2 +1;
document.write('<script src="' + scriptLIST[regNum] + '"><\/script>');
}
</script>
Tuy code này đơn giản song vẫn hy vọng rằng hiệu quả nó đem lại là vô cùng lớn đối với các bạn.
More about →

dBpoweramp Music Converter R14.2

Posted by chiasedamme

dBpoweramp Music Converter R14.2 Reference Edition

dBpoweramp Music Converter R14.1 Reference Edition is a collection of fully-integrated audio software from Illustrate, written by Spoon. The main dBpoweramp product is dBpoweramp Music Converter, with many additional add-ons available for download as well as some other related software. dBpoweramp CD Ripper is the corner stone of dBpoweramp Music Converter’s suite of audio tools, designed to meet the needs of hobbyist, enthusiast or audio professional, one ripper catering to all needs.
It is safe to say, no other audio program converts more multi-format audio files than dBpoweramp, the developers have spent 8 years perfecting format-compatibility and conversion stability. Audio conversion perfected, effortlessly convert between formats. dBpoweramp Music Converter has become ‘the standard’ tool for audio conversions. dBpoweramp CD Ripper is for those who take ripping seriously, dBpoweramp CD Ripper rips Audio CDs fast and bit-perfect.









More about →

Button Shop v4.26

Posted by chiasedamme

Kristanix Software Button Shop v4.26

Within five minutes, you will be making stunning, memorable buttons for you web site! That’s how easy it is to use Button Shop. Why suffer from lost sales or site visitors, when you can invest in a program that will pay for itself within days!This powerful tool includes everything you need to perfect your home page. It comes jam-packed with more than 200 professionally designed button templates and textures, that you can play with, tweak and modify to suit your own needs. Button Shop will even create the HTML code you need to have mouse-over and mouse-pressed states for your buttons. No javascript and complex HTML-knowledge required.








More about →

ImTOO Video Converter Ultimate v6.6.0.0623

Posted by chiasedamme


ImTOO Video Converter Ultimate is best video converter program that can easily and quickly convert between HD videos like H.264/MPEG-4 AVC, AVCHD (*.m2ts, *.mts), MKV, HD WMV, MPEG2/MPEG-4 TS HD Video, convert videos from HD to SD, convert general video formats such as AVI, MPEG-4, WMV, DivX, H.264/AVC from one to another, extract audio file or pictures from video, and even create video from pictures.








More about →

SUPERAntiSpyware Professional v4.56.1000

Posted by chiasedamme

SUPERAntiSpyware Professional 4.56.1000 Final

Detect and Remove Spyware, Adware and Remove Malware, Trojans, Dialers, Worms, KeyLoggers, HiJackers, Parasites, Rootkits, Rogue Security Products and many other types of threats.







More about →

Tạo chú thích cho ảnh trong bài viết blogspot

Posted by chiasedamme

Bạn có dịp tham quan những danh lam thắng cảnh trên thế giới và đã chụp lại rất nhiều ảnh đẹp. Bạn muốn chia sẻ những tấm ảnh đó với bạn của mình trên blog. Nhưng không phải ai cũng biết địa danh hay tên gọi của những nơi đó nên khi post ảnh lên bạn phải tạo chú thích cho ảnh.

Bây giờ bạn thử ngắm 2 hình ở trang DEMO này. Lưu ý: không thấy hiệu ứng khi xem ở IE.

Bạn thích kiểu ghi chú của hình 1 hay hình 2, nếu thích hình 1 thì bạn làm theo cách bình thường, upload ảnh lên xong thì viết ghi chú bên dưới nó. Nhưng nếu bạn thích kiểu ghi chú ở hình 2 thì sao?

Thủ thuật đơn giản sau sẽ giúp bạn có kiểu ghi chú ấn tượng này.

Các bạn đặt code này vào trướcdòng ]]></b:skin>.
.imgcaption {
padding-bottom:10px;
padding-top:30px;
position:relative;
}
.imgcaption cap {
position:absolute;
left:0%;
right:0%;
padding:10px;
background:#dddddd;
color:ffffff;
opacity:0.8 !important;
bottom:6%;
}
Xong rồi bạn lưu template lại.

Trong bài đăng, khi bạn upload ảnh thì ảnh thường có dạng như thế này:

<div class="separator" style="clear: both; text-align: center;"
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQOy4BE8nzwIWg8MLAirqUhhKmaWL5jmiyY0nGR5zf2SQczANUL8DhNMLLrrG6EmkOnkLBgPFxE6L1a8wSqgtVAnIId5iijkAJIacP2zo1IRs-SadxtxINg1k-fidAIcqhsQ9IeB6SQAuf/s1600/Nha+hat+Opera.jpg" imageanchor="1" style="margin-left:1em; margin-right:1em"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQOy4BE8nzwIWg8MLAirqUhhKmaWL5jmiyY0nGR5zf2SQczANUL8DhNMLLrrG6EmkOnkLBgPFxE6L1a8wSqgtVAnIId5iijkAJIacP2zo1IRs-SadxtxINg1k-fidAIcqhsQ9IeB6SQAuf/s1600/Nha+hat+Opera.jpg" /></a></div>

Bây giờ bạn chỉ cần nhìn vào code bên dưới, lưu ý "seperator" đã được thay bằng "imgcaption" và trước thẻ </div> chúng ta thêm vào dòng code màu đỏ là OK.
<div class="imgcaption" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQOy4BE8nzwIWg8MLAirqUhhKmaWL5jmiyY0nGR5zf2SQczANUL8DhNMLLrrG6EmkOnkLBgPFxE6L1a8wSqgtVAnIId5iijkAJIacP2zo1IRs-SadxtxINg1k-fidAIcqhsQ9IeB6SQAuf/s1600/Nha+hat+Opera.jpg" imageanchor="1" style="margin-left:1em; margin-right:1em"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQOy4BE8nzwIWg8MLAirqUhhKmaWL5jmiyY0nGR5zf2SQczANUL8DhNMLLrrG6EmkOnkLBgPFxE6L1a8wSqgtVAnIId5iijkAJIacP2zo1IRs-SadxtxINg1k-fidAIcqhsQ9IeB6SQAuf/s1600/Nha+hat+Opera.jpg" /></a><cap>Nhà hát Opera Sydney</cap></div>

Chúc các bạn thành công.
More about →

TIỆN ÍCH XEM TRUYỀN HÌNH CHO BLOG

Posted by chiasedamme

Do có một số bạn yêu cầu, hôm nay mình chia sẻ một số code để chèn tiện ích xem truyền hình cho blog. Ứng với mỗi kiểu mẫu là code phía dưới, bạn thích kiểu nào thì chỉ việc copy code và đăng nhập vào Blog > chọn thiết kế > chọn thêm tiện ích HTML/Javacript rồi dán nó vào, bấm Lưu lại là xong.
Mẫu 1: Đây là mẫu các biểu tượng (Logo) của các đài truyền hình, bạn thích xem đài nào thì bấm vào Logo đó, nó sẽ liên kết đến đài truyền hình để bạn xem. (Vì Logo quá dài, nên tôi chỉ chụp hình mẫu vài cái để bạn xem).




Mẫu 2: Với mẫu này là các Logo sẽ được trình diễn xoay vòng rất đẹp mắt, bạn có thể dùng tiện ích này vừa xem truyền hình vừa trang trí cho blog thêm đẹp.















Mẫu 3: Mẫu này với hình cái Tivi rất đẹp, muốn xem truyền hình chỉ cần bấm vào hình tivi, nó sẽ chuyển bạn đến trang Web xem truyền hình trực tuyến.

Gif maker




Mẫu 4: Còn với mẫu này, bạn có thể xem truyền hình trực tiếp ngay trên Blog của bạn luôn, phía dưới là các kênh, muốn xem kênh nào thì bấm vào kênh đó, nó sẽ hiển thị ngay trên blog của bạn (bạn thử bấm xem một kênh thì sẽ biết)












Mẫu 5: Còn với mẫu này, bạn sẽ thấy được trang Web xem truyền hình trực tiếp ở ngay trên Blog của mình với kích thước nhỏ.






Với các mẫu kể trên, tôi hy vọng các bạn sẽ có một mẫu phù hợp cho Blog của mình.
Chúc các bạn vui!!!
More about →