Embedding PuzzleCast Word‑Tool Widgets

PuzzleCast’s widgets are self‑contained iframe components that let you add anagram solvers, crossword helpers, word‑search generators and more without writing any JavaScript. Follow the steps below to get a widget live on your site in minutes.

Step 1 – Pick a widget from the catalog

Browse the full widget library at /widgets/. Each entry shows a preview, a short description and the parameters it accepts. Click the widget you want to use; the page will display a ready‑made iframe snippet that you can customize.

Step 2 – Choose your options

Every widget supports three core query‑string parameters:

tool – the specific solver or generator (e.g., anagram, crossword, wordsearch).
dict – the dictionary or language to draw words from (e.g., american, british, spanish). Consult the widget’s documentation for the exact values.
layout – how the widget sizes itself: single (fixed width), dual (two‑column view) or responsive (fluid width that adapts to its container).

Build the URL by appending these parameters to the widget’s base address, for example:

https://puzzlecast..com/widgets/wf-widget.html?tool=anagram&dict=american&layout=responsive

Step 3 – Copy the iframe snippet

Once you have the final URL, wrap it in an iframe tag. Below is a ready‑to‑copy example for an Anagram Solver using the American dictionary and a responsive layout:

<iframe src="https://puzzlecast.com/widgets/wf-widget.html?tool=anagram&dict=american&layout=responsive"
        width="100%" height="380" style="border:0;border-radius:6px" loading="lazy"
        title="Anagram Solver"></iframe>

Feel free to adjust the width, height or inline CSS to match your design.

Step 4 – Paste into your page HTML

Insert the iframe code directly where you want the widget to appear:

WordPress – add a “Custom HTML” block and paste the snippet.
Squarespace / Wix – use an Embed or HTML element and paste the code.
Raw HTML – place the iframe inside the <body> of your page template.

Save/publish the page and the widget should load instantly.

Step 5 – Size guidance

For optimal usability:

Set a minimum width of 300px; narrower frames may truncate controls.
A height between 320px and 420px works well for most tools; the responsive layout will reflow content within those bounds.
If you use layout=responsive, the widget will expand to fill its container while preserving aspect ratio, so you can rely on a fluid width (e.g., width:100%) and let the height dictate the visible area.

Attribution note

The free‑to‑use license requires that the small credit row displayed at the bottom of each widget remain visible. Removing or obscuring that attribution violates the terms of service. If you need a white‑label version (no branding), see the API documentation at /widgets/api.html for subscription options.

Troubleshooting

Widget appears blank – Verify that the page is served over HTTPS; the widget will refuse to load insecure http resources. Also ensure the iframe does not have a sandbox attribute that strips scripts (e.g., sandbox without allow-scripts).

No results or “Dictionary not found” – Double‑check the dict parameter spelling against the list provided in the widget’s catalog entry. Typos (e.g., americn) will cause the widget to fall back to an empty dictionary.

If problems persist, open the browser console (F12) and look for network errors or CSP violations; most issues are resolved by correcting the URL or adjusting iframe attributes.