You are herelập trình
lập trình
Ubercart - Can't add products to Shopping cart
Hôm nay gặp một lỗi rất khó chịu trên Ubercart, đó là khi chưa đăng nhập vào website, chọn một mặt hàng để cho vào giỏ hàng thì toàn hiện ra thông báo "There are no products in your shopping cart.". Điều khó chịu ở đây là mình cài đặt Ubercart trên máy tính của mình thì không gặp vấn đề này, nhưng khi export dữ liệu rồi cài trên máy khác với mã nguồn giống nhau thì các máy các đều gặp vấn đề này. Ban đầu mình nghĩ đến do đường dẫn session chưa được cấu hình chính xác, nhưng sau khi loay hoay một hồi thì thấy các thông số cấu hình không có gì là khác biệt, nhưng máy của em Lương vẫn bị lỗi. Cuối cùng vẫn phải sử dụng đến ông Google để tìm ra vấn đề. Hóa ra khi export dữ liệu rồi import vào máy khác thì trong bảng users bản ghi đầu tiên đã bị thay đổi, ban đầu bản ghi đầu tiên có uid bằng 0, sang đến máy khác thì uid này lại không phải bằng không. Mà trong Drupal, thông tin bản ghi đầu tiên chính là dành cho tài khoản vô danh, chính điều này đã làm session của giỏ hàng không còn đúng nữa. Sau khi dùng phpmyadmin thay đổi bản ghi đầu tiên uid về 0 thì chương trình lại chạy ngon ơ! Câu hỏi đặt ra là tại sao khi backup bằng Sql Dumper và restore thì uid của bản ghi đầu tiên trong bảng Users lại bị thay đổi?
- huyvq's blog
- 77 reads
Cufon - giải pháp thay thế sFIR
Chắc hẳn bạn đã từng một lần sử dụng sFIR (Scalable Inman Flash Replacement) khi thiết kế những Website để tạo ra những phong cách typography ấn tượng. Còn nếu ai chưa từng sử dụng thì có thể hiểu sFIR nôm na là cách sử dụng Flash để thay thế và hiển thị text trên website. Dễ hiểu hơn nữa thì như sau, bạn muốn website của mình sử dụng một font chữ bay bỏng, ấn tượng nào đó, nhưng để người xem nhìn được font đó thì trên máy tính của người đó phải cài font đó rồi, do đó sFIR ra đời để vẫn có thể hiện thì font theo ý muốn mà không cần biết máy người dùng đã cài font đó hay chưa.
Khi sử dụng sFIR thì một trở ngại duy nhất đó là trình duyệt phải cài Flash Plugin. Nếu Flash plugin không cài thì mọi thứ chúng ta làm đều về mo hết. Để giải quyết những khó khăn đó Cufon đã được ra đời, với chức năng giống với sFIR nhưng khác ở chỗ Cufon không sử dụng Flash mà đơn thuần chỉ sự dụng JavaScript để render font với Canvas hoặc VML. Do vậy khi sử dụng Cufon chúng ta có thể chạy được hầu hết các trình duyệt phổ biến hiện nay.
Sử dụng Cufon cũng rất đơn giản. Đầu tiên vào trang chủ của Cufon lấy về file cufon-yui.js. Tiếp theo chúng ta phải tạo ra một file js tương ứng với font mà mình muốn hiện thị. Công việc này được tự đông bằng trang web sinh tự động.
Sau khi có 2 file js trên chúng ta có thể thử sử dụng bằng đoạn code dưới đây. Cách sự dụng cụ thể có thể tham khảo bằng link này.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="cufon-yui.js" type="text/javascript"></script>
<script src="Vegur_300.font.js" type="text/javascript"></script>
<script type="text/javascript">
Cufon.replace('h1');
</script>
</head>
<body>
<h1>This text will be shown in Vegur.</h1>
</body>
</html>Nói thêm chút khi sinh file js từ một file font, chúng ta chỉ nên chọn những tập hợp ký tự mà mình sử dụng, vì nếu chọn tất cả các ký tự sẽ làm file js trở nên phình to, lúc load trang web sẽ ảnh hưởng đến tốc độ. Tập hợp ký tự tiếng Việt của chúng ta được mình gom lại dưới đây.
àáạảãâầấậẩẫăằắặẳẵèéẹẻẽêềếệểễìíịỉĩòóọỏõôồốộổỗơờớợởỡùúụủũưừứựửữỳýỵỷỹđÀÁẠẢÃÂẦẤẬ ẨẪĂẰẮẶẲẴÈÉẸẺẼÊỀẾỆỂỄÌÍỊỈĨÒÓỌỎÕÔỒỐỘỔỖƠỜỚỢỞỠÙÚỤỦŨƯỪỨỰỬỮỲÝỴỶỸĐ
Ví dụ vào link sau để xem!
- huyvq's blog
- 997 reads
Cấu hình Redmine sử dụng Gmail SMTP
Các bài trước mình đã trình bày cách cài đặt Redmine trên Dreamhost và trên hệ điều hành Centos. Trong quá trình sử dụng, bạn sẽ có lúc gặp trường hợp muốn Redmine gửi mail thông báo cho người dùng khi thông tin và tiến trình dự án được thay đổi. Trong bài này sẽ hướng dẫn cách sử dụng gmail smtp để gửi mail trong Redmine.
Trước hết chúng ta down file smtp_tls.rb có đính kèm phía dưới, rồi cho vào thư mục lib. Tiếp theo là cấu hình ActionMailer trong file config/email.yml với các thông số phù hợp với SMTP của tài khoản Gmail gần giống dưới đây.
production:
delivery_method: :smtp
smtp_settings:
address: smtp.gmail.com
port: 587
domain: gmail.com
authentication: :login
user_name: info@expandrive.com
password: passwordTiếp theo thêm dòng khai báo sử dụng thư viện smtp vào file production.rb
require 'smtp_tls'
Bây giờ chúng ta có thể gửi mail bằng tài khoản Gmail qua Redmine. OK?
| Attachment | Size |
|---|---|
| smtp_tls.rb | 1.46 KB |
- huyvq's blog
- 1188 reads
Menu với CSS
Bài viết này sẽ hướng dẫn các bạn trang trí một menu trên web với CSS. Sau khi đọc xong hướng dẫn này các bạn sẽ thu được kỹ thuật làm menu với tên gọi là Slide door và một số kinh nghiệm khác. Kết quả sau khi thực hiện xong sẽ như hình dưới đây
Đầu tiên chúng ta tạo đoạn code HTML xây dựng menu như sau
<div class="container"> <ul id="menu"> <li class="active"><a href="#">Trang chủ</a></li> <li><a href="#">Diễn đàn</a></li> <li><a href="#">Giới thiệu</a></li> <li><a href="#">Điều khoản</a></li> <li><a href="#">Gallery</a></li> <li><a href="#">My gallery</a></li> <li><a href="#">Thành viên</a></li> <li><a href="#">Báo lỗi</a></li> </ul> </div>
Tiếp theo chúng ta sẽ chỉnh CSS để có được menu hiển thị như mong muốn.
/* MENU */ ul#menu{ line-height:50px; margin:0; list-style:none; } ul#menu li{ float: left; margin-right:20px; text-transform:uppercase; padding-right: 10px; } ul#menu li.active, ul#menu li:hover, ul#menu li.sfhover{ background: transparent url(images/button-right.png) no-repeat right; } ul#menu li a{ color:#FFFFFF; text-decoration: none; display:block; padding-left: 10px; } ul#menu li.active a, ul#menu li:hover a, ul#menu li.sfhover a{ background: transparent url(images/button-left.png) no-repeat left; } /* END MENU */
Ở đây tôi giải thích qua một số thuộc tính, chúng ta sử dụng line-height: 50px để ép chiều cao của menu bằng 50px và chữ sẽ được tự động căn giữa theo chiều dọc. Nếu chúng ta sử dụng thuộc tính height thì sẽ phải sử dụng margin hoặc padding để căn lại vị trí cho chữ của menu. Với thuộc tính list-style: none; để bỏ các bullet của các item li. Tiếp nữa nếu để mặc định thì chúng ta sẽ thấy các li hiển thị theo từng dòng một từ trên xuống dưới, ở đây chúng ta muốn hiển thị menu theo chiều ngang nên sẽ dùng float:left để các li hiển thị trên cùng một dòng ngang. Và để các mục cách nhau chúng ta sử dụng margin-right: 20px; để làm việc này.
Bây giờ để thay đổi style khi một item được chọn hoặc chuột di chuyển qua ta chỉnh lại thuộc tính của ul#menu li.active, ul#menu li:hover. Nhìn lại đoạn mã CSS sẽ thấy chỉ khi item được chọn và chuột di chuyển qua chúng ta chỉ thay đổi ảnh của background cho item đó. Nhưng ở đây chắc ai đó sẽ thắc mắc sao lại phải thay đổi background cho cả tag a và li, sao không chỉ một thôi. Do độ dài của từng item là chưa biết trước và khác nhau nên chúng ta không thể tạo ra một cái background cố định để thay cho tất cả được. Do vậy ở đây chúng ta sẽ sử dụng một kỹ thuật với tên gọi cũng khá gợi hình tượng "slide door". Trước tiên vào Photoshop tạo một button có độ dài phù hợp rồi cắt ra làm 2 phần như hình dưới đây
Như vậy chúng ta sẽ cho background của li là cái ảnh bên phải, của thẻ a nằm trong li là ảnh bên trái. Do đó khi item có kích thước khác nhau thì hình ảnh nút vẫn được hiển thị hài hòa. (Ô thế tại sao không dùng ảnh li là ảnh bên trái, và của thẻ a là cái còn lại? đơn giản vì theo cách hiển thị trên trình duyệt thì thằng nào nằm trong thì background của nó đè lên thằng chứa nó, còn nếu ai vẫn thích vậy thì ta cắt lại cho hình bên phải nhỏ hơn...). Để hiểu rõ hơn có thể đọc thêm kỹ thuật này tại link này.
OK, vậy là sau những bước này chúng ta đã có một menu ngang rồi và chạy rất ok trên Firefox, nhưng khi sang thằng IE thì sự kiện di chuyển chuột qua item không thấy nó đổi background. Tại sao nhỉ? Đây chính là những lúc bực nhất đối với người thiết kế Web để đảm bảo trang web của mình chạy đúng đắn trên các trình duyệt. Bị hiện tượng như trên là do trong IE không có cái kiểu li:hover, cái này IE chỉ support cho tag a thôi. Để giải quyết vấn đề này chúng ta thêm đoạn javascript này ở đầu trang web.
<!--//--><![CDATA[/ /><! sfHover = function() { var sfEls = document.getElementById("menu").getElementsByTagName("LI"); for (var i=0; i<sfEls.length; i++) { sfEls[i].onmouseover=function() { this.className+=" sfhover"; } sfEls[i].onmouseout=function() { this.className=this.className.replace(new RegExp(" sfhover\\b"), ""); } } } if (window.attachEvent) window.attachEvent("onload", sfHover); //--><!--]]>
Đoạn mã này sẽ được chạy trong IE để khi ta di chuyển chuột qua một item thì sẽ thêm môt class sfhover vào li. Cho nên trong đoạn mã CSS ở trên chúng ta cũng có phần định nghĩa style cho ul#menu li.sfhover và ul#menu li.sfhover a.
Vậy chúng ta đã có một menu chạy ngon trên IE và firefox!
- huyvq's blog
- 1319 reads
Cài đặt Redmine trên Centos 5.3
Hôm nay mới chính thức được setup Redmine trên hệ điều hành Centos. Cách đây một thời gian mình cũng đã cài thành công Redmine trên Dreamhost, hôm nay có được một máy chủ VPS nên phải tự lực cấu hình.
Cài Ruby on Rails
yum install ruby ruby-devel ruby-libs ruby-irb ruby-rdoc ruby-mysql
Tiếp theo là download và cài ruby gems
wget http://rubyforge.org/frs/download.php/57643/rubygems-1.3.4.tgz
tar xvf rubygems-1.3.4.tgz
cd rubygems-1.3.4
ruby setup.rb
Cài rails
gem install rails --include-dependencies
Cài đặt Phusion Passenger
gem install passenger
Cần cài thêm một số công cụ cho Apache
yum -y install httpd-devel apr-devel
Tiếp theo từ dòng lệnh chạy
passenger-install-apache2-module
Sau khi module Apache 2 cài đặt thành công, chúng ta mở file cấu hình Apache thêm đoạn giống như dưới đây vào cuối file đó
LoadModule passenger_module /usr/local/lib/ruby/gems/1.9.1/gems/passenger-2.2.2/ext/apache2/mod_passenger.so
PassengerRoot /usr/local/lib/ruby/gems/1.9.1/gems/passenger-2.2.2
PassengerRuby /usr/local/bin/ruby
Khởi động lại Apache bằng lệnh
service httpd restart
Sau khi Apache khởi động xong thì để triển khai các ứng dụng Ruby on Rails trên Web thì chúng ta trỏ DocumentRoot vào thư mục public của các RoR project.
Để hoàn tất việc cài redmine, ví dụ tôi muốn cái Redmine lên subdomain http://a.xyz.com. Đầu tiên tôi tạo một thư mục projects trên server rồi download phiên bản mới nhất của Redmine về và giải nén vào thư mục projects đó. Sau đó tạo một subdomain http://a.xyz.com có DocumentRoot trở vào thư mục public trong projects. Như vậy khi chúng ta vào trang http://a.xyz.com thì module Passenger sẽ được kích hoạt để chạy ứng dụng RoR.
Các bước cấu hình Redmine thì làm giống như trên trang hướng dẫn cài đặt.
PS:
Các lỗi thường gặp:
/usr/local/apache/include/apr_file_info.h:200: error: 'apr_ino_t' does not name a type ..."
Lỗi này xuất hiện là do cài 2 thư viện apr trên server. Một cái cài mặc định và một cái cài Cpanel. Để khắc phục ta tạo một symbolic link như hướng dẫn dưới đây.
#ln -s /usr/local/apache/include/ /usr/include/apr-1
- huyvq's blog
- 1292 reads
