Widget Kalendarza Online Theraplo

Zintegruj system rezerwacji wizyt ze swoją stroną internetową w kilka minut. Nasz widget działa z każdą stroną HTML, React, Vue, Angular, WordPress i innymi platformami.

Dlaczego widget Theraplo?

  • ✓ Łatwa integracja - wystarczy jeden skrypt JavaScript
  • ✓ Responsywny design - działa na desktop i mobile
  • ✓ Bez przeładowań strony - płynne doświadczenie użytkownika
  • ✓ Automatyczna synchronizacja z kalendarzem Theraplo
  • ✓ Dostosowywalne filtry i widoki

Krok 1: Dodanie skryptu Theraplo

Aby widget działał poprawnie, dodaj poniższy kod JavaScript do sekcji <head> swojej strony HTML lub w komponencie głównym aplikacji:

<script>
  var script = document.createElement("script");
  script.src = "https://theraplo.pl/widget.js"; // URL do skryptu Theraplo
  script.type = "module";
  document.head.appendChild(script);
</script>

Wskazówka: Jeśli skrypt został dodany poprawnie, w konsoli przeglądarki (DevTools, F12) pojawi się komunikat: Theraplo widget loaded

Integracja z popularnymi frameworkami

React / Next.js:

useEffect(() => {
  const script = document.createElement("script");
  script.src = "https://theraplo.pl/widget.js";
  script.type = "module";
  document.head.appendChild(script);

  return () => {
    document.head.removeChild(script);
  };
}, []);

WordPress:

Dodaj kod w Wygląd → Edytor motywu → functions.php lub użyj wtyczki “Insert Headers and Footers”:

add_action('wp_head', function() {
  echo '<script>
    var script = document.createElement("script");
    script.src = "https://theraplo.pl/widget.js";
    script.type = "module";
    document.head.appendChild(script);
  </script>';
});

Krok 2: Wybór typu widgetu

A) Widget z pełną listą specjalistów i filtrami

Wyświetla wszystkich dostępnych specjalistów z możliwością filtrowania po usłudze, lokalizacji i specjalizacji. Idealny dla klinik i większych praktyk.

<div id="practicare-calendar"></div>

B) Widget konkretnego specjalisty

Dedykowany widok dla pojedynczego specjalisty. Świetny dla stron osobistych terapeutów lub podstron poświęconych konkretnym osobom.

<div
  id="practicare-calendar-small"
  data-id="USER_ID"
  data-service-id="SERVICE_ID"
  data-user-service-id="VARIANT_ID"
  data-location-id="LOCATION_ID"
  data-type-id="TYPE_ID"
></div>

Ważne: Zamień wartości w WIELKICH_LITERACH (np. USER_ID) na rzeczywiste identyfikatory z panelu administracyjnego Theraplo.

Szczegóły atrybutów danych

AtrybutOpisGdzie znaleźć w Theraplo
data-idID konkretnego specjalisty. Widget pokaże tylko jego kalendarz.Panel → Specjaliści
data-service-idID usługi. Domyślnie wybiera typ wizyty (np. konsultacja online).Panel → Usługi
data-user-service-idID wariantu usługi przypisanego do specjalisty. Zawęża widok do konkretnego wariantu.Panel → Specjalista → Warianty usług
data-location-idID lokalizacji. Ustawia domyślnie miejsce wizyty (online/gabinet).Panel → Lokalizacje
data-type-idID nurtu terapeutycznego lub specjalizacji.Panel → Nurty

Uwaga: Wszystkie atrybuty są opcjonalne. Użyj ich tylko gdy chcesz ograniczyć lub wstępnie wybrać określone opcje w widgecie.

Krok 3: Dostosowanie wyglądu

Widget automatycznie dostosowuje się do szerokości kontenera. Rekomendowane ustawienia CSS:

/* Podstawowy kontener */
#practicare-calendar,
#practicare-calendar-small {
  max-width: 800px;
  margin: 0 auto;
  padding: 20px;
}

/* Responsywność */
@media (max-width: 768px) {
  #practicare-calendar,
  #practicare-calendar-small {
    padding: 10px;
  }
}

Często zadawane pytania

Czy widget działa na urządzeniach mobilnych?

Tak! Widget jest w pełni responsywny i automatycznie dostosowuje się do rozmiaru ekranu.

Czy mogę mieć wiele widgetów na jednej stronie?

Tak, możesz dodać dowolną liczbę widgetów na stronie, każdy z różnymi parametrami.

Jak widget wpływa na wydajność strony?

Widget jest ładowany asynchronicznie i nie blokuje renderowania strony. Rozmiar skryptu to ok. 50KB (gzip).

Czy widget wymaga jQuery lub innych bibliotek?

Nie, widget jest samodzielny i nie wymaga dodatkowych zależności.

Potrzebujesz pomocy?

Nasz zespół wsparcia chętnie pomoże Ci w integracji widgetu z Twoją stroną internetową.