Content Autopilot Integration Guide

Display AI-generated articles on your website to boost SEO and engage visitors. This guide covers integration for all platforms including Shopify, WordPress, React, and vanilla JavaScript.

Overview

Content Autopilot generates SEO-optimized articles that you can display on your website's blog. The articles:

  • Are fully styled with embedded CSS (no additional styling needed)
  • Include proper headings, paragraphs, lists, and callout boxes
  • Work on any website platform
  • Appear on YOUR domain (great for SEO)

Prerequisites

Before integrating, ensure you have:

  1. Reevix SDK installed on your website (SDK Installation Guide)
  2. Content Autopilot enabled in your Reevix dashboard
  3. At least one published article (approve articles in Setup → Content Autopilot)

Quick Start (All Platforms)

Step 1: Verify SDK is Installed

The Reevix SDK should already be on your website. Verify by opening your browser console and typing:

rvx

If you see a function, the SDK is installed. If not, install the SDK first.

Step 2: Fetch Articles List

Add this code to your blog listing page:

rvx('articles', function(articles) {
  console.log('Articles:', articles);
  // articles is an array of:
  // {
  //   slug: "article-url-slug",
  //   title: "Article Title",
  //   path: "/blog/article-url-slug"
  // }
});

Step 3: Fetch Single Article

When displaying a full article, fetch it by slug:

var slug = 'your-article-slug'; // Get from URL

rvx('article', slug, function(article) {
  if (article) {
    console.log('Title:', article.title);
    console.log('Content:', article.content_styled_html);
  }
});

Article Data Structure

When you fetch a single article, you receive:

FieldDescription
titleArticle headline
descriptionShort summary/excerpt
content_styled_htmlFull HTML with embedded CSS - use this for display
content_htmlRaw HTML without styling
categoryArticle category
tagsArray of tags
read_time_minutesEstimated reading time
seo_titleSEO-optimized title for <title> tag
seo_descriptionMeta description for SEO
published_atPublication date

Important: Always use content_styled_html for displaying articles. It includes all necessary CSS for proper formatting.


Shopify Integration

Shopify stores can display Content Autopilot articles using the Reevix Shopify app.

Automatic Setup (Recommended)

If you installed Reevix from the Shopify App Store, articles are automatically available at:

https://your-store.myshopify.com/apps/reevix/blog
https://your-store.myshopify.com/apps/reevix/blog/article-slug

No code changes needed!

Custom Theme Integration

If you want articles on a custom page in your theme:

1. Create a new page template

In your Shopify theme, create templates/page.reevix-blog.liquid:

{% comment %}
  Reevix AI Articles Blog Page
{% endcomment %}

<div class="page-width">
  <h1>{{ page.title }}</h1>
  
  <!-- Article listing container -->
  <div id="reevix-articles" class="blog-articles">
    <p>Loading articles...</p>
  </div>
</div>

<script>
document.addEventListener('DOMContentLoaded', function() {
  // Wait for Reevix SDK
  function loadArticles() {
    if (typeof rvx === 'function') {
      rvx('articles', function(articles) {
        var container = document.getElementById('reevix-articles');
        
        if (!articles || articles.length === 0) {
          container.innerHTML = '<p>No articles yet. Check back soon!</p>';
          return;
        }
        
        var html = '<div class="article-grid">';
        articles.forEach(function(article) {
          html += '<article class="article-card">';
          html += '<a href="/pages/article?slug=' + article.slug + '">';
          html += '<h2>' + article.title + '</h2>';
          html += '</a>';
          html += '</article>';
        });
        html += '</div>';
        
        container.innerHTML = html;
      });
    } else {
      setTimeout(loadArticles, 500);
    }
  }
  
  loadArticles();
});
</script>

