If you like DNray Forum, you can support it by - BTC: bc1qppjcl3c2cyjazy6lepmrv3fh6ke9mxs7zpfky0 , TRC20 and more...

 

WP. Filter sorting recipes by ingredient

Started by SIROTA, Aug 18, 2022, 09:28 AM

Previous topic - Next topic

SIROTATopic starter

Hey there, could you help me figure out how to add a filter option on my Wordpress site for sorting cooking recipes based on ingredients?

Essentially, I'm hoping to streamline the recipe search process by inputting the specific ingredients I have on hand and having the website display recipes that include those ingredients while filtering out any that require something I don't have.

This would make it much easier and more convenient for me to plan my meals and reduce food waste.

Could you provide any guidance or suggestions for implementing such a feature?
  •  


-DM-

Why might tags not be a good solution for organizing recipes based on ingredients? One way to implement this method is by including ingredients in the tag list, such as "Olivier salad recipe" tagged with mayonnaise, peas, boiled sausage, and other ingredients.

Alternatively, a text search function could be used to identify specific ingredients within the recipe. While this would eliminate the need to manually enter tags for each recipe, some manual input may still be required to ensure consistency and accuracy in the search results.
  •  

SIROTATopic starter

It's not convenient via search. You can only search by one ingredient and you end up with lots of recipes. And the filter, - you can specify multiple ingredients until the search is reduced to a few recipes. Something like that in online stores. Except how do you implement that?
  •  

Ronny

Quote from: SIROTA on Aug 18, 2022, 10:51 AMExcept how do you implement that?

You can implement such a filter through arbitrary fields (ACF), create a list of properties, then put a plugin to filter by arbitrary fields. I can make a handler if you can't find a filter.
  •  

SIROTATopic starter

Quote from: -DM- on Aug 18, 2022, 09:55 AMHow are tags not suitable for such purposes?

Tags aren't exactly the coat of arms. Tags are convenient to search by one word. For example, find all recipes that use peas. What if you need to find all recipes that have both peas and some other ingredient?
  •  

-DM-

Quote from: SIROTA on Aug 18, 2022, 12:01 PMWhat if you need to find all recipes that have both peas and some other ingredient?

And this is the nuances of how to use tags.
You can use the checkbox to select more than one. You type a question into Google and get an immediate answer http://wordpress.org/plugins/search-everything/.
  •  

SIROTATopic starter

Quote from: -DM- on Aug 18, 2022, 01:40 PMYou type a question into Google and get an immediate answer

Great idea, but This plugin has not been tested with the last four key WordPress releases . Most likely no longer supported, very likely compatibility issues when used with later versions of WordPress.
  •  


AlendyKeyn

Here are some steps and suggestions for adding this feature:

1. Data Structure and Content Management: Understand the data structure required for recipes and ingredients. You may consider using custom post types for recipes and custom fields or taxonomies for ingredients. Utilize a content management system within WordPress to organize and manage this data effectively.

2. Plugin Selection and Customization: Research and select a suitable recipe plugin that allows for custom fields or taxonomies. Plugins like "WP Recipe Maker" or "Recipe Card Blocks by WPZOOM" provide the necessary functionality for managing recipes and ingredients. Customize the plugin to your specific needs, ensuring that it aligns with your website's design and user experience goals.

3. User Interface Design: Design a user-friendly interface for filtering recipes based on ingredients. This may involve creating a custom search form with input fields for each ingredient or utilizing checkboxes for ingredient selection. Ensure that the interface is intuitive and visually appealing, considering factors such as color contrast, readability, and accessibility.

4. Filtering Logic and Backend Development: Develop the logic for filtering recipes based on selected ingredients. This involves querying the database to find recipes that include all the selected ingredients while excluding those that contain any ingredients the user doesn't have. Invest time in optimizing the database queries to ensure efficient performance, especially as the recipe database grows.

5. Displaying Filtered Results: Once the filtering logic is implemented, design and develop a visually engaging way to display the filtered recipe results. Consider the use of thumbnail images, recipe titles, and brief descriptions to give users a quick overview of each recipe. Implement lazy loading or pagination if there is a large number of recipes to display.

6. Responsive and Cross-Browser Compatibility: Ensure that the filter option and the resulting recipe display are responsive across various devices and screen sizes. Test the feature on different browsers to guarantee compatibility for a wide range of users.

7. Interactivity and User Engagement: Consider incorporating interactive elements, such as hover effects or click actions, to enhance user engagement with the filtered recipe results. Allow users to easily save or print recipes directly from the filter results page.

8. Performance Optimization and Scalability: Implement caching mechanisms and optimize code to ensure that the filter feature does not degrade the overall performance of your WordPress site. Consider scalability as the number of recipes and users grows over time.

9. Accessibility and SEO Best Practices: Ensure that the filter option and the recipe content adhere to accessibility standards and best practices for search engine optimization. Properly label form inputs, provide descriptive alt text for images, and ensure that the filtered content is crawlable by search engines.

10. Testing, Feedback, and Iteration: Thoroughly test the filter option in various scenarios to identify and address any potential issues. Collect user feedback through usability testing or surveys to understand how users interact with the feature. Use this feedback to iterate and improve the filter option over time.
  •  


If you like DNray forum, you can support it by - BTC: bc1qppjcl3c2cyjazy6lepmrv3fh6ke9mxs7zpfky0 , TRC20 and more...