Table of Contents
You can add the Recipe Categories Slider widget via the Elementor page editor.
Below are the settings you can configure to set up the Recipe Categories Slider:
Layout Settings #
- Layout: Choose from all available layout options.
- Categories per Column: Specify the number of categories to display in each column.
- Image/Icon Type: Select the type of image or icon to use for the image categories taxonomy.
- Column Gap: Adjust the gap between columns.
Query #
- Show All Taxonomy: Toggle this option on to display all taxonomies.
- Terms: Select the taxonomy you want to display in the slider.
- Hide Empty: Enable this option to hide taxonomies that don’t contain any recipes.
Additional #
- Category Tag: Choose the tag to use for the taxonomy titles.
- Category Count: Toggle this option on to display the category count.
- Recipe Count Label: Customize the display of the recipe count label.
Slider #
- Autoplay: Toggle this option to enable autoplay for the slider.
- Autoplay Speed: Define the speed at which the slider auto-scrolls.
- Loop: Toggle this option to make the slider loop continuously.
- Transition Speed: Set the duration of the slider’s transition effects.
- Navigation: Enable this option to display navigation arrows on the slider.
- Slider Pagination: Toggle this option to show pagination dots for the slider.
Content #
- Background Color: Set the background color for the content of the widget.
- Padding: Adjust the padding around the content within the widget section.
- Margin: Set the margin around the slider section.
- Border Type: Select the border type for the widget section.
- Border Radius: Set the border radius to control the roundness of the corners.
- Box Shadow: Configure the box shadow for the post boxes within the widget section.
- Alignment: Choose alignment for the content of the widget.
Image Settings #
- Image Size: Select the aspect ratio for the featured image of the recipe post.
- Width: Specify the width of the image.
- Height: Specify the height of the image.
- Object Fit: Choose how you want to display the image.
- Border Type: Choose a border type for the image of recipes.
- Border Radius: Define the border radius for the images.
- Box Shadow: Configure the box shadow settings for the categories images.
Category Name #
- Color: Select the color for the category names.
- Hover Color: Choose the color to display when hovering over the category names.
- Margin: Adjust the spacing around the category names by setting top, bottom, left, and right margins.
- Typography: Customize the font style, size, weight, letter spacing, and line height for the category names.
Count #
- Padding: Adjust the space around the count element by setting top, bottom, left, and right padding.
- Color: Choose the color for the count text to match your site’s design or make it stand out.
- Typography: Customize the font family, size, weight, letter spacing, and line height for the count.
Slider Navigation #
- Prev Arrow: Upload a custom previous arrow or select one from the Elementor library.
- Next Arrow: Upload a custom next arrow or select one from the Elementor library.
- Padding: Adjust the padding around the arrows.
- Icon Size: Customize the size of the slider arrow icons.
- Offset: Adjust the offset for the slider navigation arrows.
- Color: Set the arrow colors for both normal and hover states.
- Background Color: Define the background color of the arrows for normal and hover states.
- Border Type: Choose a border style for the arrow buttons in both normal and hover states.
- Border Radius: Adjust the border radius of the arrow buttons for normal and hover states.
Slider Pagination #
- Color: Choose the color for the slider pagination.
- Active Color: Select the color for the active slider pagination.
- Spacing: Adjust the spacing around the pagination icons.
