Table of Contents
The Recipe Search Widget is a valuable tool for adding a search feature to any page. You can easily add this widget using the Elementor Page Editor.
Below are the settings you can configure to set up the Recipe Search:
Query #
- Show All Taxonomy: Enable this toggle to show all the taxonomy.
- Terms: Choose the terms you want to include in the search function.
Additional #
- Show Category: Enable this option to display all the categories selected in the Term settings.
- Button Text: Enter the text you want to display on the “Browse All Recipes” button.
- Button URL: Provide the URL of the page you want the button to link to.
- Button Icon: Choose an icon from the Icon Library or upload an SVG file for the button’s arrow icon.
Search Field #
- Padding: Define the padding around the search field.
- Margin: Set the margin around the search field.
- Border Type: Choose the type of border for the search field.
- Border Width: Specify the border width for the search field.
- Border Color: Select a color for the search field’s border.
- Box Shadow: Adjust the box shadow settings for the search field.
- Background Color: Pick a background color for the search field.
- Search Icon Color: Select a color for the search icon.
Category #
- Space Between Items: Adjust the spacing between taxonomy items.
- Item Padding: Set padding around each item.
- Margin: Define the margins around the items.
- Typography: Customize the typography for the taxonomy items.
- Color: Select the color for category items in both normal and hover states.
- Background: Choose the background color for category items in normal and hover states.
- Border Type: Select the border style for the category buttons.
- Border Width: Specify the border width for the category buttons.
- Border Color: Choose a color for the category button borders.
- Border Radius: Adjust the border radius for the taxonomy buttons.
Button #
- Typography: Customize the typography of the button text.
- Padding: Adjust the padding inside the button to create space between the button text and its edges.
- Background Color: Choose the background color of the button for both normal and hover states.
- Color: Select the text color for the button in both normal and hover states.
- Border Type: Specify the border style for the button (e.g., solid, dashed, none).
- Border Radius: Adjust the border-radius to create rounded corners for the button.
