Cum să creați imagini rollover pentru e-mailuri și pagini de produse

Imaginile care îşi schimbă aspectul atunci când cursorul este plasat deasupra lor sunt cunoscute sub denumirea de imagini de tip „rollover”. Acestea reprezintă un instrument eficient pentru a evidenția produse sau a spori interacțiunea utilizatorilor cu conținutul. Sunt frecvent utilizate în campaniile de e-mail marketing, deși uneori ar putea fi considerate mai puțin potrivite. Deși aceste imagini pot fi construite utilizând CSS și HTML, dacă preferi o metodă simplă, bazată pe interfață grafică, instrumentul Rollover oferit de FreshInbox este soluția ideală.

Înainte de a începe procesul, asigură-te că ai la dispoziție cele două imagini pe care vrei să le incluzi în efectul de rollover. Una dintre imagini va fi vizibilă atunci când cursorul nu se află deasupra, iar cealaltă va apărea atunci când cursorul este poziționat peste ea. Imaginile pot fi în format PNG sau JPG. Încarcă-le pe un serviciu de stocare în cloud sau pe o platformă de partajare a imaginilor, cum ar fi Imgur, apoi accesează instrumentul Rollover de la FreshInbox.

În câmpul „URL imagine primară”, introdu adresa URL a imaginii care va fi afișată inițial, când cursorul nu este deasupra ei. Specifică lățimea și înălțimea acestei imagini. În câmpul „URL imagine alternativă”, introdu adresa URL a celei de-a doua imagini, care va apărea atunci când cursorul este poziționat deasupra.

Mai departe, introdu o adresă URL de redirecționare în câmpul „Link”. Atunci când un utilizator va face clic pe imaginea de tip rollover, va fi direcționat către această adresă. Completează câmpul „Text ALT” și apasă butonul „Generați”. Vei putea vedea o previzualizare a imaginii în partea dreaptă și vei obține codurile necesare pentru a adăuga imaginea pe site-ul tău web sau în email.

Dacă dorești ca imaginea să fie responsivă, activează opțiunea „Scalare imaginea la lățimea containerului”. Totuși, folosește această opțiune doar dacă ești familiarizat cu lucrul cu containere. Pentru o imagine standard, lasă această opțiune dezactivată. Pentru a integra imaginea într-un e-mail sau pe o pagină web, copiază codul generat și inserează-l în secțiunea corespunzătoare a etichetei (de exemplu, în secțiunea Titlu pentru e-mail și în Corp pentru o pagină web). Acesta este tot procesul necesar pentru a crea o imagine de tip rollover.

Accesați instrumentul Rollover de la FreshInbox

Actualizat: 8 decembrie 2020 la 08:37