Cách tạo trang bố cục tùy chỉnh trong chủ đề tùy chỉnh

Tôi muốn tạo bố cục trang tùy chỉnh trong chủ đề tùy chỉnh của mình. Tôi đã tạo một chủ đề tùy chỉnh có tên "ktheme" với chủ đề chính. Tôi đã tạo cutome_home.xmltrong thư mục bố trí nhưng tôi chỉ nhận được một trang chủ trống.

Làm cách nào để có được tiêu đề hiển thị trên trang chủ?

Câu hỏi của bạn rất ngắn gọn, có vẻ như bạn đang cố gắng tạo bố cục trang mới? Nếu đúng, bạn cũng cần khai báo layouts.xml.

Tài liệu chính thức

Cách tạo bố cục trang tùy chỉnh

Thêm bố cục của bạn

Trong ví dụ này, tôi sẽ tạo một bố cục có tên là Bố cục thử nghiệm, nó chính xác giống như bố cục một cột nhưng bạn có thể thêm bố cục của riêng mình vào đây.

Tạo tệp này (thay đổi tên cho phù hợp với bố cục của bạn):

app/design/frontend/**VENDOR**/**THEME**/Magento_Theme/page_layout/test-layout.xml

Nội dung:

<?xml version="1.0" ?>
<layout xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_layout.xsd">
    <update handle="empty"/>
    <referenceContainer name="page.wrapper">
        <container name="header.container" as="header_container" label="Page Header Container"  htmlTag="header" htmlClass="page-header" before="main.content"/>
        <container name="page.top" as="page_top" label="After Page Header" after="header.container"/>
        <container name="footer-container" as="footer" before="before.body.end" label="Page Footer Container" htmlTag="footer" htmlClass="page-footer" />
    </referenceContainer>
</layout>

Bố cục thử nghiệm của tôi dựa trên bố cục trang trống để bắt đầu từ đầu, bạn cũng có thể tạo bố cục dựa trên bố cục khác, chẳng hạn như 2 màu bên trái hoặc 3 màu. Để làm điều đó chỉ cần thay thế <update handle="empty"/>với bố cục bạn muốn sử dụng, ví dụ<update handle="3columns"/>

Thông báo cho Magento về bố cục của bạn

Tạo tệp XML này:

app/design/frontend/**VENDOR**/**THEME**/Magento_Theme/layouts.xml

Đây là nơi bạn tuyên bố bố trí tùy chỉnh của bạn, như vậy.

<page_layouts xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/PageLayout/etc/layouts.xsd">
    <layout id="test-layout">
        <label translate="true">Test Layout</label>
    </layout>
</page_layouts>

Và bây giờ chúng ta có thể sử dụng bố cục mới của mình trong XML hoặc quản trị viên: