Hostel

Import the Hostel design and it brings blocks and content types of its own, on top of the main Canvas library. Read this page when you are working on a site built from Hostel and meet a block you cannot find in the main reference.

These items stay registered on every site so that content you have already imported keeps rendering, and they appear in the block inserter only where the design is in use.

Content types this design adds

Rooms

canvas_hostel_room

One item is called a Room. You will find them in their own admin menu once the design is installed.

  • Editor features: editor, excerpt, thumbnail, title
  • Grouped by: Cities (canvas_hostel_city)

Each item carries these extra settings on its edit screen:

  • Room Amenities

  • Room City

  • Room Period

  • Room Price

  • Room Thumb Class

  • Room Tour Text

Blocks this design adds

Hostel Rooms

canvas-core/hostel-rooms

Alternating room rows with city, rate, amenities and a details link. In the block inserter it is named Hostel Rooms.

Select the block on a page and its own settings open in the sidebar, in the panels below:

The Hostel Rooms settings in the block editor sidebar

Layout

  • LayoutDefaultAlternating Room Rows

    Whether the block draws the alternating room rows or the other rooms shown on a single room page.

    ChoicesAlternating Room RowsSingle Room - Other Rooms

Query

  • City SlugDefaultEmpty

    Show only rooms in one city. Leave empty for every room.

  • RoomsDefault0

    0 shows every room.

  • Order ByDefaultMenu Order

    What to sort the rooms by.

    ChoicesMenu OrderDateTitle

  • OrderDefaultAscending

    Read the sort order forwards or backwards.

    ChoicesAscendingDescending

Display

  • First Row ClassesDefaultrow align-items-center flex-md-row-reverse col-mb-50 mb-0

    Grid classes for the first room row.

  • Even Row ClassesDefaultrow align-items-center mt-6 col-mb-50 mb-lg-5

    Grid classes for every second room row.

  • Odd Row ClassesDefaultrow align-items-center flex-md-row-reverse mt-6 col-mb-50

    Grid classes for every third and subsequent alternating room row.

  • Reversed Detail Column ClassesDefaultcol-lg-6 pe-0 pe-md-5

    Detail column classes when the image sits on the right.

  • Later Reversed Detail Column ClassesDefaultcol-lg-6 pe-0 pe-md-5 mb-5 mb-lg-0

    Detail column classes for the second and later rows whose image sits on the right, where the design adds its own bottom spacing.

  • Detail Column ClassesDefaultcol-lg-6 ps-md-5 mb-5 mb-md-0

    Detail column classes when the image sits on the left.

  • Image Column ClassesDefaultcol-lg-6

    Classes on the column holding the room photograph.

  • Button TextDefaultView More Details

    Wording on the room button.

  • Button ClassesDefaultbutton bg-color text-transform-none ls-0 mt-4 mx-0

    Classes on the room button.

  • Clear Between RowsDefaultOn

    Emit the float-clearing element the design places between rows.

  • Use Room ExcerptDefaultOff

    Use each room's excerpt instead of its listing description.

Was this page helpful?