Skip to content

New Components - alttextlab #17624

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 5 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 16 additions & 0 deletions components/alttextlab/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
# Overview

AltTextLab's API provides powerful AI-generated alternative text for images - enhancing SEO, accessibility, and automation workflows. With Pipedream, you can create workflows that generate alt text for images automatically, connect it with your CMS or e-commerce platform. Pipedream’s serverless architecture lets you trigger these workflows on events, schedules, or incoming webhooks without maintaining your own infrastructure.
# Example Use Cases

- **Automated SEO Optimization for E-commerce**: Automatically generate alt text for new product images uploaded to a Shopify or WooCommerce store and save the metadata to your CMS or database.

- **Content Publishing Pipelines**: When a new blog post with images is published in your CMS (e.g., Ghost, WordPress, Webflow), send the image URLs to AltTextLab, generate alt text, and attach it back to the post or send it via email for editorial review.

- **Bulk Image Processing for Media Libraries**: Periodically scan a folder in Dropbox, S3, or Google Drive for new images and generate alt text descriptions for accessibility compliance and tagging.

# Getting Started

To get started, first log in to or create your [Pipedream account](https://pipedream.com) and start a new workflow.

Go to [AltTextLab](https://www.alttextlab.com/) and create an account (or log in if you already have one). Then, in the Dashboard, navigate to the API Keys section, generate a new API key, and copy it — you’ll use this key to authenticate your requests.
Original file line number Diff line number Diff line change
@@ -0,0 +1,89 @@
import altTextLab from "../../alttextlab.app.mjs";
import { AI_WRITING_STYLE } from "../../common/constants.mjs";

export default {
key: "alttextlab-generate-alt-text",
name: "Generate Alt Text",
description: "Generates alt text for images using AI. [See the documentation](https://www.alttextlab.com/docs/api)",
version: "0.1.0",
type: "action",
props: {
altTextLab,
alert: {
type: "alert",
alertType: "info",
content: "Supported formats: PNG, JPG, WebP, AVIF, SVG",
},
imageUrl: {
type: "string",
label: "Image URL",
description: "Provide the direct URL to the image you want to generate alt text for. Make sure the link is publicly accessible (not behind a login or firewall).",
},

lang: {
type: "string",
label: "Language",
description: "Enter the language code for the alt text generation (e.g., \"en\" for English, \"fr\" for French). See the [full list of supported languages](https://www.alttextlab.com/docs/api#language)",
default: "en",
},
style: {
type: "string",
label: "AI writing styles",
options: AI_WRITING_STYLE,
description: "Alt-text writing styles define the tone, structure, and level of detail used to describe an image. [Learn more](https://www.alttextlab.com/docs/writing-style)",
default: "neutral",
},
keywords: {
type: "string[]",
label: "Keywords",
description: "Enter one or more keywords to alt text generation. Separate multiple keywords with commas. Example: cat, window, sunset.",
optional: true,
},
ecommerceProduct: {
type: "string",
label: "Ecommerce Product Name",
description: "The name of the product.",
optional: true,
},
ecommerceBrand: {
type: "string",
label: "Ecommerce Product Brand",
description: "The brand of the product.",
optional: true,
},
ecommerceColor: {
type: "string",
label: "Ecommerce Product Color",
description: "The color of the product.",
optional: true,
},
ecommerceMaterial: {
type: "string",
label: "Ecommerce Product Material",
description: "The material of the product.",
optional: true,
},
},
async run({ $ }) {
const response = await this.altTextLab.altTextGeneration({
$,
data: {
source: 'pipedream',
imageUrl: this.imageUrl,
lang: this.lang,
style: this.style,
keywords: this.keywords,
ecommerce: {
product: this.ecommerceProduct,
brand: this.ecommerceBrand,
color: this.ecommerceColor,
material: this.ecommerceMaterial,
},
},

});

$.export("$summary", `Alt text has been generated`);
return response;
},
};
32 changes: 32 additions & 0 deletions components/alttextlab/alttextlab.app.mjs
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
import { axios } from "@pipedream/platform";

export default {
type: "app",
app: "alttext_ai",
propDefinitions: {},
methods: {
_baseUrl() {
return "https://app.alttextlab.com/api/v1";
},
_headers(headers) {
return {
...headers,
"x-api-key": `${this.$auth.api_key}`,
};
},
async _makeRequest({$ = this, path, headers, ...otherOptions}) {
return axios($, {
url: this._baseUrl() + path,
headers: this._headers(headers),
...otherOptions,
});
},
async altTextGeneration(args) {
return this._makeRequest({
path: "/alt-text/generate",
method: "POST",
...args,
});
},
},
};
18 changes: 18 additions & 0 deletions components/alttextlab/common/constants.mjs
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
export const AI_WRITING_STYLE = [
{
label: "Descriptive",
value: "descriptive",
},
{
label: "Neutral",
value: "neutral",
},
{
label: "Matter of fact",
value: "matter-of-fact",
},
{
label: "Minimal",
value: "minimal",
},
]
18 changes: 18 additions & 0 deletions components/alttextlab/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
{
"name": "@pipedream/alttextify",
"version": "0.1.0",
"description": "Pipedream AltTextLab Components",
"main": "alttextlab.app.mjs",
"keywords": [
"pipedream",
"alttextlab"
],
"homepage": "https://pipedream.com/apps/alttextlab",
"author": "Pipedream <[email protected]> (https://pipedream.com/)",
"publishConfig": {
"access": "public"
},
"dependencies": {
"@pipedream/platform": "^3.0.3"
}
}