<style>
.article-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 2rem;
  margin-top: 2rem;
}
.article-card {
  border: 1px solid #e5e5e5;
  border-radius: 8px;
  padding: 1.5rem;
  transition: box-shadow 0.2s;
}
.article-card:hover {
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
.article-card h2 {
  font-size: 1.25rem;
  margin: 0;
}
.article-card a {
  text-decoration: none;
  color: inherit;
}
</style>

2. Create an article page template

Create templates/page.reevix-article.liquid:

{% comment %}
  Reevix AI Single Article Page
{% endcomment %}

<div class="page-width">
  <a href="/pages/blog" class="back-link">← Back to Blog</a>
  
  <article id="reevix-article">
    <p>Loading article...</p>
  </article>
</div>

<script>
document.addEventListener('DOMContentLoaded', function() {
  // Get slug from URL parameter
  var urlParams = new URLSearchParams(window.location.search);
  var slug = urlParams.get('slug');
  
  if (!slug) {
    document.getElementById('reevix-article').innerHTML = '<p>Article not found.</p>';
    return;
  }
  
  function loadArticle() {
    if (typeof rvx === 'function') {
      rvx('article', slug, function(article) {
        var container = document.getElementById('reevix-article');
        
        if (!article) {
          container.innerHTML = '<p>Article not found.</p>';
          return;
        }
        
        // Update page title
        document.title = article.seo_title || article.title;
        
        // Update meta description
        var metaDesc = document.querySelector('meta[name="description"]');
        if (metaDesc) {
          metaDesc.setAttribute('content', article.seo_description || article.description);
        }
        
        var html = '';
        html += '<header class="article-header">';
        html += '<span class="article-category">' + (article.category || 'Article') + '</span>';
        html += '<h1>' + article.title + '</h1>';
        html += '<p class="article-description">' + article.description + '</p>';
        html += '<div class="article-meta">';
        if (article.published_at) {
          var date = new Date(article.published_at);
          html += '<span>' + date.toLocaleDateString('en-US', { year: 'numeric', month: 'long', day: 'numeric' }) + '</span>';
        }
        html += '<span>' + article.read_time_minutes + ' min read</span>';
        html += '</div>';
        html += '</header>';
        
        // Use content_styled_html for properly formatted content
        html += '<div class="article-content">' + article.content_styled_html + '</div>';
        
        // Tags
        if (article.tags && article.tags.length > 0) {
          html += '<div class="article-tags">';
          article.tags.forEach(function(tag) {
            html += '<span class="tag">' + tag + '</span>';
          });
          html += '</div>';
        }
        
        container.innerHTML = html;
      });
    } else {
      setTimeout(loadArticle, 500);
    }
  }
  
  loadArticle();
});
</script>

<style>
.back-link {
  display: inline-block;
  margin-bottom: 2rem;
  color: #666;
  text-decoration: none;
}
.back-link:hover {
  color: #000;
}
.article-header {
  margin-bottom: 2rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid #e5e5e5;
}
.article-category {
  display: inline-block;
  padding: 0.25rem 0.75rem;
  background: #f0f0f0;
  border-radius: 4px;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 1rem;
}
.article-header h1 {
  font-size: 2.5rem;
  line-height: 1.2;
  margin: 0 0 1rem 0;
}
.article-description {
  font-size: 1.25rem;
  color: #666;
  line-height: 1.6;
}
.article-meta {
  display: flex;
  gap: 1.5rem;
  color: #888;
  font-size: 0.875rem;
}
.article-tags {
  margin-top: 3rem;
  padding-top: 2rem;
  border-top: 1px solid #e5e5e5;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.tag {
  padding: 0.25rem 0.75rem;
  background: #f5f5f5;
  border-radius: 4px;
  font-size: 0.875rem;
  color: #666;
}
</style>

3. Create pages in Shopify Admin

  1. Go to Online Store → Pages
  2. Create a page titled "Blog" and assign template page.reevix-blog
  3. Create a page titled "Article" and assign template page.reevix-article

WordPress Integration

Using a Custom Page Template

1. Create the blog listing template

Create page-reevix-blog.php in your theme folder:

<?php
/**
 * Template Name: Reevix Blog
 */

get_header();
?>

<main class="site-main">
  <div class="container">
    <h1>Blog</h1>
    
    <div id="reevix-articles">
      <p>Loading articles...</p>
    </div>
  </div>
</main>

<script>
document.addEventListener('DOMContentLoaded', function() {
  function loadArticles() {
    if (typeof rvx === 'function') {
      rvx('articles', function(articles) {
        var container = document.getElementById('reevix-articles');
        
        if (!articles || articles.length === 0) {
          container.innerHTML = '<p>No articles available.</p>';
          return;
        }
        
        var html = '<div class="articles-grid">';
        articles.forEach(function(article) {
          html += '<article class="article-card">';
          html += '<a href="<?php echo home_url('/reevix-article/'); ?>?slug=' + article.slug + '">';
          html += '<h2>' + article.title + '</h2>';
          html += '</a>';
          html += '</article>';
        });
        html += '</div>';
        
        container.innerHTML = html;
      });
    } else {
      setTimeout(loadArticles, 500);
    }
  }
  loadArticles();
});
</script>

<style>
.articles-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 2rem;
  margin-top: 2rem;
}
.article-card {
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 1.5rem;
}
.article-card h2 {
  font-size: 1.25rem;
  margin: 0;
}
.article-card a {
  text-decoration: none;
  color: inherit;
}
</style>

