INSTAGRAM FEED DOCS

The ultimate FAQ and important notes for Instagram Feed.

About the Component

Attributes must not be removed as they are required for the Component to work

Custom attributes applied to generated elements must not be removed as this will cause the solution to malfunction.

Component elements must not be moved outside the instance wrapper.

To maintain app functionality and edit mode, all Component elements must remain inside the instance element that wraps all other elements.

The code must not be exported and the website must not be hosted on an external server

Currently, Webflow does not support exporting website code with the script generated by the app required for Component functionality. When code is exported from Webflow and hosted on an independent server, Finsweet Components will not function.

Components' elements can be moved as long as they remain inside their instance wrapper

For example, the Like and Comments counters can be moved, and the navigation arrows and pagination wrapper in the Slider layout can be repositioned. All moved elements must remain inside the instance wrapper. The Component will function as long as those elements' custom attributes are preserved and they remain inside the instance.

Changes can be made to classes generated by Finsweet Components

Finsweet Components does not rely on classes to function. Classes can be changed, renamed, and duplicated as needed. Full control over class organization and naming convention is available for the Component.

Any Component can be edited by selecting the instance wrapper and opening the app

"Edit mode" can be accessed for any Component by selecting the component in Webflow Designer and opening Finsweet Components. Many options are available to update the Component at any point in the development process.

To prevent Component issues, some options are disabled in edit mode. If a disabled option is needed, generating a new Component is recommended.

Alternatively, if a Component is selected when launching the app, clicking the "Edit selected" button on the first screen of the App will jump directly to edit mode for that component.

Components can be duplicated multiple times within the same Webflow project

Any Component instance wrapper can be selected, copied to clipboard, and pasted as needed in Webflow Designer.

Multiple integrations can be performed on the same site or page

As many Access Tokens as needed can be used to create multiple Instagram Feeds on a page, representing different Instagram accounts.

Are API rate limits and Access Token validity concerns?

API rate limitations: There are no issues with Instagram's API rate limitations. Within the first API call, Finsweet Components sets the cache and all subsequent calls hit the cache rather than making new API requests. This means high traffic websites will not encounter rate limiting problems, as the cached content serves all visitors without additional API calls.

Access Token validity: Access Tokens initially have a short-lived validity of 1 hour, extendable to 60 days, and traditionally require renewal after 60 days. However, Finsweet Components automatically renews the Token periodically, eliminating the recurring need for manual renewal.

No actions needed on the site for it to reflect last changes on Instagram

The site does not require manual updates, as both posts and profiles are cached. The cache refreshes every 12 hours, so any new posts will appear automatically after that period. Content can simply be uploaded to Instagram, and it will show up within 12 hours.

If the component needs to refresh immediately, it can be recreated, or more simply, one of its key settings can be changed, such as the number of posts shown in the feed.

About Instagram Feed as a Slider

To style the active slide, a combo class is-slide-active can be added to the slide item

The solution adds the combo class is-active-slide by default to the active slide on the published website, and this class can be styled as desired to show the active slide state. The active slide class name can optionally be changed in the configure tab.

About styling & interactions

The Component can be styled and customized as desired by only working on the first item

The Webflow Style panel can be used to customize the Grid or Slider layouts elements, such as Like and Comments counters, post description, slides, pagination, navigation... as there are no design limitations for Finsweet Components.

Only the first item needs to be populated and styled. Its content and styles will propagate to all other items on publish. If you want to achieve a better looking grid in the Designer, simply delete all items but the first one, and duplicate the first one as desired once styled. You can also use a Webflow Component to keep them all in sync in the Designer.

Technical notes about Instagram Feed

Built on Reliable Technologies

The Instagram feed is built on Instagram's APIs and Swiper.js and typescript.

An Instagram access token (a special code starting with 'IGAA') is the only requirement, and the system will automatically display the latest posts on the website. Posts are kept cached for faster loading and can be configured to show a specific number of posts.

Advanced Functionality with Automated Management

