Fomo Inline

Fomo Inline lets you expose social proof outside of the Fomo notification box you're used to seeing.

You can add social proof text like "35 people bought this in the last 24 hours" wherever it makes sense: to your product pages just below the "add to cart" button, below a newsletter signup button, or anywhere else!

How does it work?

For each supported integration we generate an HTML snippet. You can copy and paste this snippet directly into your HTML (e.g. into your .liquid, .php, or .html file)

You can also paste the code into a Custom HTML or Custom Liquid section directly in your theme editor, allowing you to preview how it looks immediately!

When doing this, make sure you set data-min-count-to-show to 0 so you can see the inline text on the page.

FizzCraft · Customize Dawn · Shopify 2023-11-09 at 8.28.13 AM

Supported integrations

Integration

Sample message

Page Stream

12 people bought this in the last 24 hours

Custom Roundups

13 people signed up in the last 24 hours

Active Visitors

44 people are currently viewing this product/page

If you add the Active Visitors Inline code to your site, the live Active Visitors notification will be turned off. You can turn it back on under Integrations if you want to have both versions visible.

Instructions to set up Fomo Inline

Step 1 - Choose your social proof message

Do you want to show off your visitor count, your sales count, or something else?

Fomo Inline enables you to select from the following 3 integrations:

  • Active Visitors to show off the # of users on that page

    • ex. "34 people are looking at this product right now"

  • Custom Roundups to show off the aggregate count of 1 specific behavior (sale, subscription, review, etc.)

    • ex. "11 people subscribed in the last 24 hours"

  • Page Stream to show off the sales of 1 product over a 30 minute or 24 hour period

    • ex. "28 people purchased this in the last 24 hours"

Step 2 - Go to the Integration page

Navigate to the Page Stream, Active Visitors or Custom Roundups integration and find the "inline options" button.

Go to the Notifications tab > select the integration you chose in Step 1 > under Actions in the bottom left, select "inline options".:

Step 3 - Copy/paste your custom code to your site

Clicking on this button generates HTML code which can be copied/pasted anywhere on your site:

Paste this script directly into the HTML of your site, wherever you want the text to show up!

Step 4 - That's all!

Going forward, the selected Fomo message will show up as text on your site in the exact location where you've placed the script!

The #{{ count }} variable updates from our server each time a visitor loads the page.

Advanced Customizations & Styling

You can edit the Fomo Inline script for some custom options. Let's look at some examples with this script:

🔥 {{ count }} people signed up in the last 24 hours, what are you waiting for?

Please note that display: none is there for a reason. We will switch this property to display: block once the data is loaded fully from our server on our side.

Otherwise, there would be an empty box while the message was loading.

Now you might be wondering how can I add a cool emoji to my Inline well simple you just need to add it directly in your Inline code as follows:

<div class="fomo-inline" data-aid="78566" style="display: none;" data-min-count-to-show="1">
{{ count }} people bought this in the last 24 hours🔥
</div>{
<script async src="https://load.fomo.com/widget/inline/78566.js"></script>

Now as you can see you can add emojis to your Inline feel free to play around adding them in different positions and more, if you are having trouble rendering them on your store try using Hexadecimal code instead like follows:

&#x1f525;

You can also bold the entire message using <strong> </strong> tags,


If you need help with additional custom styling chat with a support specialist.



FAQs

1. I want to show off aggregates sales of a product. How do I turn on Fomo Inline for this?

Page Stream needs to be enabled and set up first if you want to use it for Fomo Inline. Page Stream displays the popularity of each product separately with messages like "5 sneakerheads bought these in the last 24 hours".

Go to Notifications > Page Stream. Make sure you select the settings you want:

Then, you can continue to click "inline options" to generate your snippet:

Wait for a few hours.

Page Stream starts counting purchases from 0 after you connect the integration. This is why it takes up to 24 hours to show the expected count in the message.

If you have waited 24 hours and still are not seeing a message, reach out to support!


3. [For Shopify stores only] Will Fomo inline work for my Shopify store's custom theme?

Setup is pretty straightforward for Shopify stores. However, it might be tricky to set up a Page Stream integration on custom themed stores if you are using customer-facing URLs vs Shopify-specific URLs.

Contact support if you need help placing the Fomo Inline snippet on your Shopify store.

Important to consider for all Shopify user regardless of the Theme, that for Page Stream Inline notifications to work first:

  • Shopify Integration must be connected, active and enabled.
  • Shopify Order Template must be on

Why? because Page Stream will pull the sales information from the Shopify integration and more specific from the Shopify Order Template, if you don't want to show the Shopify Order Notifications there are a few workarounds to hide it you can either:

  • Use Page Rules to hide that template,
  • Use Flows to Create a Default Flows that doesn't includes that notification,
  • Reach out to Support and we will offer you alternatives,

4. My Page Stream Inline doesn't show anything - what's going on?

Keep in mind our script matches the URL of the visitor's current page with the URL variable for your Events. If URLs don't match, Page Stream won't work.

You can check whether your URLs match by going to your Events tab, hovering over one event, and clicking "edit". You'll see the URLs we capture for each event under "event URL". These URLs must match what the visitor sees in their browser when they are visiting your product page.

5. How are Fomo Inline impressions counted?

There is one Fomo Inline message per page load. So, each page load counts as 1 impression. You can check out total impressions on your Dashboard.

  1. I am not able to see my Inline Notification and I followed all the steps from before (Shopify Users Only)

Remember that you are adding a Custom HTML code into Liquid, so you might encounter rendering issues, so first double check as follow:

  • Check that you set the minimun value to display to 0
  • Make sure that you double check your notifications settings, meaning if: it is Active Visitors what is the counter period, if it is Page Stream have I enabled everything as mentioned before do I have recent orders captured, did I wait for the 24 hours that we recommend after adding the PageStream Inline and for Custom Roundups what is my source template is it the correct one is that template actually collecting data

Now if you have indeed checked on all of this and you are still not able to see it rendered on your store, then it probably means that you will need to add the raw endraw wrap around it, if you want to know more about the raw wrap and how does it work you can follow the Shopify Dev documentation here


Now try adding it to the Inline as follows in the example:

{% raw %}<div class="fomo-inline" data-aid="785655" style="display: none;" data-min-count-to-show="0">
{{ count }} people bought this in the last 24 hours!
</div>{% endraw %}
<script async src="https://load.fomo.com/widget/inline/785655.js"></script>

If you tried all of this and it is still not working feel free to reach out to our team right here

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.