<?php get_footer(); ?>

2. Create the single article template

Create page-reevix-article.php in your theme folder:

<?php
/**
 * Template Name: Reevix Article
 */

get_header();
?>

<main class="site-main">
  <div class="container">
    <a href="<?php echo home_url('/reevix-blog/'); ?>" class="back-link">← Back to Blog</a>
    
    <article id="reevix-article">
      <p>Loading article...</p>
    </article>
  </div>
</main>

<script>
document.addEventListener('DOMContentLoaded', function() {
  var urlParams = new URLSearchParams(window.location.search);
  var slug = urlParams.get('slug');
  
  if (!slug) {
    document.getElementById('reevix-article').innerHTML = '<p>Article not found.</p>';
    return;
  }
  
  function loadArticle() {
    if (typeof rvx === 'function') {
      rvx('article', slug, function(article) {
        var container = document.getElementById('reevix-article');
        
        if (!article) {
          container.innerHTML = '<p>Article not found.</p>';
          return;
        }
        
        document.title = article.seo_title || article.title;
        
        var html = '<header>';
        html += '<span class="category">' + (article.category || 'Article') + '</span>';
        html += '<h1>' + article.title + '</h1>';
        html += '<p class="description">' + article.description + '</p>';
        html += '<div class="meta">';
        if (article.published_at) {
          var date = new Date(article.published_at);
          html += '<span>' + date.toLocaleDateString() + '</span>';
        }
        html += '<span>' + article.read_time_minutes + ' min read</span>';
        html += '</div>';
        html += '</header>';
        
        // Use content_styled_html - includes all CSS
        html += article.content_styled_html;
        
        container.innerHTML = html;
      });
    } else {
      setTimeout(loadArticle, 500);
    }
  }
  loadArticle();
});
</script>

<?php get_footer(); ?>

3. Create pages in WordPress Admin

  1. Go to Pages → Add New
  2. Create "Reevix Blog" page, select template "Reevix Blog"
  3. Create "Reevix Article" page, select template "Reevix Article"

React / Next.js Integration

Blog Listing Component

// components/ContentArticles.jsx
import { useEffect, useState } from 'react';
import Link from 'next/link';

export function ContentArticles() {
  const [articles, setArticles] = useState([]);
  const [loading, setLoading] = useState(true);

  useEffect(() => {
    const fetchArticles = () => {
      if (typeof window !== 'undefined' && window.rvx) {
        window.rvx('articles', (data) => {
          setArticles(data || []);
          setLoading(false);
        });
      } else {
        // SDK not loaded yet, retry
        setTimeout(fetchArticles, 500);
      }
    };

    // Give SDK time to initialize
    setTimeout(fetchArticles, 1000);
  }, []);

  if (loading) {
    return <div>Loading articles...</div>;
  }

  if (articles.length === 0) {
    return null; // No articles to show
  }

  return (
    <div className="articles-grid">
      {articles.map((article) => (
        <Link key={article.slug} href={`/blog/${article.slug}`}>
          <article className="article-card">
            <h2>{article.title}</h2>
          </article>
        </Link>
      ))}
    </div>
  );
}

Single Article Page

// app/blog/[slug]/page.jsx (Next.js App Router)
'use client';

import { useEffect, useState } from 'react';
import { useParams } from 'next/navigation';
import Link from 'next/link';

