Trang Chủ

Hiển thị các bài đăng có nhãn Bo-blog. Hiển thị tất cả bài đăng
Hiển thị các bài đăng có nhãn Bo-blog. Hiển thị tất cả bài đăng

Thứ Hai, 17 tháng 1, 2011

0 [Bo-blog] Script tạo chữ chạy vòng theo chuột

Script này để tạo chữ chạy vòng theo chuột rất hay.

Demo: bạn xem trên http://champi.info hoặc link sau
Demo online: http://champi.info/demo/script/chuchaytheochuot.htm

Cách làm rất đơn giản:
Cách làm:
- Bạn download file về giải nén được 2 file chu-chay-vong.js và chu-chay-vong.css
- Copy 2 file đó vào thư mục images của blog
- Chèn đoạn code sau vào giữa ..của blog ( nếu là bo-blog thì bạn có thể chèn vào phần HEAD trong thiết lập tham số)
<link rel="stylesheet" rev="stylesheet" href="images/chu-chay-vong.css" type="text/css" media="all" />
<script type="text/javascript" src="images/chu-chay-vong.js"></script>

Để sửa chữ hiển thị bạn mở file  chu-chay-vong.js tìm
var msg = "Welcome to champi.info";

Sửa thành chữ bạn muốn hiển thị
Đang mùa noel và năm mới bạn có thể sửa thành MERRY CHRISTMAS hoặc HAPPY NEW YEAR

Download Now
Pass: hnshare.blogspot.com

0 [Bo-blog] Topx new - thêm số thứ tự đầu dòng

Demo:
Bấm xem ảnh ở cửa sổ mới

0 [Bo-blog] Ebook Bo-blog 1.3 (14/01/2010)

Cộng đồng sử dụng Bo-blog ở Việt Nam ngày càng đông, các website hỗ trợ người dùng ở Việt Nam ngày càng nhiều ... Vậy tại sao bạn ko sử dụng nó nhỉ.
Đây là ebook rất hay và chi tiết do bạn CongToan ( thành viên rất có nhiều đóng góp cho sự phát triển của cộng đồng boblog việt Nam) biên soạn

Link download: Ebook bo-blog 1.3 from Mediafire: File Size: 1.58 MB
http://www.mediafire.com/?2brckjj6qerwpbn

0 [Bo-blog] Module mới top bài viết cho bo-blog

Bấm xem ảnh ở cửa sổ mớiĐây là module mới để hiển thị những top bài viết trên bo-blog chỉ có ở Champi.info
- Top xem nhiều
- Top thanks nhiều
- Top comments nhiều
- Top mới nhất
- Tất cả các bài viết





Thứ Bảy, 11 tháng 12, 2010

0 Tiện ích thay đổi giao diện bằng cách click theme ưa thích

Phần giao diện web/blog đóng vai trò rất quan trọng khi thiết kế một website hay blog. Thời gian qua mình có test một thủ thuật liên quan đến giao diện của blogger, thủ thuật này sẽ giúp bạn thêm một công cụ để người dùng có thể tự lựa chọn giao diện cho blog của bạn. Thủ thuật thay giao diện (style switch) sẽ giúp người dùng có thể chọn giao diện mà họ thích bằng cách click vào màu sắc mà bạn thiết lập sẵn. Và việc thực hiện thủ thuật này đòi hỏi bạn có chút kiến thức về cách chèn file vào web/blog. Bạn có thể xem demo bằng cách click vào các màu sắc bên dưới.

Click vào màu bên dưới để xem demo
Default-theme Red theme Green theme Gray theme Darkyellow theme

Ở đây mình chỉ hướng dẫn bạn thay đổi màu nền của phần BODY trong blogspot, các phần khác (sidebar, header, outer...) bạn tự mình thiết lập nhe. Và ở đây mình chỉ hướng dẫn bạn tạo 3 màu tương ứng với 3 file css cho blogspot.
Lưu ý: bạn phải bỏ phần "background" trong BODY thì mới có thể áp dụng tiện ích này.

I. Thiết lập màu nền

