Zalijepi jednom, dalje uređuj iz nadzorne ploče

Cijela ugradnja je ovaj snippet. Radi na svakom stacku koji ti dopušta zalijepiti HTML.

Ugradnja
<div id="recenzo-widget" data-shop="SHOP_ID"></div>
<script src="https://www.recenzo.hr/widget.js" async></script>
Kôd na webu diraš samo jednom

Stil prikaza, broj recenzija, filtar izvora, tema, boja, potpis “Powered by Recenzo” i sve ostalo mijenjaš u Dashboard → Widget. Spremljena promjena vrijedi odmah na svakoj stranici na kojoj snippet stoji, bez ponovnog uređivanja koda i bez novog deploya.

Zamijeni SHOP_ID svojim ID-em tvrtke. Pronađeš ga u Dashboard → Widget, gdje je snippet već popunjen i spreman za kopiranje.

Četiri koraka

  1. 1. Dodaj <div id="recenzo-widget" data-shop="SHOP_ID"></div> na željeno mjesto.
  2. 2. Učitaj /widget.js skriptu asinhrono, najbolje ispod tog diva, jer skripta traži [data-shop] u DOM-u. Ako framework (React, Vue) crta div tek nakon učitavanja stranice, pogledaj React i Next.js vodič.
  3. 3. Ako koristiš allowed origins, dodaj svoju domenu u Dashboard → Widget → Dopušteni origini.
  4. 4. Otvori stranicu, provjeri da vidiš recenzije i da forma “Napiši recenziju” prolazi bez greške u konzoli. Nakon toga se kodu weba više ne vraćaš.

Što se mijenja u nadzornoj ploči

Widget pri svakom učitavanju povuče postavke tvoje tvrtke sa servera. Sve ovo je zato promjena od pet sekundi, a ne posao za developera:

Stil prikaza

Mreža i lista na Freeu, još osam layouta na Pro planu.

Broj recenzija

5, 10, 15 ili sve.

Izvor recenzija

Svi izvori ili samo jedan (Google, QR, widget, mini web).

Tema i naglasna boja

Svijetlo ili tamno i hex boja tvog brenda (Pro).

Vlastiti CSS

Dodatni stilovi unutar widgeta (Pro).

Toast popup

Povremeni kutni popup s recenzijom.

Potpis “Powered by Recenzo”

Plaćeni plan ga smije ugasiti.

Strukturirani podaci (JSON-LD)

Prekidač za rich snippets u Googleu.

Dopušteni origini

Domene s kojih widget smije raditi.

Gdje zalijepiti kod

Primjer na stranici proizvoda
<main>
  <section>Opis proizvoda</section>
  <div id="recenzo-widget" data-shop="SHOP_ID"></div>
</main>
<script src="https://www.recenzo.hr/widget.js" async></script>
Widget se ne prikazuje?
  1. 1. Provjeri da je data-shop tvoj UUID ili demo-shop.
  2. 2. Provjeri da src skripte doslovno odgovara URL-u iz snippeta iznad. Druga domena znači drugi API origin i blokiran CORS.
  3. 3. Provjeri da je div iznad skripte (ili u DOM-u prije nego se skripta izvrši).
  4. 4. Ako koristiš allowed origins, dodaj svoju domenu u dashboardu.
  5. 5. Otvori browser konzolu i provjeri ima li grešaka.
  6. 6. Ako zapneš, javi se na info@recenzo.hr.

Promjena u nadzornoj ploči ne vidi se na webu?

Skoro uvijek postoji samo jedan razlog: netko je u snippet upisao data-* atribut. Atribut nadjačava spremljenu postavku, pa dashboard tu jednu stvar više ne kontrolira. Otvori kôd stranice i makni sve osim data-shop.

Napredno: atributi koji nadjačavaju nadzornu ploču

Ovo je iznimka, ne uobičajena ugradnja. Svaki atribut odavde zamrzava jednu postavku u kodu tvog weba. Od tog trenutka je mijenjaš samo tako da opet uređuješ stranicu, a promjena u nadzornoj ploči na nju više ne utječe. To ljude redovito iznenadi i izgleda kao kvar, pa ako nisi siguran da ti treba, nemoj ga dodati.

Postoji jedan pošten razlog: dva widgeta iste tvrtke na istoj stranici koja moraju izgledati različito. Nadzorna ploča drži jednu postavku po tvrtki pa taj slučaj ne može izraziti.

Zid recenzija gore, uska lista dolje
<div data-shop="SHOP_ID" data-style="masonry"></div>

<div data-shop="SHOP_ID" data-style="list" data-limit="3"></div>

<script src="https://www.recenzo.hr/widget.js" async></script>
AtributVrijednosti
data-stylegrid, list i, na Pro planu, masonry, carousel, badge, toast, spotlight, quote, minimal, socialbar
data-limitbroj kao tekst (npr. 6) ili all
data-sourceall, google, recenzo, widget, qr, booking, tripadvisor, instagram, shopify
data-themelight ili dark (samo plaćeni plan)
data-accenthex boja, #RGB ili #RRGGBB (samo plaćeni plan)

Atributi idu na div, nikad na script tag. Nepoznata vrijednost se ignorira. Plaćeni stilovi te tema i boja provjeravaju se na serveru: na Free planu ih atribut ne otključava. Cijeli tehnički opis, uključujući zastarjeli data-recenzo-schema koji je zamijenjen prekidačem za strukturirane podatke u nadzornoj ploči, stoji u /llms.txt.

Idemo na setup?

Ako još nemaš račun, otvori prvu tvrtku besplatno. Ako si već unutra, skoči ravno na widget snippet i kopiraj kod.

Započni besplatno