Thông thường tôi chỉ điều chỉnh các mẫu miễn phí hiện có và thay đổi màu sắc và phông chữ. Câu hỏi là, khi tôi đã có trang Joomla của mình trực tuyến, cách dễ nhất để thực hiện thay đổi cho mẫu css là gì?

Hiện tại, tôi đang sử dụng Công cụ phát triển Chrome để tìm và điều chỉnh các kiểu cụ thể để xem trước. Nếu tôi thích nó, tôi điều chỉnh tệp css của mẫu trực tiếp trong trình chỉnh sửa trực tuyến trong khu vực quản trị.

Khi tôi mới bắt đầu và tôi không có bất kỳ nội dung nào, tôi đã sử dụng một máy chủ web cục bộ với Joomla có lợi thế là tôi có thể sử dụng một IDE thích hợp để viết mã css và php. Vì hiện tại tôi đã có một số nội dung, tôi muốn xem những thay đổi tôi thực hiện với nội dung tôi có.

Tôi biết rằng đây là một câu hỏi cơ bản, nhưng có một quy trình làm việc ưa thích khi ai đó muốn điều chỉnh thiết kế của một trang web hiện tại không?

Nhân bản trực tiếp với Akeeba, cài đặt cục bộ, sau đó điều chỉnh theo yêu cầu. Khi bạn hoàn thành SSH / FTP, các tệp đã thay đổi của bạn trở lại trang web trực tiếp.

Có rất nhiều lý do chính đáng tại sao nó không phù hợp với tinh chỉnh tinh vi trên một trang web trực tiếp

Bạn có một vài lựa chọn ở đây, tùy thuộc vào việc bạn tập trung dễ sử dụng, tự động hóa hay chi phí:

• Thực hiện chính xác những gì bạn đã làm trước đây với cài đặt cục bộ của mình, nhưng sau khi cài đặt, hãy thay đổi cài đặt Joomla cục bộ để sử dụng cơ sở dữ liệu MySQL từ xa, trực tiếp của bạn configuration.php, nếu máy chủ của bạn hỗ trợ truy cập từ xa. Hãy cẩn thận - mọi thay đổi DB sẽ được chuyển sang ...

• Sử dụng một thành phần như extplorer và chỉnh sửa các tệp mẫu trực tiếp trong trình duyệt, với một tab khác đang mở hiển thị trang web, vẫn sử dụng các công cụ dev của Chrome. extplorer có tính năng tô màu mã và rất tốt để thực hiện các thay đổi nhỏ một cách nhanh chóng.

• Sử dụng hệ thống kiểm soát phiên bản để đưa ra các thay đổi - ví dụ: phát triển mẫu của bạn trong bản cài đặt Joomla cục bộ bằng IDE đã chọn, với mẫu trong kho lưu trữ. Khi hoàn thành, cam kết thay đổi trang web trực tiếp của bạn. Sử dụng hook post-commit để kiểm tra những thay đổi đó như là một phiên bản hoạt động. Mặc dù phức tạp hơn để thiết lập, điều đó có nghĩa là bạn luôn có thể quay lại các phiên bản mẫu cũ nếu bạn mắc lỗi. Thêm vào MySQL từ xa để đảm bảo tính nhất quán dữ liệu trên toàn cục bộ và trực tiếp.

• Trả tiền cho một khuôn mẫu / khung mẫu phù hợp - tại công ty của tôi, chúng tôi sử dụng các mẫu YooTheme . Khung mẫu này có một tính năng gọi là 'Customizr', về cơ bản là cửa sổ 2 ngăn có hàng trăm biến CSS (tốt, biến LESS) ở bên trái và xem trước trực tiếp ở bên phải. Các biến này kiểm soát gần đủ mọi yếu tố của mẫu, từ đệm máng xối đến bóng văn bản của mục menu và mọi thứ ở giữa. Các thay đổi được áp dụng ngay lập tức trong bản xem trước và có thể xác định nhiều 'kiểu' để bạn có thể chơi với các cấu hình biến khác nhau. Tất cả đã nói, tôi chắc chắn các khung mẫu khác có các tính năng rất giống nhau.

Lưu ý: Tôi không có mối quan hệ với extplorer hay YooTheme ngoài người dùng.

Nếu đó chỉ là CSS thay đổi, bạn cũng có thể tiếp tục xem trước chúng trong Công cụ phát triển Chrome và sử dụng môi trường phát triển trực tuyến như Cloud9 hoặc ShiftEdit, bạn có thể kết nối trực tiếp với máy chủ của mình qua FTP và chỉnh sửa trang web trực tiếp bằng IDE phù hợp tương tự như cách bạn đã làm khi nó được lưu trữ cục bộ.

Tuy nhiên tôi sẽ không đề xuất điều này cho bất kỳ thay đổi lớn hơn nào có thể phá vỡ trang web của bạn (tôi đã học được cách khó khăn vài năm trước). Đối với những điều này, tôi khuyên bạn nên thiết lập một máy chủ cục bộ (hoặc VM miễn phí từ koding.com ), nhân bản trang web với Akeeba và sử dụng Git * để đẩy các thay đổi đến trang web trực tiếp của bạn sau khi chúng được kiểm tra.

* Nếu bạn không muốn mã của mình được công khai trên GitHub, một lựa chọn tốt khác là BitBucket .

Phương pháp 1

Một phương pháp tôi đã sử dụng là thêm tệp css của riêng tôi vào tệp index.php mẫu. Điều này có thể được gói để chỉ thêm nó nếu bạn là người dùng.

Một cách để mở rộng điều này là viết một plugin đơn giản có thêm tệp css nếu bạn là người dùng. Tôi đã sử dụng điều này để thay đổi mẫu quản trị mặc định, để tránh thực hiện thay đổi trực tiếp trong mẫu có thể được thay thế bằng bản cập nhật tiếp theo.

Cái gì đó như...

class plgSystemBB extends JPlugin {
    public function onBeforeCompileHead() {

    if (JFactory::getUser()->username == 'my.login.name.goes.here')
    {
        JFactory::getDocument()->addStylesheet("/templates/protostar/css/test.css");
    }

    if(!JFactory::getApplication()->isAdmin()){
        return;
    }   

    JFactory::getDocument()->addStylesheet("/templates/isis/css/admin-extra.css");
}

Phương pháp 2

Để xem trước các thay đổi của mẫu, bạn có thể sao chép mẫu và thực hiện các thay đổi trong bản sao. Để xem những thay đổi đó, hãy thêm "? Template = test" vào url, ghi đè lên mẫu. Thay thế "kiểm tra" bằng bất kỳ tên nào bạn đã quyết định sử dụng cho bản sao.

Lưu ý rằng bạn cần sao chép toàn bộ mẫu chứ không chỉ là một kiểu. Cả hai kiểu và mẫu có thể được nhân đôi trong gui quản trị.

Tôi không tin rằng có thể ghi đè một kiểu trong url. [PW: Tôi vừa phát hiện ra rằng trong J3, bạn có thể ghi đè một kiểu trong url. Xem phương pháp 3.]

Phương pháp 3

Tương tự như phương pháp 2 nhưng với kiểu dáng. Sử dụng kiểu "thử nghiệm" và sửa đổi mẫu chính để bao gồm biểu định kiểu thử nghiệm. Để ghi đè một kiểu trong url, hãy thêm? TemplateStyle =, ở đâu là định danh mẫu (tức là số).