Embedding hubl.in in your website currently supports only one method: a button.
Your users will be redirected to hubl.in (or directly to a videoconference if that's desirable) when they click on the button.
To add a hubl.in button to your website, you can use the following HTML code:
<a href="https://hubl.in/" target="_blank" class="hublin-link"/></a>
<script type="text/javascript" src="https://hubl.in/embed/button"></script>
where you want the button to appear in your webpage. The a tag will be styled using CSS to look like a button.
To direct your users to a videoconference instead of the hubl.in homepage, you can simply add the conference name in the target URL of the a tag you used to embed the button. For instance, to direct your users to a my-shiny-website conference, you can use the following URL:
https://hubl.in/my-shiny-website
By default the button will be translated in the user's locale, assuming hubl.in is itself available in this language, with a fallback to english. You can however "force" the button to display text and tooltip in a given locale by passing the locale query parameter to the /embed/button URL in the script tag. For instance, if you want the button in french, use:
<script type="text/javascript" src="https://hubl.in/embed/button?locale=fr"></script>
To override the style of the embedded button, simply add a style tag to your HTML document, defining the hublin-widget CSS class.
In this class you can override any CSS attribute of the button.
For instance, if you want red text, simply use:
.hublin-widget {
color: red;
}
<html>
<head>
<style sype="text/css">
.hublin-widget {
color: red;
}
</style>
</head>
<body>
<a href="https://hubl.in/my-shiny-conference" target="_blank" class="hublin-link"></a>
<script type="text/javascript" src="https://hubl.in/embed/button"></script>
</body>
</html>