fab-wa

Unofficial WhatsApp FAB

Options

Option Type Default Description
phone string required WhatsApp phone number
name string required Name in chat header
logo string "bi bi-person" Bootstrap Icons class or image URL
message string "Hi!" Pre-filled message
buttonText string "Start chat" Send button text
greeting string required Text in the chat bubble
fabIcon string "bi bi-whatsapp" Bootstrap Icons class or image URL
primaryColor string "#25D366" Primary color
darkColor string "#128C7E" Dark color (gradient)
<script type="module">
  import FabWa from "https://cdn.jsdelivr.net/npm/fab-wa@latest";

  FabWa.init({
    phone:        "5579999999999",
    name:         "fab-wa",
    message:      "Hi!",
    buttonText:   "Start chat",
    greeting:     "Chat with us on WhatsApp",
    fabIcon:      "bi bi-whatsapp",
    primaryColor: "#25D366",
    darkColor:    "#128C7E",
  });
</script>
// main.ts
import "fab-wa";

// app/app.module.ts
import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from "@angular/core";
import { BrowserModule } from "@angular/platform-browser";
import { AppComponent } from "./app.component";

@NgModule({
  declarations: [AppComponent],
  imports: [BrowserModule],
  schemas: [CUSTOM_ELEMENTS_SCHEMA], // NG8001
  bootstrap: [AppComponent],
})
export class AppModule {}

// app/app.component.html
<fab-wa
  phone="5579999999999"
  name="fab-wa"
  greeting="Chat with us on WhatsApp"
  button-text="Start chat"
  message="Hi!"
  primary-color="#25D366"
  dark-color="#128C7E"></fab-wa>