Thứ năm, 26/09/2013 | 00:00 GMT+7

Cách tạo Omega 4 Drupal Subtheme trên Ubuntu VPS


Về Omega

Omega là một trong những chủ đề cơ sở đáp ứng Drupal nổi tiếng nhất hiện có - với hơn 66.000 lượt cài đặt chính thức. Phiên bản 4 thực hiện một bước tiến xa so với cách thiết kế Omega 3 (với các tùy chọn giao diện user linh hoạt cho các nhà xây dựng trang web) và biến nó thành chủ đề cơ sở cho các nhà phát triển giao diện user dày dạn hơn.

Trong hướng dẫn này, tôi sẽ minh họa từng bước quá trình cài đặt Omega 4 và tạo subtheme đầu tiên của bạn. Đối với điều này, tôi sẽ giả sử bạn đang chạy VPS của riêng mình, với Drush và một bản sao của Drupal đã được cài đặt. Bạn có thể làm theo hướng dẫn này để tự cài đặt nếu bạn chưa làm. Và vâng, nếu bạn chưa sử dụng Drush cho công việc Drupal của bạn , hãy bắt đầu ngay hôm nay.

Thay đổi user

Điều quan trọng là nếu bạn đang hoạt động trên VPS của bạn với user root , bạn cần phải thay đổi một user khác. Vì vậy, trừ khi bạn đang chạy VPS với một user khác, hãy tiếp tục và tạo một user (hãy gọi anh ta là tony ):

sudo adduser tony

Chạy qua trình hướng dẫn và sau đó bạn có thể tiếp tục và thêm anh ta vào group sudoers (vì vậy bạn có thể chạy các lệnh sudo với user này):

sudo adduser tony sudo

Đến đây bạn có thể thay đổi user bằng cách đăng nhập bằng user mới được tạo này.

Hãy sở hữu cho mình một bản sao Omega 4

Bây giờ ta không còn sử dụng user gốc (nếu bạn đã làm điều đó ngay từ đầu), đã đến lúc tải chủ đề Omega vào cài đặt Drupal của ta . Ta sẽ làm điều đó bằng cách sử dụng Drush. Đảm bảo rằng bạn đang ở trong một folder (bất kỳ) bên trong trang web Drupal và chạy lệnh sau:

sudo drush dl omega

Vì version 4 đã là bản phát hành được khuyến khích nên Drush sẽ tự động download bản phát hành ổn định mới nhất. Tiếp theo, kích hoạt nó bằng lệnh sau:

sudo drush en omega

Sau đó, xóa tất cả các bộ nhớ cache để có biện pháp tốt.

sudo drush cc all

Tiếp theo, hãy nhanh chóng cài đặt extract vì bạn cần nó sau này:

sudo apt-get install unzip

Bạn sẽ nhận thấy rằng tất cả các lệnh đều được đặt trước sudo vì ta không phải là user root .

Trình quản lý version Ruby (RVM)

Vì với Omega 4, bạn có thể làm việc với Sass, Compass, Susy và tất cả các loại tính năng bổ sung khác được viết bằng Ruby, ta cần chăm sóc Ruby và các viên ngọc Ruby trước khi tiếp tục. Cách được khuyến khích để tiến hành là cài đặt RVM trước . Chạy lệnh sau để cài đặt nó:

\curl -L https://get.rvm.io | bash

Để sử dụng nó, hãy chạy lệnh sau:

~/.rvm/scripts/rvm

Sau đó, chạy lệnh này đảm bảo rằng tất cả các yêu cầu cho Ruby đã được cài đặt trên VPS của bạn:

rvm requirements

Bây giờ RVM đã được cài đặt, bạn sẽ có hai thứ bạn sẽ sử dụng cho chủ đề của bạn : rubygems và Bundler ( ta sẽ xem chúng là gì trong một phút nữa).

Omega Subtheme

Đã đến lúc sử dụng Drush để tự tạo ra chủ đề phụ mà ta sẽ làm việc. , ở đâu đó bên trong folder trang Drupal, hãy chạy lệnh sau:

sudo drush omega-wizard

Làm theo hướng dẫn trong cửa sổ terminal : đặt tên cho chủ đề (giả sử là ưa thích ), chọn chủ đề cơ sở (giả sử là Omega ), bộ khởi động (giả sử Cơ bản ), đích (có thể là Trang web ), chính trang web ( tất cả nếu bạn không chạy nhiều trang web), giữ hoặc xóa file readme mặc định và bật chủ đề mới của bạn làm mặc định trên trang web.

Xin lưu ý trong quá trình diễn ra ngay bây giờ, bạn cần extract để cài đặt (nhưng ta đã xử lý nó nên ta ổn).

Nếu bây giờ bạn chuyển đến trang web của bạn , bạn có thể thấy chủ đề phụ mới được bật và đặt làm mặc định trên trang web . Ta làm xong chưa? Không, không hoàn toàn.

Đá quý Ruby và Ruby

Điều hướng trong terminal của bạn đến folder của chủ đề mới được tạo này:

cd /var/www/drupal/sites/all/themes/fancy
Bạn sẽ nhận được một thông báo giống như sau:
ruby-1.9.3-p448 is not installed.
To install do: 'rvm install ruby-1.9.3-p448'

