{"id":26295507,"url":"https://github.com/lwcorp/iframe-bubble","last_synced_at":"2025-10-05T11:21:55.872Z","repository":{"id":281206823,"uuid":"944516620","full_name":"lwcorp/iframe-bubble","owner":"lwcorp","description":"Integrate any iframe as a Balloon/Bubble - including multiple ones simultaneously","archived":false,"fork":false,"pushed_at":"2025-03-07T14:59:38.000Z","size":14,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-07T15:39:44.132Z","etag":null,"topics":["iframe-embeds","wordpress"],"latest_commit_sha":null,"homepage":"https://lwcorp.github.io/iframe-bubble/","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"agpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/lwcorp.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2025-03-07T13:38:54.000Z","updated_at":"2025-03-07T15:00:51.000Z","dependencies_parsed_at":"2025-03-07T15:50:11.243Z","dependency_job_id":null,"html_url":"https://github.com/lwcorp/iframe-bubble","commit_stats":null,"previous_names":["lwcorp/iframe-bubble"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lwcorp%2Fiframe-bubble","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lwcorp%2Fiframe-bubble/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lwcorp%2Fiframe-bubble/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lwcorp%2Fiframe-bubble/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/lwcorp","download_url":"https://codeload.github.com/lwcorp/iframe-bubble/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243681077,"owners_count":20330155,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["iframe-embeds","wordpress"],"created_at":"2025-03-15T04:14:15.735Z","updated_at":"2025-10-05T11:21:54.797Z","avatar_url":"https://github.com/lwcorp.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"If you like to embed an iframe in your website, but only as an overlay if a user clicks a bubble/balloon, then this is going to save you a lot of time.\n\nTrying to integrate [embeddable AI chats](https://www.linkedin.com/posts/liorweissbrod_openai-chatgpt-aibusiness-activity-7287060823183675392-17Q7) raised the general question of how to **easily** integrate iframes as bubbles/ballons.\n\nWordPress specifically has various related extensions, but none of them (not even Elementor) has direct support (at least for free) for bubbles/balloons turning to iframes.\n\n# Goals\n1. Allowing to embed any iframe in any website\n1. Supporting simultaneous embedding\n1. Avoiding loading iframes unless clicked upon\n1. Using HTML shapes to avoid loading images\n1. Animating the bubble/balloon opening the iframe\n\n# Usage\n1. Replace the text with your site's text.\n1. Replace the `iframe` tags with your ones.\n1. (Optionally) `dualchat` setting: control if you want multiple chats at the same time (default is no).\n1. (Optionally) `chatlang` setting: choose which languages you want (default is all).\n\n## WordPress\nThe WordPress version uses [add_action](https://developer.wordpress.org/reference/functions/add_action/) with [wp_enqueue_scripts](https://developer.wordpress.org/reference/functions/wp_enqueue_scripts/) and [wp_footer](https://developer.wordpress.org/reference/functions/wp_footer/) to add the CSS/JS and HTML respectively.\n\nIt can be applied easily with an extension like [Code Snippets](https://wordpress.org/plugins/code-snippets/).\n\n# Demo\nYou can try your own iframe and settings in a live demo via the link in the About section.\n\n# Screenshot\n![balloons](https://github.com/user-attachments/assets/930138d5-54ff-4379-8ec4-e3d853bfb00a)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flwcorp%2Fiframe-bubble","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flwcorp%2Fiframe-bubble","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flwcorp%2Fiframe-bubble/lists"}