TextOverImageLightning
🥈SilverA sample Salesforce Marketing Cloud Content Builder block built with the blocksdk, demonstrating how to create custom content blocks for email marketing campaigns.
330Updated 2mo ago
Intermediate30min to implementmarketing
Saves ~45 min per use
Quick InstallView Source
git clone https://github.com/tristonwilliams/TextOverImageLightning.gitWorks with:
Claude
Overview
About This Skill
TextOverImageLightning is a sample content block for Salesforce Marketing Cloud Content Builder that uses the official blocksdk framework. It provides a starting point for developers building custom blocks to extend Marketing Cloud's native functionality. The block can be deployed as a Node.js application or directly to Heroku with one-click deployment. Developers can clone the repository, customize the markup, logic, and configuration, then test locally before deploying. This template streamlines the process of creating reusable content blocks for email marketing workflows.
How to Use
Clone the repository and run `npm install` followed by `npm start` to launch locally on port 3000. Edit src/main.js for custom code, dist/index.html for markup, and package.json for block metadata. Test changes with `npm run build; npm start`, then use the block tester app to preview. Deploy to Heroku using the one-click deploy button when ready.
Use Cases
Creating custom email content blocks for Salesforce Marketing Cloud
Building branded or specialized content components for campaigns
Extending Marketing Cloud Content Builder with proprietary block designs
Testing and prototyping new content block functionality
Setup & Installation
Quick Install
No install command available. Check the GitHub repository for manual installation instructions.
Alternative Install (Git Clone)
git clone https://github.com/tristonwilliams/TextOverImageLightningRequirements
- Claude Code or compatible AI agent
- Works with: Claude
Quick Start Guide
1
Install the Skill
Copy the install command above and run it in your terminal.
2
Open Your AI Agent
Launch Claude Code, Cursor, or your preferred AI coding agent.
3
Try It Out
Use the prompt template or examples below to test the skill.
4
Customize
Adapt the skill to your specific use case and workflow.
Usage Examples
Prompt Template
Create a TextOverImageLightning content block for [COMPANY] in the [INDUSTRY] sector. Use the following [DATA] to generate a compelling visual with overlaid text. The image should be [IMAGE_DESCRIPTION] and the text should be [TEXT_CONTENT]. Ensure the design aligns with [COMPANY]'s brand guidelines, including colors, fonts, and overall aesthetic.
Example Output
# TextOverImageLightning Content Block for GreenTech Solutions ## Image Description A high-resolution image of a futuristic solar panel farm under a clear blue sky, showcasing the latest in renewable energy technology. ## Overlaid Text **Harness the Power of the Sun with GreenTech Solutions** - **Eco-Friendly Energy**: Reduce your carbon footprint with our advanced solar solutions. - **Cost-Effective**: Save on energy bills with our efficient solar panels. - **Innovative Technology**: Cutting-edge design for maximum energy output. ## Brand Guidelines - **Colors**: Green (#2E8B57), White (#FFFFFF), and Blue (#1E90FF) - **Fonts**: Arial, Bold for headings; Arial, Regular for body text - **Aesthetic**: Clean, modern, and professional This content block is designed to capture attention and convey key messages effectively, making it perfect for email campaigns, landing pages, and social media promotions.
Apply to these tools
Browse all toolsCompatible MCP servers
Browse all MCP servers
Find the right skills for your stack
Take a free 3-minute scan and get personalized AI skill recommendations.
Take free scan