Documentation

Install ReviseFlow

Add visual feedback collection to your website with a single script tag, or integrate the React Native SDK into your mobile app. Both take under 5 minutes.

Web WidgetReact Native SDK

Web Widget

Quick setup

  1. 1. Sign up and create a website project from your ReviseFlow dashboard.
  2. 2. Open the project and copy the widget script snippet.
  3. 3. Paste the snippet before the closing </body> tag on your website — or use GTM / a CMS footer injection field.
  4. 4. Refresh your site. The feedback button appears at the bottom corner.
  5. 5. Submit a test feedback and verify it in your project board.

Using WordPress?

Install the official ReviseFlow WordPress plugin instead of pasting a script tag.

Open official WordPress plugin page
Install official plugin

Script snippet

Add this before </body>. Replace the token with your project-specific widget token.

<script
  src="https://reviseflow.io/widget/bundle.js"
  data-api-base-url="https://reviseflow.io"
  data-widget-token="YOUR_WIDGET_TOKEN"
  defer
></script>

Configuration options

Customize the widget with optional data-* attributes on the script tag.

AttributeDefaultDescription
data-widget-token—Required. Your project token.
data-api-base-urlhttps://reviseflow.ioAPI endpoint. Override only for self-hosted setups.
data-langBrowser langUI language: en, tr, ru, es, de, fr, pt.
data-positionbottom-rightButton position: bottom-right, bottom-left.
data-color#7C3AEDPrimary accent color (hex).

Full example with all options:

<script
  src="https://reviseflow.io/widget/bundle.js"
  data-api-base-url="https://reviseflow.io"
  data-widget-token="YOUR_WIDGET_TOKEN"
  data-lang="en"
  data-position="bottom-right"
  data-color="#7C3AED"
  defer
></script>

Where to paste the script

  • - HTML template (before </body>)
  • - Google Tag Manager — Custom HTML tag
  • - WordPress — install the official ReviseFlow plugin instead
  • - Webflow — Project Settings → Custom Code
  • - Shopify — theme.liquid before </body>
  • - Next.js — <Script> component in layout

Troubleshooting

  • - Confirm the token belongs to the correct project
  • - Verify your page domain matches project settings
  • - Check the browser console for script/network errors
  • - Hard refresh after deployment (Ctrl+Shift+R)
  • - Ensure no ad blocker is blocking the script

React Native SDK

Requirements

  • - React Native 0.72+ (New Architecture supported)
  • - Works with Expo and bare React Native projects
  • - iOS and Android

1. Install

npm install @reviseflow/react-native react-native-view-shot react-native-svg

For bare React Native (non-Expo), run pod install afterward:

cd ios && pod install && cd ..

2. Basic usage

Wrap your root component with the <ReviseFlow> provider. That's it — shake the device to open the feedback modal.

import { ReviseFlow } from "@reviseflow/react-native";

export default function App() {
  return (
    <ReviseFlow token="YOUR_WIDGET_TOKEN">
      {/* Your app content */}
    </ReviseFlow>
  );
}

3. Advanced usage

Use the useReviseFlow() hook for programmatic control, and configure trigger mode, locale, theme, and callbacks.

import { ReviseFlow, useReviseFlow } from "@reviseflow/react-native";

function FeedbackButton() {
  const { open } = useReviseFlow();
  return <Button title="Report Bug" onPress={open} />;
}

export default function App() {
  return (
    <ReviseFlow
      token="YOUR_WIDGET_TOKEN"
      trigger="shake"
      locale="en"
      theme="auto"
      screenNameResolver={() => "HomeScreen"}
      onSubmit={() => console.log("Feedback submitted!")}
    >
      <FeedbackButton />
    </ReviseFlow>
  );
}

Props reference

PropTypeDefaultDescription
tokenstring—Required. Your project widget token.
trigger"shake" | "manual""manual"How to open the modal. Shake uses accelerometer.
localestring"en"UI language: en, tr, ru, es, de, fr, pt.
theme"light" | "dark" | "auto""auto"Color scheme. Auto follows system preference.
screenNameResolver() => string"App"Returns current screen name for feedback context.
onOpen() => void—Called when the feedback modal opens.
onClose() => void—Called when the feedback modal closes.
onSubmit() => void—Called after feedback is submitted successfully.

useReviseFlow() hook

Access the SDK from any child component:

PropertyTypeDescription
open()() => voidCaptures screenshot and opens the feedback modal.
close()() => voidCloses the feedback modal.
isOpenbooleanWhether the feedback modal is currently visible.

After installation

Once the widget or SDK is live, connect your project management tools to keep issues in sync automatically.

ClickUp integration

Enable from project settings. Feedback items sync as tasks with screenshots, device info, and status mapping. Two-way sync included.

Jira integration

Connect your Jira workspace via OAuth. Map priorities and statuses, and sync feedback as Jira issues with full context.

FAQ

Does ReviseFlow work on staging and production websites?

Yes. The widget works on any page that matches the domain set in your project settings. Most teams use it on staging first and optionally keep it on production for internal QA.

Which React Native versions are supported?

The SDK supports React Native 0.72 and above, including the New Architecture. It works with both Expo and bare React Native projects.

Does the widget slow down my website?

No. The script is loaded with the defer attribute so it never blocks page rendering. It only activates on user interaction.

Can I use ReviseFlow with Google Tag Manager?

Yes. Create a Custom HTML tag in GTM and paste the widget snippet. Set the trigger to All Pages or a specific page rule.

How does the React Native SDK capture screenshots?

It uses react-native-view-shot to capture the current screen, then renders an annotation canvas on top. When submitted, the annotated screenshot is uploaded as a PNG.

Does the mobile SDK collect device information?

Yes. It automatically collects platform (iOS/Android), OS version, screen dimensions, and the current screen name. This is attached to each feedback item.

Create your free project

Free plan includes unlimited feedback. No credit card required.