How to make post reaction counter?

Ask the community
, ,
1

I want to make post reaction counter as in PlayStation developers pick their favourite games of 2017 – PlayStation.Blog in the end of post. I think its possible with wix code by adding icon buttons and then with onclick function its possible. But I don’t know how to make it work as same in above link, if we click one then number below updates with different colour and if I click other one, the before clicked button gets updated and also number below is updated. If possible can I get code to achieve this on single post page of old wix blog?

1 Like
2

Hi!

You can hide show different components. So, you can have two components, which display value of like amount with differnet color (usual black and selected blue)
So, after onClick on any of oprions, hide previous text component (blue) and show black instead of it. And, do the same process with current component - hide black text comp and show blue one.

Main problem here is that you can’t actually connect them to the posts… Currently, we don’t have any integration to the blog. So it’s not possible to add this set of likes/emotions per each single post

3

Anyways, can you provide me code for any single page of site, so I can add wherever I want!
It would be really helpful!

4

Extending wix blog is not yet possible. We’re aware of the needs and it’s on our roadmap to handle.
For now, please submit your request here: https://www.wix-blog-community.com

5

I dont want to use for blog, I just want to add counter in footer, so users can react to site design. So I need help in code!

6

So following the suggestion above, you can do something that will display the blue text for 2 seconds and then reset back to the black text.
Let’s assume you have an icon button called reaction1 and 2 text components that are connected to the number representing the reactions - blueNumber and blackNumber, your code can look something like this:

export function reaction1_click(event, $w) {
	$w("#blueNumber").show();
	$w("#blackNumber").hide();
	
	setTimeout(function() {
		$w("#blueNumber").hide();
		$w("#blackNumber").show();
	},2000);
	// 2000 is the number of milliseconds until the text reset
}
7

Thank You for your help!