Feature: PH badge

[bdougie]

Type of feature

🍕 Feature

Current behavior

We need a banner on the landing that includes product hunt specific call outs.

1. Copy stating "we are on product hunt"
2. A product badge showing how many votes we have or # product of the day, etc.

Suggested solution

This banner should only show when the URL has ?utm=producthunt

Additional context

The same banner should be used on the app as well.

Code of Conduct

• I agree to follow this project's Code of Conduct

Contributing Docs

• I agree to follow this project's Contribution Docs

[dev-phantom]

Is there already a design for this?

[bdougie]

Is there already a design for this?

No. But the focus is have a banner. Orange bar with white text works for now.

Copy for the banner

Welcome Product Hunters

We are putting the messaging together.

[dev-phantom]

something like this ?

or this

[bdougie]

After some deliberation. We are going to forgo building our own custom banner and use the standard PH badge instead. https://blog.producthunt.com/new-feature-add-a-product-hunt-upvote-badge-to-your-website-150fb4840809

[shamimbinnur]

.take

[github-actions]

Thanks for taking this on! If you have not already, join the conversation in our Discord

[shamimbinnur]

It's basically an embedding functionality, and we need to collect the embedding script from the Product Hunt page. Since there is nothing posted on behalf of OpenSacued yet on the Product Hunt website, I am unable to collect the embedding script. I will wait and ship the PR once anything is posted on Product Hunt.

[bdougie]

I can add the badge after we go live.

[bdougie]

<a href="https://www.producthunt.com/posts/opensauced?utm_source=badge-featured&utm_medium=badge&utm_souce=badge-opensauced" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=419250&theme=light" alt="OpenSauced - Optimize&#0032;Your&#0032;Open&#0032;Source&#0032;Project&#0032;with&#0032;Deep&#0032;Insights | Product Hunt" style="width: 250px; height: 54px;" width="250" height="54" /></a>

[bdougie]