Easy Guide to Embedding Liferaft Benefits in SaaS Apps

In today's competitive SaaS landscape, delivering personalized employee benefits directly within your application can set you apart. Liferaft's embedded benefits platform offers a seamless way for SaaS developers and product managers to boost user engagement by providing tailored benefits that meet your users' needs.

If you're new to integrating third-party platforms or want a straightforward approach, this beginner-friendly, step-by-step guide will walk you through how to embed Liferaft into your vertical SaaS application effectively. Let's dive in!

---

Why Embed Liferaft Benefits?

Embedding benefits directly into your SaaS platform offers several advantages:

• Enhanced User Engagement: Personalized benefits encourage users to interact more with your platform.

• Increased Retention: Offering valuable benefits fosters loyalty.

• Differentiation: Stand out from competitors by providing integrated employee perks.

• Data-Driven Insights: Access to benefit usage data to refine your offerings.

Liferaft's platform is designed to be flexible and developer-friendly, making integration straightforward even for those new to embedding third-party services.

---

Prerequisites

Before starting, ensure you have:

• A Liferaft account (sign up at Liferaft's website)

• Access to your SaaS application's codebase

• Basic knowledge of JavaScript, HTML, and API integration

• Your application's API keys or credentials from Liferaft

---

Step 1: Understand Liferaft's Embed Options

Liferaft provides various embedding options:

• JavaScript Widget: A simple script you add to your app to display benefits.

• API Integration: Fetch benefits data dynamically to customize user experience.

• Single Sign-On (SSO): Seamless login experience for users.

For most beginners, starting with the JavaScript widget is easiest.

---

Step 2: Obtain Your Liferaft Embed Code

1. Log into your Liferaft dashboard.

2. Navigate to the Embeds section.

3. Select the Benefits Widget option.

4. Customize the widget's appearance and settings as needed.

5. Copy the generated embed code.

Example Embed Code:

<script src="https://cdn.liferaft.io/widget.js" data-benefits-id="YOUR_BENEFITS_ID"></script>

Replace YOUR_BENEFITS_ID with your actual benefits identifier.

---

Step 3: Embed the Code into Your SaaS Application

For Web Applications:

Insert the widget code into your application's HTML where you want the benefits to appear, such as the dashboard or user profile page.

<!-- Benefits Widget Placement -->
<div id="benefits-section">
  <!-- Liferaft benefits widget will load here -->
  <script src="https://cdn.liferaft.io/widget.js" data-benefits-id="YOUR_BENEFITS_ID"></script>
</div>

For Single Page Applications (SPAs):

If you're using frameworks like React, Vue, or Angular, you can dynamically load the script:

// Example in React
import { useEffect } from 'react';

function BenefitsComponent() {
  useEffect(() => {
    const script = document.createElement('script');
    script.src = 'https://cdn.liferaft.io/widget.js';
    script.setAttribute('data-benefits-id', 'YOUR_BENEFITS_ID');
    document.getElementById('benefits-container').appendChild(script);
  }, []);

  return <div id="benefits-container"></div>;
}

export default BenefitsComponent;

Replace 'YOUR_BENEFITS_ID' with your actual ID.

---

Step 4: Customize the User Experience

Liferaft allows you to customize how benefits appear:

• Design: Match colors and styles to your app.

• Content: Highlight specific benefits relevant to your users.

• Behavior: Set display triggers like on login, dashboard load, etc.

Consult Liferaft's documentation for advanced customization options.

---

Step 5: Enable Single Sign-On (Optional)

For a seamless user experience, implement SSO so users don't need to log in separately to access benefits.

• Set up OAuth or SAML integration with Liferaft.

• Configure your app to pass user identity tokens.

• Test the login flow to ensure benefits are personalized.

This step enhances user engagement by providing a frictionless experience.

---

Step 6: Track and Optimize

Leverage Liferaft's analytics to monitor how users interact with embedded benefits.

• Identify popular benefits.

• Understand engagement patterns.

• A/B test different benefit displays.

Use these insights to refine your benefits offerings and improve user satisfaction.

---

Real-World Example: Boosting Employee Engagement in HR SaaS

Suppose you're developing an HR SaaS platform. By embedding Liferaft benefits, you can:

• Show personalized wellness benefits to employees.

• Offer financial education resources.

• Promote voluntary benefits during onboarding.

Tracking engagement helps you understand which benefits resonate most, leading to higher retention and satisfaction.

---

Best Practices for Successful Integration

• Start Small: Begin with one benefit widget and expand.

• Test Thoroughly: Ensure benefits display correctly across devices.

• Keep User Data Secure: Follow best security practices, especially when handling SSO.

• Stay Updated: Liferaft updates their SDKs and APIs; keep your integration current.

• Gather Feedback: Ask users for input on the benefits experience.

---

Conclusion

Integrating Liferaft's embedded benefits platform into your SaaS application is a powerful way to enhance user engagement, deliver personalized experiences, and stay ahead in the competitive SaaS market. By following this simple, step-by-step guide, even beginners can implement benefits seamlessly, unlocking new value for your users.

Remember, the key is to start small, test thoroughly, and iterate based on user feedback. As embedded employee benefits continue to trend, leveraging platforms like Liferaft will position your SaaS product for long-term success.

Happy integrating!