Recipe Nutrition Facts Overlay

WHAT IT DOES Recipe Nutrition Facts Overlay automatically extracts nutrition information from recipe web pages and displays it as a clean, FDA-style nutrition facts label right on your screen. Whether you're meal planning, tracking macros, or just curious about what's in your food, this script pulls calories, total fat, saturated fat, trans fat, cholesterol, sodium, total carbohydrates, dietary fiber, total sugars, and protein from the page's structured data. If the page uses JSON-LD (Schema.org Recipe markup), microdata, or even plain visible text, the script finds it and presents it in a familiar black-and-white label format that's easy to read at a glance. You can customize which nutrients appear, adjust serving sizes, and reposition the overlay anywhere on your screen. WHERE IT RUNS This script runs on any website that contains recipe content—food blogs, recipe aggregators, cooking sites, and even social media posts with recipe data. It operates entirely within the browser tab where the recipe page is open, reading the page's DOM and embedded structured data. The script cannot access other tabs, your browsing history, bookmarks, downloads, or any information outside the current page. All settings are stored locally using GM_setValue and never transmitted anywhere. HOW TO USE After installing with the BotGentz extension, the script automatically detects when you're on a recipe page. If auto-open is enabled, the nutrition facts overlay appears within seconds, positioned where you prefer (top-right by default). You'll see a familiar nutrition label showing calories per serving, macronutrients, and other details. To close the overlay, click the ✕ button in the top-right corner. The panel offers controls to show the overlay manually, adjust serving size (which recalculates displayed values), and toggle individual nutrients on or off. You can also change the overlay position between four corners of the screen. Your preferences are saved automatically for future recipe pages. THE REAL MECHANISM This script uses a multi-layer extraction pipeline to find recipe data regardless of how it's structured. First, it scans all blocks and recursively traverses their JSON object graph to find Schema.org Recipe nodes, checking @type, @graph, and mainEntity properties. It extracts recipeYield (servings), recipeIngredient (ingredients list), and nutrition properties including calories, fatContent, saturatedFatContent, transFatContent, cholesterolContent, sodiumContent, carbohydrateContent, fiberContent, sugarContent, and proteinContent. If JSON-LD is absent, the script falls back to microdata by querying elements with itemscope and itemtype containing "Recipe", reading itemprop attributes. Finally, if no structured data exists, the script scans visible page text for common ingredient patterns (cups, tablespoons, grams, ounces) and extracts a best-guess ingredient list. The nutrition facts label is rendered using pure DOM methods—no innerHTML from untrusted data—ensuring safe display of all extracted values. THE PANEL The Recipe Nutrition Facts panel is a BGPanel component that you can drag anywhere on your screen by its header. It snaps to the nearest edge when released, keeping your workspace organized. The panel collapses to a small bubble showing only the emoji icon when minimised—click to expand it again. You can resize the panel horizontally to see more settings. Press the Escape key to collapse the panel instantly. Your panel position and size are saved per-site. PLEASE NOTE This script requires the free BotGentz browser extension to function. Recipe websites vary widely in how they structure data—some use Schema.org JSON-LD, others use microdata, and many use custom formats. The script aims to extract whatever it can, but if a page uses proprietary or non-standard data structures, some nutrition values may be missing. The script never reads or writes password fields, hidden inputs, or file inputs. It stores only your display preferences (position, nutrient toggles, serving size, and auto-open setting). No recipe data, nutrition values, or page content is ever collected, transmitted, or shared—all extraction happens locally in your browser.