export default function ArticlePage() {
  const params = useParams();
  const slug = params.slug;
  const [article, setArticle] = useState(null);
  const [loading, setLoading] = useState(true);

  useEffect(() => {
    const fetchArticle = () => {
      if (typeof window !== 'undefined' && window.rvx) {
        window.rvx('article', slug, (data) => {
          if (data) {
            setArticle(data);
            // Update page title for SEO
            document.title = data.seo_title || data.title;
          }
          setLoading(false);
        });
      } else {
        setTimeout(fetchArticle, 500);
      }
    };

    setTimeout(fetchArticle, 1000);
  }, [slug]);

  if (loading) {
    return <div>Loading...</div>;
  }

  if (!article) {
    return (
      <div>
        <h1>Article Not Found</h1>
        <Link href="/blog">← Back to Blog</Link>
      </div>
    );
  }

  return (
    <main>
      <Link href="/blog">← Back to Blog</Link>
      
      <header>
        <span className="category">{article.category}</span>
        <h1>{article.title}</h1>
        <p className="description">{article.description}</p>
        <div className="meta">
          {article.published_at && (
            <span>
              {new Date(article.published_at).toLocaleDateString('en-US', {
                year: 'numeric',
                month: 'long',
                day: 'numeric',
              })}
            </span>
          )}
          <span>{article.read_time_minutes} min read</span>
        </div>
      </header>

      {/* Use content_styled_html - includes all necessary CSS */}
      <div
        dangerouslySetInnerHTML={{ __html: article.content_styled_html }}
      />

      {/* Tags */}
      {article.tags && article.tags.length > 0 && (
        <div className="tags">
          {article.tags.map((tag) => (
            <span key={tag} className="tag">{tag}</span>
          ))}
        </div>
      )}
    </main>
  );
}

Vanilla JavaScript Integration

For any website without a framework:

Blog Listing Page

<!DOCTYPE html>
<html>
<head>
  <title>Blog</title>
  <style>
    .articles-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
      gap: 2rem;
      max-width: 1200px;
      margin: 0 auto;
      padding: 2rem;
    }
    .article-card {
      border: 1px solid #e5e5e5;
      border-radius: 8px;
      padding: 1.5rem;
      transition: box-shadow 0.2s;
    }
    .article-card:hover {
      box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    }
    .article-card h2 {
      font-size: 1.25rem;
      margin: 0;
    }
    .article-card a {
      text-decoration: none;
      color: inherit;
    }
  </style>
</head>
<body>
  <h1>Blog</h1>
  <div id="articles-container">
    <p>Loading articles...</p>
  </div>

  <!-- Reevix SDK should already be on your site -->
  <script>
    document.addEventListener('DOMContentLoaded', function() {
      function loadArticles() {
        if (typeof rvx === 'function') {
          rvx('articles', function(articles) {
            var container = document.getElementById('articles-container');
            
            if (!articles || articles.length === 0) {
              container.innerHTML = '<p>No articles available yet.</p>';
              return;
            }
            
            var html = '<div class="articles-grid">';
            articles.forEach(function(article) {
              html += '<article class="article-card">';
              html += '<a href="/article.html?slug=' + article.slug + '">';
              html += '<h2>' + article.title + '</h2>';
              html += '</a>';
              html += '</article>';
            });
            html += '</div>';
            
            container.innerHTML = html;
          });
        } else {
          // SDK not ready, retry
          setTimeout(loadArticles, 500);
        }
      }
      
      loadArticles();
    });
  </script>
</body>
</html>

Single Article Page

<!DOCTYPE html>
<html>
<head>
  <title>Article</title>
  <meta name="description" content="">
  <style>
    .article-container {
      max-width: 800px;
      margin: 0 auto;
      padding: 2rem;
    }
    .back-link {
      display: inline-block;
      margin-bottom: 2rem;
      color: #666;
      text-decoration: none;
    }
    .back-link:hover {
      color: #000;
    }
    .article-header {
      margin-bottom: 2rem;
      padding-bottom: 2rem;
      border-bottom: 1px solid #e5e5e5;
    }
    .article-category {
      display: inline-block;
      padding: 0.25rem 0.75rem;
      background: #f0f0f0;
      border-radius: 4px;
      font-size: 0.75rem;
      text-transform: uppercase;
      letter-spacing: 0.05em;
      margin-bottom: 1rem;
    }
    .article-header h1 {
      font-size: 2.5rem;
      line-height: 1.2;
      margin: 0 0 1rem 0;
    }
    .article-description {
      font-size: 1.25rem;
      color: #666;
      line-height: 1.6;
    }
    .article-meta {
      display: flex;
      gap: 1.5rem;
      color: #888;
      font-size: 0.875rem;
      margin-top: 1rem;
    }
    .article-tags {
      margin-top: 3rem;
      padding-top: 2rem;
      border-top: 1px solid #e5e5e5;
    }
    .tag {
      display: inline-block;
      padding: 0.25rem 0.75rem;
      background: #f5f5f5;
      border-radius: 4px;
      font-size: 0.875rem;
      color: #666;
      margin-right: 0.5rem;
      margin-bottom: 0.5rem;
    }
  </style>
