Pinterest is a great way to get more clicks on your website if you have a visually interesting product or post on your website.

In this article we will break down how I created an RSS feed for a Nuxt website and posted all the listings of the website on Pinterest.

The plan

1. Setup a CMS to store the data.
2. Create a RSS feed in Nuxt.
3. Connect the RSS feed to Pinterest.

Setting up the CMS

I will use Sanity as my CMS.

Creating the RSS feed in Nuxt

// /routes/rss.ts
import { Feed } from "feed";
import sanity from "../../client";
import imageUrlBuilder from "@sanity/image-url";
import { type SanityImageSource } from "@sanity/image-url/lib/types/types";
import { type YupiPack } from "@/types/yupipack";

export default defineEventHandler(async (event) => {
  const feed = new Feed({
    title: "Yupipack Feed",
    description: "Feed Of Artisanal Wine Bags From Guatemala",
    link: "https://yupipack.com",
    feedLinks: {
      json: "https://example.com/rss",
    },
    id: "https://yupipack.com",
    copyright: "All rights reserved 2024, Yupipack",
  });

  // query sanity.
  const builder = imageUrlBuilder(sanity);

  const query = `*[_type=='yupipack']{name, image, description, _createdAt, cool, 'price': model->price, soldOut, availableColors[]->, 'order': model->order, 'lqip': image.asset->metadata.lqip} | order(order desc, cool)`;
  let products: YupiPack[] = [];

  const res = await sanity.fetch(query);
  products = res;

  function urlFor(source: SanityImageSource) {
    return builder.image(source);
  }

  for (const doc of products) {
    let imageUrl = "https://yupipack.com/example.png";

    try {
      imageUrl = urlFor(doc.image.asset).url();
      console.log(imageUrl);
    } catch (err) {
      console.log(err);
    }

    feed.addItem({
      title: doc.name ?? "Anonymous Yupipack",
      id: doc.id,
      date: new Date(doc._createdAt),
      link: `https://yupipack.com`,
      image: {
        type: "image/jpg",
        url: imageUrl,
      },
      description: doc.description,
    });
  }

  return new Response(feed.rss2(), { headers: { "content-type": "text/xml" } });
});

Setting up pinterest.