CODEWITHSUNDEEP
phphtmlcssemailhtml-email
Pavan Kumar
Pavan Kumar

Reputation: 406

Ask rating through email

In my application we will get the feedback from the user by sending the emails to them. So that if the user fills the fields and submits then i'm storing it in my database.

I have prepared an html mail which look like this.

This what i am getting in email

But the problem here is i am unable to show the rating stars in the mail. which requires inline css but i am unable to put that css in inline as that includes onhover css.

So is there any way to send the ratings through email.

Is there any way to the css on onhover inline Thank you in advance.

Upvotes: 2

Views: 1598

Answers (3)

Lukasz Czerwinski
Lukasz Czerwinski

Reputation: 15432

You could try adding onMouseOver and onMouseOut attributes to HTML element, but it's possible that Gmail and other email providers will strip it out.

Upvotes: 0

Lukasz Czerwinski
Lukasz Czerwinski

Reputation: 15432

I believe inline CSS is impossible, so you need to find a workaround. Maybe creating a flash applet with an animated star or even all 5 stars that would generate a GET/POST request when clicked? The applet could store a unique ID that would link the GET/POST request with this very form submission that would be sent by the user using Submit button. You need to check that popular webmails don't block flash applets.

Upvotes: 0

John
John

Reputation: 12193

Try over ruling your inline css with !important in your onhover css.

Thinking about the bigger picture however - forms are not fully supported in html email, so depending on your list, you could have 20%+ not able to use them. (form support chart here or here)

With this in mind, for 100% support, most email marketers send them to a landing page that hosts the form instead. Another option is to capture basic information using simple href tags and URL parameters. Something like this:

<!-- use star images that pass a custom url with user info -->
<a href="http://[email protected]&rating=1"><img alt="1" src="" width="40" height="40" style="margin: 0; border: 0; padding: 0;"></a>
<a href="http://[email protected]&rating=2"><img alt="2" src="" width="40" height="40" style="margin: 0; border: 0; padding: 0;"></a>
<a href="http://[email protected]&rating=3"><img alt="3" src="" width="40" height="40" style="margin: 0; border: 0; padding: 0;"></a>
<a href="http://[email protected]&rating=4"><img alt="4" src="" width="40" height="40" style="margin: 0; border: 0; padding: 0;"></a>
<a href="http://[email protected]&rating=5"><img alt="5" src="" width="40" height="40" style="margin: 0; border: 0; padding: 0;"></a>

Upvotes: 10

Related Questions