目录事件轮播小组件

Adobe Commerce功能 {width="20"} 仅在Adobe Commerce中独占的功能(了解更多

目录事件轮播小组件显示即将发生的事件的滑块,其中每个事件都有一个倒计时滚动条。 您可以选择您希望轮播显示的页面布局的页面和区域,并控制同时显示的事件的宽度和数量。 您得到的结果取决于您的主题、主题在页面上出现的位置以及您选择的选项。

在左侧边栏中 事件轮播 {width="700" modal="regular"}

步骤1:启用目录轮播小组件

在开始之前,请按照说明配置​ 目录事件 ​构件,使其为店面启用。

目录事件配置

第2步:创建构件

  1. 在​ 管理员 ​侧边栏上,转到​ Content > Elements>Widgets

  2. 单击右上角的​ Add Widget

  3. 在​ Settings ​部分中,执行以下操作:

    • 将​ Type ​设置为Catalog Events Carousel

    • 选择商店使用的​ Design Theme

  4. 单击​ Continue

    事件轮播的小组件设置 {width="500" modal="regular"}

  5. 在​ Storefront Properties ​部分中,执行以下操作:

    • 对于​ Widget Title,输入小部件的描述性标题。

      此标题仅在​ 管理员 ​中可见。

    • 对于​ Assign to Store Views,选择您希望小组件可见的存储区视图。

      您可以选择特定的商店视图,或All Store Views。 要选择多个视图,请按住Ctrl键(PC)或Command键(Mac)并单击每个选项。

    • (可选)为​ Sort Order ​输入一个数字,以确定该项在页面的同一部分中与其他项一起出现的顺序。 (0 =第一,1 =第二,3 =第三,依此类推。)

      小组件店面属性 {width="600" modal="regular"}

步骤3:选择位置

  1. 在​ 布局更新 ​分区中,单击​ Add Layout Update

  2. 将​ Display On ​设置为Specified Page

  3. 将​ Page ​设置为CMS Home Page

  4. 将​ Container ​设置为以下项之一:

    • Main Content Area
    • Sidebar Additional
    • Sidebar Main
    note note
    NOTE
    结果因主题和页面布局而异。 您还必须在类别配置中指定​_Catalog Events Carousel Default Template_。
  5. 如果您希望事件轮播显示在店面的其他位置,请单击​ Add Layout Update,然后对该位置重复这些步骤。

    布局更新 {width="600" modal="regular"}

  6. 单击​ Save and Continue Edit

    现在,您可以忽略消息以刷新缓存。

步骤4:配置选项

  1. 在左侧面板中,选择​ Widget Options

  2. 对于​ Frame Size,输入要在滑块中同时列出的事件数。

    要一次只查看一个事件,请输入1

  3. 对于​ Scroll,输入每次点击要滚动的事件列表数量。

    要滚动到下一个事件,请输入1

  4. 对于自定义宽度,输入​ Block Custom Width ​的像素数。

    在以下示例页面上,自定义宽度设置为250像素。

    自定义宽度构件选项 {width="400" modal="regular"}

  5. 完成后,单击​ Save

  6. 提示刷新缓存时,单击页面顶部消息中的链接,然后按照说明操作。

recommendation-more-help
2b0136b4-ef75-405f-9734-60d741f198de