View Categories

Recipe Ingredients

The Recipe Ingredients Widget is a valuable tool for adding an option to display ingredient lists that you have added to recipes. You can easily add this widget using the Elementor Page Editor.

Below are the settings you can configure to set up the Recipe Ingredients:

Query #

  • Title: Add a title for the Ingredients section.

Title Section #

  • Padding: Adjust the padding inside the title section to create space between the title content and its edges.
  • Margin: Define the margins around the title section to control its spacing relative to other elements.
  • Border Type: Select the border style for the title section (e.g., solid, dashed, none).
  • Title Typography: Customize the typography of the title text, including font style, size, weight, and more.
  • Letters Styling
    • Margin: Define the margins around the letters to control spacing.
    • Padding: Adjust the padding around the letters to create internal spacing.
    • Typography: Customize the typography of the letters, such as font style, size, weight, and more.
    • Letter Spacing: Adjust the spacing between individual letters.
    • Disable Opacity: Enable or disable opacity for the letters, controlling their visibility.
    • Color: Select the color of the letters for both normal and hover/active states.
    • Background Color: Choose the background color of the letters for both normal and hover/active states.
    • Border Type: Specify the border style for the letters in normal and hover/active states.
    • Border Radius: Adjust the border-radius to create rounded edges for the letters.

Ingredients Section #

  • Padding: Adjust the padding inside the Ingredients section to create space between the content and its edges.
  • Margin: Define the margins around the Ingredients section to control spacing relative to other elements.
  • Border Type: Select the border style for the Ingredients section (e.g., solid, dashed, none).
  • Border Radius: Configure the border-radius to create rounded edges if the border type is chosen.
  • Border Color: Specify the border color if a border type is selected such as Solid.
  • Title Styling
    • Typography: Customize the typography of the title letter.
    • Padding: Adjust the padding around the title letter to create internal spacing.
    • Margin: Define the margins around the title to control its spacing relative to other content.
    • Color: Select the color for the title letter.
    • Background Color: Choose the background color for the title letter.
  • List Styling
    • Typography: Customize the typography of the list items, including font style, size, weight, and more.
    • Color: Select the color for the listed items.
    • Hover/Counter Color: Specify the color of the list items when hovered and for the counter number that displays the number of recipes associated with each ingredient.
    • List Spacing: Adjust the spacing between individual list items.