Skip to content

ExtractingCMSData.md

Latest commit

 

History

History
46 lines (33 loc) · 2.98 KB

ExtractingCMSData.md

File metadata and controls

46 lines (33 loc) · 2.98 KB

How to Extract JSON Data from CMS Search in Framer (Unofficial Method)

Overview

This guide explains how to extract JSON data from the search component of a CMS in Framer. This method is unofficial and involves using the browser's developer tools to access the search index data. It's important to note that this method is not officially supported by Framer, and the structure of the data may change without notice.

Prerequisites

  • A website built with Framer that includes a search component.
  • Basic understanding of web browsers and using developer tools.

Steps

  1. Add a Search Component to Your Framer Site

    • Edit your site in Framer and add a search component to any page. This component is necessary to trigger the creation of the search index.

  2. Publish Your Site

    • Once the search component is added, publish your site to make it live (You could just preview as well if you already published your site in the past). This step is crucial as the search index is generated for the live site.

  3. Visit Your Live Site

    • Open a web browser and go to the URL of your live Framer site.

  4. Trigger the Search Component

    • Interact with the search component on your site. This can be done by entering a search query or simply clicking on the search field to activate it.

  5. Open Browser Developer Tools

    • Right-click on any part of the web page and select Inspect to open the browser's developer tools. Alternatively, you can use keyboard shortcuts like Ctrl+Shift+I (Windows/Linux) or Cmd+Opt+I (Mac).

  6. Navigate to the Network Tab

    • In the developer tools, find and click on the Network tab. This tab shows all network requests made by the page.

  7. Find the searchIndex Request

    • With the Network tab open, look for a network request named something like searchIndex. This request is responsible for fetching the search data.
    • You might need to refresh the page and interact with the search component again to see this request.

  8. Copy the Request URL

    • Click on the searchIndex request to view its details.
    • Find and copy the Request URL. This URL is the direct link to the JSON file containing the search index data.

  9. Access and Save the JSON Data

    • Paste the copied URL into a new browser tab and press Enter. This should display the JSON data.
    • Right-click on the page and select Save as to download the JSON file.
    • Alternatively, you can copy the JSON data and save it in a text editor as a .json file.

Notes

  • Storing the JSON Data: Since this is an unofficial method, it's recommended to store a copy of the JSON file. This ensures you have a stable version of the data, as the original source might change unexpectedly.
  • Usage Considerations: Be mindful of how you use this data. Since this method is not officially supported, it may not comply with Framer's terms of service.
  • Check for Updates: Regularly check if Framer has introduced any official API or changes that might affect this method.