</head>
<body>
  <div class="article-container">
    <a href="/blog.html" class="back-link">← Back to Blog</a>
    
    <article id="article-content">
      <p>Loading article...</p>
    </article>
  </div>

  <script>
    document.addEventListener('DOMContentLoaded', function() {
      // Get slug from URL
      var urlParams = new URLSearchParams(window.location.search);
      var slug = urlParams.get('slug');
      
      if (!slug) {
        document.getElementById('article-content').innerHTML = '<p>Article not found.</p>';
        return;
      }
      
      function loadArticle() {
        if (typeof rvx === 'function') {
          rvx('article', slug, function(article) {
            var container = document.getElementById('article-content');
            
            if (!article) {
              container.innerHTML = '<p>Article not found.</p>';
              return;
            }
            
            // Update page title and meta description for SEO
            document.title = article.seo_title || article.title;
            var metaDesc = document.querySelector('meta[name="description"]');
            if (metaDesc) {
              metaDesc.setAttribute('content', article.seo_description || article.description);
            }
            
            var html = '';
            
            // Header
            html += '<header class="article-header">';
            html += '<span class="article-category">' + (article.category || 'Article') + '</span>';
            html += '<h1>' + article.title + '</h1>';
            html += '<p class="article-description">' + article.description + '</p>';
            html += '<div class="article-meta">';
            if (article.published_at) {
              var date = new Date(article.published_at);
              var options = { year: 'numeric', month: 'long', day: 'numeric' };
              html += '<span>' + date.toLocaleDateString('en-US', options) + '</span>';
            }
            html += '<span>' + article.read_time_minutes + ' min read</span>';
            html += '</div>';
            html += '</header>';
            
            // Content - USE content_styled_html for proper formatting!
            html += article.content_styled_html;
            
            // Tags
            if (article.tags && article.tags.length > 0) {
              html += '<div class="article-tags">';
              article.tags.forEach(function(tag) {
                html += '<span class="tag">' + tag + '</span>';
              });
              html += '</div>';
            }
            
            container.innerHTML = html;
          });
        } else {
          setTimeout(loadArticle, 500);
        }
      }
      
      loadArticle();
    });
  </script>
</body>
</html>

SEO Best Practices

Adding Content Articles to Your Sitemap

For best SEO results, add your Content Autopilot articles to your website's main sitemap. This ensures Google discovers new articles automatically.

Option 1: Dynamic Sitemap (Recommended)

Fetch article routes from the Reevix API and include them in your sitemap generation:

API Endpoint:

GET https://edge.reevix.ai/v1/stores/YOUR_STORE_PUBLIC_ID/content/routes

Response:

{
  "routes": [
    {
      "slug": "reduce-subscription-churn",
      "title": "How to Reduce Subscription Churn",
      "path": "/insights/reduce-subscription-churn"
    }
  ]
}

Next.js Example (app/sitemap.ts):

import type { MetadataRoute } from 'next'

const STORE_PUBLIC_ID = 'your_store_public_id' // From Reevix dashboard

async function fetchContentArticles() {
  try {
    const response = await fetch(
      `https://edge.reevix.ai/v1/stores/${STORE_PUBLIC_ID}/content/routes`,
      { next: { revalidate: 3600 } } // Refresh every hour
    )
    if (!response.ok) return []
    const data = await response.json()
    return data.routes || []
  } catch {
    return []
  }
}

export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
  const contentArticles = await fetchContentArticles()
  
  // Your existing sitemap entries
  const staticPages = [
    { url: 'https://yoursite.com', lastModified: new Date() },
    { url: 'https://yoursite.com/about', lastModified: new Date() },
    // ... other pages
  ]
  
  // Add content articles
  const contentPages = contentArticles.map((article: { slug: string }) => ({
    url: `https://yoursite.com/blog/${article.slug}`,
    lastModified: new Date(),
    changeFrequency: 'weekly' as const,
    priority: 0.7,
  }))
  
  return [...staticPages, ...contentPages]
}

