Build and customize accessible, interactive web components without touching a single line of code.
🛠️ Configuration
Primary
Container BG
Page BG
👀 Live Preview
×
How to Host & Embed Your Widget
Because these widgets use interactive JavaScript, they cannot be pasted directly into standard text editors (like a TargetConnect description box) which strip out code for security. You must host the generated code as an HTML file first.
Option 1: The IT Department Route (Recommended)
If you are building this for an official university or corporate platform, your IT team will have a server.
1. Click "Copy Snippet" from this builder. 2. Open a plain text editor (like Notepad on Windows or TextEdit on Mac), paste the code, and save the file as my-widget.html. 3. Send this file to your IT or Web team and ask them to host it on the university/company server. 4. They will give you back a URL (e.g., https://your-uni.edu/assets/my-widget.html). 5. You can now embed that URL into TargetConnect (or SharePoint) using an iframe.
Option 2: The DIY GitHub Route (Free)
If you don't have IT support, you can host it yourself for free using GitHub Pages.
1. Create a free account on GitHub. 2. Create a new "Repository" (think of it as a folder) and name it something like careers-tools. 3. In your new repository, click Add file > Create new file. 4. Name the file flashcards.html and paste the code from this builder into the text box. Commit (save) the changes. 5. Go to the repository Settings > Pages. 6. Under "Source", select the main branch and click Save. Within a few minutes, GitHub will publish your file. 7. Your widget will be live at a URL looking like: https://your-username.github.io/careers-tools/flashcards.html