none
Star rating Email outlook 2010 RRS feed

All replies

  • Not sure what you mean here but here's a guess at your scenario:

    - Your user is looking at an email and you want them to rate it so that others can see your rating.

    If you want this to be based in Outlook, and only for Outlook users, you could create an add-in which renders a Rating control with the Inspector window. Put the rating into a message header. When another user gets it, if they have the same add-in, it will see the header and display your rating.

    - Or, you want users to see an average rating based on all user clicks.

    Use the same mechanism above for getting the click but embed a unique ID into the header rather than the rating. On selection, use a web service call to save the ID and rating (nothing else!). When a user with your add-in gets an email with that header, it calls the web service which uses the total number of ratings and the individual ratings to generate (store) and return an average, which you then display: So any given email would have a rating for Your Rating, and Average Rating.

    Once you call the web service for a given ID you shouldn't call it again until the next time the user opens the mail item - unless you really want it to be highly dynamic, but I think that would be overkill and resource-intensive.

    Now, if you don't want to do an add-in, you could send out emails that have a unique URL. When users click on the URL they open a web page to rate the email. Another URL in the email goes to a server script which generates an image based on the current rating. So each time the user displays the email, it calls to the server to generate a new image - that's assuming the user allows images to populate like that. This solution has the benefit of being cross-client, so your audience is larger than just Outlook users.

    HTH

    Sunday, July 8, 2012 11:46 PM
  • Hi, 

    Thank you very mutch for your response, in fact . I would like create a rating note in email  , if you click in star it's send in database the note (same of http://net.tutsplus.com/tutorials/html-css-techniques/building-a-5-star-rating-system-with-jquery-ajax-and-php/comment-page-1/#comments but conpatible with outlook ) because outlook block many funcition.

    The email it's send for customer for evaluate the solution of her problem (bad , good, very good ...).

    Sample of my code (not work in outlook 2010):

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>CSS Star Rating System</title>
    <style type="text/css">
    /* star rating code - use lists because its more semantic */
    /* No javascript required */
    /* all the stars are contained in one matrix to solve rollover problems with delay */
    /* the background position is just shifted to reveal the correct image. */
    /* the images are 16px by 16px and the background position will be shifted in negative 16px increments */
    /*  key:  B=Blank : O=Orange : G = Green * /
    /*..... The Matrix ....... */
    /* colours ....Background position */
    /* B B B B B - (0 0)*/
    /* G B B B B - (0 -16px)*/
    /* G G B B B - (0 -32px)*/
    /* G G G B B - (0 -48px)*/
    /* G G G G B - (0 -64px)*/
    /* G G G G G - (0 -80px)*/
    /* O B B B B - (0 -96px)*/
    /* O O B B B - (0 -112px)*/
    /* O O O B B - (0 -128px)*/
    /* O O O O B - (0 -144px)*/
    /* O O O O O - (0 -160px)*/


    /* the default rating is placed as a background image in the ul */
    /* use the background position according to the table above to display the required images*/
    .rating{
    width:80px;
    height:16px;
    margin:0 0 20px 0;
    padding:0;
    list-style:none;
    clear:both;

    background: url("http://data.imagup.com/11/1156882418.gif") no-repeat 0 0;
    }
    /* add these classes to the ul to effect the change to the correct number of stars */
    .nostar {background-"Apple-tab-span" style="white-space:pre;">cursor: pointer;
     /*ie5 mac doesn't like it if the list is floated\*/
    float:left;
    /* end hide*/
    text-indent:-999em;
    }
    ul.rating li a {



    width:16px;
    height:16px;
    text-decoration:none;

    }
    ul.rating li.one a {}
    ul.rating li.three a {}
    ul.rating li.four a {}
    ul.rating li.five a {}
    ul.rating li a:hover {

    width:80px;
    height:16px;


    background: url("http://data.imagup.com/11/1156882418.gif") no-repeat 0 0
    }
    ul.rating li.one a:hover {background-}
    ul.rating li.two a:hover {background-}
    ul.rating li.three a:hover {background-font-size:110%}

    </style>
    </head>
    <body>
    <h1> CSS Star Rating System</h1>
    <h2>No Javascript required</h2>
    <h3>No Stars Active</h3>

    <ul class="rating nostar">
    <li class="one"><a href="#" title="1 Star">1</a></li>
    <li class="two"><a href="#" title="2 Stars">2</a></li>
    <li class="three"><a href="#" title="3 Stars">3</a></li>
    <li class="four"><a href="#" title="4 Stars">4</a></li>
    <li class="five"><a href="#" title="5 Stars">5</a></li>
    </ul>

    <h3>1 Star Active</h3>
    <ul class="rating onestar">
    <li class="one"><a href="#" title="1 Star">1</a></li>
    <li class="two"><a href="#" title="2 Stars">2</a></li>
    <li class="three"><a href="#" title="3 Stars">3</a></li>
    <li class="four"><a href="#" title="4 Stars">4</a></li>
    <li class="five"><a href="#" title="5 Stars">5</a></li>

    </ul>
    <h3>2 Stars Active</h3>
    <ul class="rating twostar">
    <li class="one"><a href="#" title="1 Star">1</a></li>
    <li class="two"><a href="#" title="2 Stars">2</a></li>
    <li class="three"><a href="#" title="3 Stars">3</a></li>
    <li class="four"><a href="#" title="4 Stars">4</a></li>
    <li class="five"><a href="#" title="5 Stars">5</a></li>

    </ul>
    <h3>3 Stars Active</h3>
    <ul class="rating threestar">
    <li class="one"><a href="#" title="1 Star">1</a></li>
    <li class="two"><a href="#" title="2 Stars">2</a></li>
    <li class="three"><a href="#" title="3 Stars">3</a></li>
    <li class="four"><a href="#" title="4 Stars">4</a></li>
    <li class="five"><a href="#" title="5 Stars">5</a></li>

    </ul>
    <h3>4 Stars Active</h3>
    <ul class="rating fourstar">
    <li class="one"><a href="#" title="1 Star">1</a></li>
    <li class="two"><a href="#" title="2 Stars">2</a></li>
    <li class="three"><a href="#" title="3 Stars">3</a></li>
    <li class="four"><a href="#" title="4 Stars">4</a></li>
    <li class="five"><a href="#" title="5 Stars">5</a></li>

    </ul>
    <h3>5 Stars Active</h3>
    <ul class="rating fivestar">
    <li class="one"><a href="#" title="1 Star">1</a></li>
    <li class="two"><a href="#" title="2 Stars">2</a></li>
    <li class="three"><a href="#" title="3 Stars">3</a></li>
    <li class="four"><a href="#" title="4 Stars">4</a></li>
    <li class="five"><a href="#" title="5 Stars">5</a></li>

    </ul>More script and css style
    : <a href="http://www.htmldrive.net/" title="HTML DRIVE - Free DHMTL Scripts,Jquery plugins,Javascript,CSS,CSS3,Html5 Library">www.htmldrive.net </a>
    </body>
    </html>

    • Edited by mary000 Friday, July 13, 2012 11:52 PM
    Friday, July 13, 2012 9:27 PM