WordPress Example (functions.php):

// Add Reevix articles to sitemap (works with Yoast SEO)
add_filter('wpseo_sitemap_index', 'add_reevix_articles_to_sitemap');

function add_reevix_articles_to_sitemap($sitemap_index) {
    $store_id = 'your_store_public_id';
    $response = wp_remote_get(
        "https://edge.reevix.ai/v1/stores/{$store_id}/content/routes"
    );
    
    if (is_wp_error($response)) return $sitemap_index;
    
    $data = json_decode(wp_remote_retrieve_body($response), true);
    $routes = $data['routes'] ?? [];
    
    foreach ($routes as $route) {
        $sitemap_index .= '<sitemap>';
        $sitemap_index .= '<loc>' . home_url('/blog/' . $route['slug']) . '</loc>';
        $sitemap_index .= '<lastmod>' . date('c') . '</lastmod>';
        $sitemap_index .= '</sitemap>';
    }
    
    return $sitemap_index;
}

PHP/Custom Example:

<?php
// sitemap.php - Generate dynamic sitemap
header('Content-Type: application/xml');

$store_id = 'your_store_public_id';
$base_url = 'https://yoursite.com';

// Fetch content articles
$response = file_get_contents(
    "https://edge.reevix.ai/v1/stores/{$store_id}/content/routes"
);
$data = json_decode($response, true);
$articles = $data['routes'] ?? [];

echo '<?xml version="1.0" encoding="UTF-8"?>';
?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <!-- Your static pages -->
  <url>
    <loc><?= $base_url ?></loc>
    <changefreq>weekly</changefreq>
    <priority>1.0</priority>
  </url>
  
  <!-- Content Autopilot articles -->
  <?php foreach ($articles as $article): ?>
  <url>
    <loc><?= $base_url ?>/blog/<?= htmlspecialchars($article['slug']) ?></loc>
    <lastmod><?= date('Y-m-d') ?></lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  <?php endforeach; ?>
</urlset>

Option 2: Separate Content Sitemap

If you can't modify your main sitemap, create a separate sitemap for content articles:

https://edge.reevix.ai/v1/stores/YOUR_STORE_PUBLIC_ID/content/sitemap.xml?domain=https://yoursite.com&path=/blog

Parameters:

  • domain - Your website URL (required for proper URLs)
  • path - The path prefix for articles (default: /blog)

Then add this sitemap to Google Search Console alongside your main sitemap.

Note: Google prefers sitemaps hosted on the same domain as the content. Option 1 (dynamic sitemap) is recommended for best SEO results.

Meta Tags

The article data includes SEO-optimized fields. Use them:

rvx('article', slug, function(article) {
  // Update page title
  document.title = article.seo_title;
  
  // Update meta description
  document.querySelector('meta[name="description"]').content = article.seo_description;
  
  // Add Open Graph tags dynamically if needed
  // article.title, article.description, etc.
});

Canonical URLs

Articles should have canonical URLs pointing to your domain:

<link rel="canonical" href="https://yourdomain.com/blog/article-slug">

Troubleshooting

Articles not loading

  1. Check SDK is installed: Open browser console, type rvx - should show a function
  2. Check for errors: Look for red errors in browser console
  3. Verify articles exist: Go to Reevix dashboard → Setup → Content Autopilot and ensure you have published articles

Content not styled properly

Make sure you're using content_styled_html (not content_html):

// ✅ Correct - includes CSS
article.content_styled_html

// ❌ Wrong - no styling
article.content_html

CORS errors

If you see CORS errors, ensure:

  1. Your domain is registered in Reevix dashboard
  2. You're using the SDK (not direct API calls)

SDK not defined

If rvx is not defined:

  1. Check the SDK script is in your page's <head>
  2. Wait for SDK to load before calling:
  3. function waitForSDK(callback) {
      if (typeof rvx === 'function') {
        callback();
      } else {
        setTimeout(function() { waitForSDK(callback); }, 500);
      }
    }
    
    waitForSDK(function() {
      rvx('articles', function(articles) {
        // Now it's safe to use
      });
    });
    

Need Help?