1. Đầu tiên bạn hãy mở chương trình Noepad và soạn thảo nội dung như bên dưới và save lại với tên styledefault.css.
body { background:#fff; /*màu nền mặc định của body*/}

Đây là file sẽ hiển thị màu nền mặc định cho phần body của blog bạn, màu nền (ở đây là màu trắng) này sẽ xuất hiện đầu tiên khi người dùng truy cập vào blog của bạn.

2. Sau đó bạn chọn File/new để soạn thảo file mới. Bạn tiếp tục thiết lập màu thứ 2 (ở đây mình cho là màu xanh dương) và save lại với tên styleblue.css.
body { background:#000099; /*màu nền thứ 2 của body*/}

3. Tương tự bạn mở file mới và soạn thảo nội dung như bên dưới, thiết lập màu sắc thứ 3 (ở đây là màu vàng), sau đó save lại với tên styleyellow.css.
body { background:#fcb201; /*màu nền thứ 3 của body*/}

4. Như vậy bạn đã thiết lập 3 màu sắc cho nền phần BODY trong blospot, bây giờ bạn hãy upload 3 file mà bạn vừa thiết lập ở trên lên một hosting để lấy link.

II. Thêm tiện ích vào blogspot

1. Đăng nhập vào tài khoản Blogger
2. Vào thiết kế, chọn chỉnh sửa HTML (Edit HTML)
3. Chèn code bên dưới vào sau thẻ <head>
<link href='styledefault.css' rel='stylesheet' type='text/css'/>
<link href='styleblue.css' media='screen' rel='alternate stylesheet' title='blue-theme' type='text/css'/>
<link href='styleyellow.css' media='screen' rel='alternate stylesheet' title='yellow-theme' type='text/css'/>

<script src="http://traidatmui-tips.googlecode.com/files/styleswitch.js" type="text/javascript"/></script>

Bạn hãy thay 3 tên file css ở trên (màu đen đậm) thành link tương ứng với 3 file mà bạn đã upload lên host ở phần I.

4. Sau khi chỉnh sửa xong bạn save template lại (nếu save có lỗi bạn bỏ thẻ </script> và save lại).

5. Bây giờ bạn về phần tử trang và thêm 1 HTML/Javascript và thêm vào nó code bên dưới.
<a href="javascript:chooseStyle('none', 60)" checked="checked"><img style="border:1px solid #051cfe;" title="Default-theme" alt="Default-theme" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKH7abc8Np3BEGzbhSB0leZHkWHK-IQbFYO6KhTU4RF_6FVm6ks-XmuMR8B32UrSiw06-x2GCJKr2NgY65wBGpdxr2V9w25lrqVPrhyphenhyphenDvuna_FzVUAZ7iptpKOL5Ox_1jmSkJo5VMv76zP/"/></a>
<a href="javascript:chooseStyle('blue-theme', 60)"><img style="border:1px solid #051cfe;" title="Blue theme" alt="Blue theme" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji20_BJfoarjobi1PGdRogHmn9gstBtN8xeDUodMZ_KyfdOgsg3iluXoV6-Yzqo8H5fJXbTZXLQW4c_jtCyoIn3cBVRQBAy72orZGOPpQRFdVc6G1hr9TLqVNO3cw0fix94Fg3VD3A_uSd/"/></a>
<a href="javascript:chooseStyle('yellow-theme', 60)"><img style="border:1px solid #051cfe;" title="Yellow theme" alt="Yellow theme" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifvuJD0BQnaV6cE0QFVOgtWJIHebYgIVU_pJREa4Huj7ZS9CisutEHNIMOxvpLk9RY4zMcRViYxk0PP1IosSgEx1NwW8FuqThCIL5D5OOd07Q1Xj5nY-0_WuHbOZeVMP5y_pHjJ-CFc3TV/"/></a>

Bạn thay link ảnh ở trên (link màu tím) thành link ảnh màu tương ứng. Lưu ý 2 từ khóa ở trong code bước 3 và bước 5 này phải giống nhau, tức là dòng màu đỏ đậm trong code (blue-theme, yellow-theme), nếu bạn thiết lập không giống nhau thi nó sẽ không hoạt động được.

6. Cuối cùng bạn save lại.

Chúc bạn thành công.

Thứ Sáu, 10 tháng 12, 2010

0 Code dropdown menu sử dụng CSS và JS đơn giản

Đây là code để tạo 1 dropdown menu sử dụng CSS và JS đơn giản .

Demo

Bạn chỉ cần copy code này vào phần muốn hiển thị trong trang web là được
<style>
#navbar { margin: 0; padding: 0; height: 1em; }
#navbar li { list-style: none; float: left; }
#navbar li a { display: block; padding: 3px 8px; background-color: #5e8ce9; color: #fff; text-decoration: none; }
#navbar li ul { display: none; width: 10em; background-color: #5e8ce9;}
#navbar li:hover ul, #navbar li.hover ul { display: block; position: absolute; margin: 0; padding: 0; }
#navbar li:hover li, #navbar li.hover li { float: none; }
#navbar li:hover li a, #navbar li.hover li a { background-color: #5e8ce9; color:white; }
#navbar li a:hover { background-color: #8db3ff; }
</style>
<script> champi_info = function() {
var sfEls = document.getElementById("navbar").getElementsByTagName("li");
for (var i=0; i<sfEls.length; i++) { sfEls[i].onmouseover=function() { this.className+=" hover"; }
sfEls[i].onmouseout=function() { this.className=this.className.replace(new RegExp(" hover\\b"), ""); } } }
if (window.attachEvent) window.attachEvent("onload", champi_info);
</script>
<ul id="navbar">
<li><a href="#">Item One</a><ul><li>
<a href="#">Subitem One</a></li><li>
<a href="#">Second Subitem</a></li><li>
<a href="#">Numero Tres</a></li></ul></li>
<li><a href="#">Second Item</a><ul><li>
<a href="#">Just one subitem</a></li></ul>
</li>
<li><a href="#">No Subitem</a></li>
<li><a href="#">Number Four</a><ul><li>
<a href="#">Subitem One</a></li><li>
<a href="#">Second Subitem</a></li><li>
<a href="#">Numero Tres</a></li><li>
<a href="#">Fourth Thinger</a></li></ul>
</li>
</ul>

0 Free hosting byethost và Free domain co.cc

Byethost.com là một dịch vụ hosting miễn phí cung cấp đầy đủ các tính năng cần thiết của 1 webhosting chuyên nghiệp.
Các bạn chỉ cần dùng byehost kết hợp với tên miền co.cc là có thể sở hữu 1 website mà không phải mất tiền.

Những tính năng chính và nổi bật của byethost:
- No Ads: không chèn quảng cáo vào website của bạn
- Disk Space 5500 MB, Bandwith 200 GB
- 50 addon domains, 50 packed domains, 50 sub domains:
- 50 MySQL databases: đặc biệt hỗ trợ PHP.
- FTP account, Online file manager
-VistaPanel Control Panel

1. Đăng ký byethost.com
Các bạn vào đây để đăng ký: http://byethost.com/free-hosting/news
Chỉ cần điền đầy đủ thông tin cần thiết rồi gửi đi. Lưu ý là byethost khuyến cáo dùng trình duyệt Firefox để đăng ký đươc thuận lợi.

Sau đó bạn vào email kích hoạt và bạn sẽ nhận được những thông tin tương tự dưới đây
Cpanel Username:        b12_5414339
Cpanel Password:        123456
Your URL: http://ruabien.byethost12.com or http://www.ruabien.byethost12.com
FTP Server :            ftp.byethost12.com
FTP Login :             b12_5414339
FTP Password :          123456
MySQL Database Name:    MUST CREATE IN CPANEL
MySQL Username :        b12_5414339
MySQL Password :       123456
MySQL Server:           SEE THE CPANEL
Cpanel URL:             http://cpanel.byethost12.com
Như vậy là bạn đã đăng ký thành công 1 hosting miễn phí và sẵn sàng để sử dụng, cài đặt các ứng dụng cần thiết.

2. Quản lý byethost.com
Mình xin giới thiệu qua cpanel byethost để các bạn tiện quản lý và sử dụng hosting này. Khi đăng nhập bạn sẽ thấy màn hình chia làm 2 khu vực, bên trái màn hình và bên phài.
Phía bên trái màn hình chứa các thông tin về server, host bạn đang sử dụng. Và bên phải là các mục lục giúp bạn quản lý host của mình như hình dưới đây:
Bấm xem ảnh ở cửa sổ mới
Các thành phần quan trọng, bạn cần chú ý:
+ File manage: Nơi chứa tất các file của bạn, click vào nó thế này
+ Mysql database: dữ liệu của bạn quản lý bằng mysql
+ Addon domain: add thêm domain

3. Hướng dẫn add domain co.cc vào byethost
Đầu tiên bạn truy cập vào co.cc để đăng ký và quản lý tên miền của bạn
Trong phần quản lý tên miền hãy trỏ tên miền về
ns1.byet.org và ns2.byet.org như hình dưới
Bấm xem ảnh ở cửa sổ mới
(lưu ý phải chờ khoảng vài tiếng thì việc trỏ domain này mới có hiệu lực, nếu không một số trường hợp bạn không thể add domain ở bước tiếp theo)

Sau đó truy cập vào host, vào phần Addon domain để thêm domain mới.
Đánh tên miền mà bạn đã đăng ký rồi Click Create Domain .
Sau khi tạo thêm addon domain trên byethost thì 1 folder mang tên domain của bạn được tạo, từ đây bạn upload file và code vào folder này để cài đặt blog hoặc trang web.

Như vậy là bạn đã hoàn tất việc đăng ký một hosting miễn phí và cách thức add một tên miền.

Nguồn: http://dangkydomain.co.cc/ chỉnh sửa bởi http://chami.info

Tags - , , , , ,
Posted: 03 Dec 2010 04:50 PM PST
Người làm web chắc hẳn không ai ko biết localhost. Nhưng trong thời gian vừa qua , Champi thấy có khá nhiều bạn download plugin và module trên Champi.info sau đó cài đặt trực tiếp lên Host mà không kiểm tra trước trên localhost.

Champi viết bài này để hướng dẫn những bạn mới làm quen hơn với localhost và bo-blog. Khi cài đặt bo-blog trên localhost thì cũng giống như trên host bình thường bạn hoàn toàn có thể test trước module và plugin trước khi đưa lên host. Các bạn nhớ test kỹ trên localhost trước khi đưa lên host nhé, tránh rủi ro có thể xảy ra.

Các bước như sau
1. Cài đặt webserver trên windows (locahost)
2. Tạo cơ sở dữ liệu cho blog
3. Tiến hành cài đặt

Chi tiết
1. Cài đặt webserver trên windows (locahost) :
bạn tham khảo bài này
http://champi.info/blog/Cai-dat-Web-Server-tren-may-tinh-ca-nhan-Window-voi-Wamp/

2. Tạo cơ sở dữ liệu cho blog
- Sau khi cài đặt webserver với wamp bạn click vào biểu tượng của wamp sau đó chọn phpmyadmin
Bấm xem ảnh ở cửa sổ mới

- Bạn nhập 1 tên bất kỳ cho cơ sở dữ liệu ( ví dụ : boblog) sau đó nhấn Create
Bấm xem ảnh ở cửa sổ mới
Như vậy là xong database.

3. Tiến hành cài đặt
- Download code của boblog  : bạn có thể download code trên trang chủ của bo-blog.com hoặc download version mới nhất bo-blog2.1.1 ở đây:

- Copy code vào localhost: bạn copy thư mục blog vào : C:\wamp\www

- Chạy file install : http://localhost/blog/install/install.php để cài đặt

- Chọn ngôn ngữ tiếng việt
Bấm xem ảnh ở cửa sổ mới

- Click tiếp theo
Bấm xem ảnh ở cửa sổ mới

- Điền các thông tin về cơ sở dữ liêu: bạn điền như sau
+ Địa chỉ MySQL: locahost
+ Tên người dùng MySQL: root
+ Mật khẩu MySQL: ( không cần nhập để trống )
+ Tên CSDL MySQL: là tên database bạn tạo ở bước 2 ở trên
Sau đó nhấn tiếp theo
Bấm xem ảnh ở cửa sổ mới

- Nhập tên và mật khẩu của người quản lý ( tức là của bạn )
Bạn nhập ví dụ
+ Tên quản lý: admin
+ Mật khẩu quản lý: champi
+ Đổi mật khẩu quản lý: champi
Bấm xem ảnh ở cửa sổ mới

- Nhấn tiếp theo
Bấm xem ảnh ở cửa sổ mới

- Đến đây là cài đặt xong rồi, bạn xóa thư mục install đi là xong
Bấm xem ảnh ở cửa sổ mới

Bây giờ bạn truy cập bằng url : http://localhost/blog/index.php để xem blog
Bấm xem ảnh ở cửa sổ mới


Chúc bạn thành công và có thể test thoải mái module , plugin , script trên Champi.info mà ko lo blog có vấn đề ^.^