Eget design på captcha
Guide til at tilpasse captcha-designet i dit Shoporama-tema med din egen HTML og styling.
Shoporama viser automatisk en captcha, når en bruger indsender en email-adresse uden at være logget ind (fx kontaktformular eller lager-notifikation). Du kan tilpasse captchaens udseende ved at oprette din egen template-fil.
Hvornår vises captchaen?
Captchaen udløses automatisk når:
- En bruger indsender en formular med email uden at være logget ind
- Brugeren har en tom kurv eller ingen kurv
- Forespørgslen mangler en HTTP referer (mistænkelig afsendelse)
- Tilmelding til lagernotifikation (out-of-stock signup)
Sådan laver du din egen captcha
Opret filen captcha.html i dit tema:
- Smarty 4-temaer —
templates/captcha.html - Smarty 2-temaer —
captcha.htmli tema-roden
Tilgængelige variabler
| Variabel | Beskrivelse |
|---|---|
<{$imgstr}> | Base64-kodet PNG-billede med captcha-koden (310×100 px) |
<{$form}> | Skjulte formularfelter med den oprindelige POST-data |
<{$error}> | Sat til true hvis brugeren tastede forkert kode |
Eksempel (Smarty 4)
Vigtigt
Input-feltet skal have name="c" — det er dette felt, Shoporama validerer imod. Koden er 3 tegn og valideres case-insensitivt.
Auto-submit efter 3 tegn
De fleste temaer auto-submitter formularen, når brugeren har tastet 3 tegn. Det kan du implementere med følgende JavaScript:
document.querySelector('input[name="c"]')
.addEventListener('input', function() {
if (this.value.length === 3) {
this.closest('form').submit();
}
});
Du kan style captcha-siden frit med CSS, så længe de tre nødvendige elementer er med: <{$form}>, billedet fra <{$imgstr}>, og input-feltet med name="c".
Har du brug for hjælp? Kontakt os på support@shoporama.dk.