The Instagram Feed features a powerful slider built on Swiper.js, the most capable open-source slider library, which provides responsive, touch-enabled functionality. The system handles all technical processes behind the scenes, including maintaining the connection to Instagram, while the Swiper integration ensures smooth slideshows of Instagram content.

About the plans

What will happen to my current subscription for all components?

The special launch offer with the 'all components' subscription is no longer available. Subscribers to this plan will keep the $10 monthly price for all current and future components as long as they maintain the subscription.

‍

How do bulk discounts work?

Bulk discounts apply to Project Lifetime plans only.
Designed for agencies, freelancers, and big projects.
All Components must be purchased in a single checkout to qualify for a bulk purchase discount.
You can purchase any combination of Components to qualify for bulk discount. For example, you can purchase 6 Slider Components, 2 Tabs Components, and 4 Cookie Consent Components to quality for the 10+ Components discount.
You can use purchased Components on any site at any time. Once you assign a domain to a Project Lifetime purchase, that domain is "locked in" for that Component. However, there's no time limit to set the domain. You can choose to assign a domain at any point in the future, and the Component will activate on that domain once it's locked in.
‍

Buy 3-5 Components = 15% discount
Buy 6-9 Components = 25% discount
‍Buy 10+ Components = 30% discount

What if my domain name changes?‍

Monthly/Annual subscriptions:

You can change your domain name at any time in the future while paying for the subscription. If you want to use your subscription with a different domain, go to my.finsweet.com/subscriptions, find your subscription, and change your site domain URL.

Project Lifetime plan:

You can change your domain name at any time in the future, as long as it's for the same project or company. When you're buying Project Lifetime, you're buying the ability to use the Component for the lifetime of the project.

We'll be lenient with domain changes, but will not allow abuse of the pricing model. We will not accept domain name changes that are clearly for different projects.

What is a Project Lifetime plan and who is this for?

Finsweet Components will work on the published page forever after your one-time payment. Purchase "Project Lifetime", set the domain name, and the Component will work on that domain forever — without any further costs or payments. This plan is for:

Anyone who doesn't want to manage a subscription for the website they are building.
Freelancers or agencies who are building websites for client projects. You may not want ongoing payments after a website is delivered. Pay once for the Component, lock it into the domain, and forget about ongoing costs.

Can I cancel my subscription at any time?

Yes, you can cancel your subscription at any time. It's important to understand that all Components created using Finsweet Components will stop working on your production website.

Can I use one subscription for multiple custom domains in my Webflow project?

Yes, the subscription is per Webflow project and is connected to the Webflow project site ID. If you have multiple domains connected to your project, they will all work with a single subscription.

Is there a limit to the number of Component loads on a website?

Monthly/Annual subscription:
Up to 1M views per month. If you want unlimited views, buy a Project Lifetime plan.

Project Lifetime plan:
‍No, there is no limit to the number of loads on a website with the Project Lifetime plan. Both staging and custom domains have unlimited loads per month.

Is there a limit to the number of Components per project?

No, there is no limit to the number of Components you can use in a Webflow project. As long as you have a subscription or Project Lifetime plan for the Components, you can use as many Components as you want.

How can I instruct my client to get a subscription for their project?

In your client's project, go to the Finsweet Components app and click on the 'Get a subscription' button to be redirected to the checkout. Share this link with your client to complete the checkout process.

What happens if my subscription expires?

If your subscription expires, the Components used on your website will stop working. They will resume working when you reactivate your subscription. We will reach out to you many times before 'turning off' Finsweet Components in your project. We will not show a broken Component on your project. Instead, we will completely remove the entire Component from the page.

Do I need a paid plan to use the Finsweet Components app?

No, the Finsweet Components app is free to access and use. You do not need a paid plan to generate beautiful sliders in Webflow and publish them to your staging webflow.io domain, for example. However, you will need a paid plan if you want to publish Components on your custom domain.

How do the plans work?

Finsweet Components are free to use on staging .webflow.io URLs. If you want to use the Components on your custom domain, an active plan is required. Subscriptions and Project Lifetime plans are per project, and each project that uses Finsweet Components in production requires an active plan.

Still need help?

Get Support

Watch Tutorial