Ok we use the buind in google bloger reaction system and:
we set the reaction to Like , Love , Xaxa , Wow , Cry , Angry
and put a image to the end (buttom) of every post with the emotions
IMPORTAND !!! we setup the image to original size and remove formating , we upload the image ONCE then we put to the buttom every post using the Image / Insetr from this blog option
but all that is not enough we need some CSS code to zero the distanse betwen the post and the post elements.
So we goto Theme / Edit / Advanced / Ass CSS and add some code
.post-footer { margin: 0; }
Done
But is not perfect we still searhing CSS code to zero the top magrin in reaction-iframe element
NEW UPDATE !!!
SOLVED no need to paste the image to every post , just put the image on your template
1. Backup your theme
2. Theme
3. EDIT Html
4. Find code: ( CTRL+F 'reaction-buttons' )
<span class='reaction-buttons'>
<b:if cond='data:top.showReactions'>
5. Add this code after
<div dir='ltr' style='text-align: left;' trbidi='on'><img src='your reaction emotions image here'/></div>
See the example