Phiên bản Ruby có thể khác trong trường hợp của bạn và hoàn toàn liên quan đến version Omega bạn đã cài đặt. Do nhiều Đá quý mở rộng chức năng của chủ đề này liên tục được nâng cấp (ví dụ: Sass ), có nguy cơ cao là các cú pháp sẽ thay đổi theo mỗi lần nâng cấp mà không có khả năng tương thích ngược.

Trong folder subtheme, bạn sẽ thấy hai file ( .ruby-gemset.ruby-version ) quy định version của Ruby và môi trường gemset nào sẽ được sử dụng trong folder này. Do đó, bạn có thể yêu cầu một chủ đề con Omega 4 khác chạy một version Ruby khác với một bộ đá quý khác mà không gặp bất kỳ rắc rối nào.

Vì vậy, bây giờ điều này đã rõ ràng, hãy cài đặt version Ruby mà ta cần ở đây (bạn đã được thông báo từ thông báo terminal mà bạn nhận được khi bạn chuyển vào folder subtheme). Hãy chạy lệnh sau để cài đặt nó:

rvm install ruby-1.9.3-p448

Tất nhiên là thay đổi version với version bạn đã được nói. Bạn cũng có thể kiểm tra bên trong tệp .ruby-version và xem version ở đó. Đến đây bạn đã cài đặt version Ruby thích hợp cho dự án chủ đề của bạn , bạn có thể chạy lệnh sau đảm bảo rằng nó đang được sử dụng cho nó:

rvm list

Nếu bạn chỉ cài đặt một version Ruby, bạn sẽ ổn. Nhưng không hại gì khi biết lệnh nhỏ này xuất ra các version khác nhau và cách chúng đang được sử dụng trong môi trường hiện tại (của subtheme, vì vậy hãy đảm bảo bạn đang ở trong folder subtheme khi chạy nó).

Bây giờ đã đến lúc cài đặt các Đá quý đi kèm với chủ đề của bạn (chẳng hạn như Sass, Compass, Susy, v.v. tất cả được chỉ định trong file Gemfile ). Chạy lệnh sau:

bundle install

Đến đây bạn sẽ thấy các Đá quý riêng lẻ đang được cài đặt khi các thông báo được in trên màn hình terminal . Ngoài ra, một file Gemfile.lock được tạo bên cạnh Gemfile để theo dõi các version chính xác của Gems được cài đặt. Vì vậy, nếu bạn cần chạy lại lệnh cài đặt, các Đá quý chính xác giống nhau sẽ được cài đặt - ngăn ngừa mọi vấn đề không tương thích.

Nếu bạn gặp lỗi không thể ghi Gemfile.lock do vấn đề về quyền, hãy đảm bảo folder subtheme thuộc sở hữu của bạn - user đang chạy cài đặt gói:

chown -R tony /var/www/drupal/sites/all/themes/fancy

Và bây giờ về cơ bản bạn đã hoàn thành. Ví dụ: nếu bạn muốn kiểm tra Sass, hãy chỉnh sửa một trong các file .scss nằm trong folder sass

cd /var/www/drupal/sites/all/themes/fancy/sass/

Và paste vào các dòng sau:

body {
  background-color:red;
}

Bây giờ nếu bạn làm mới trang web trong trình duyệt của bạn . Thì không có gì xảy ra. Bạn cần biên dịch Sass và biến nó thành CSS thông thường. Để thực hiện việc này, bạn có thể sử dụng La bàn bằng cách chạy lệnh sau từ folder root của subtheme:

compass compile

Bạn sẽ nhận được thông báo và bây giờ nếu bạn làm mới trình duyệt của bạn , Sass đã được chuyển thành CSS (được tìm thấy trong folder css / ).

Nếu bạn đang phát triển và muốn tất cả các thay đổi đối với file .scss được biên dịch tự động, hãy chạy lệnh sau:

compass watch

Điều này sẽ theo dõi các thay đổi và biên dịch chúng tự động. Nhấn CTRL-C để dừng xem.

Ngoài ra, bạn có thể tìm hiểu thêm về cách sử dụng Sass trong hướng dẫn này mà tôi đã viết trước đó.

Bài viết gửi bởi: Danny

Tags:

Các tin liên quan

Cách sử dụng HAProxy để thiết lập cân bằng tải HTTP trên VPS Ubuntu
2013-09-26
Cách sử dụng tính năng trùng lặp với GPG để tự động hóa an toàn các bản backup trên Ubuntu
2013-09-19
Cách cấu hình một cụm đa node với Cassandra trên VPS Ubuntu
2013-09-11
Cách theo dõi log xác thực hệ thống trên Ubuntu
2013-09-05
Cách bắt đầu với Jekyll trên VPS Ubuntu
2013-08-28
Cách sử dụng Dig, Whois và Ping trên Ubuntu VPS để truy vấn dữ liệu DNS
2013-08-23
Cách thiết lập Sass trên VPS của bạn đang chạy trên Ubuntu
2013-08-14
Cách cài đặt Cassandra và chạy một cụm node đơn trên VPS Ubuntu
2013-08-08
Cách cài đặt CouchDB từ nguồn trên VPS Ubuntu 13.04 x64
2013-08-06
Cách quản lý gói trong Ubuntu và Debian với Apt-Get & Apt-Cache
2013-08-06