Lokke Sponsor Marquee Plugin

A WordPress plugin for Elementor that displays sponsors as animated scrolling marquee with seamless infinite loop animation.

Installation

1. Upload the plugin to your WordPress wp-content/plugins/ directory
2. Activate the plugin via the WordPress admin panel under "Plugins"
3. Make sure Elementor is installed and activated

Usage

1. Open the Elementor editor for a page or post
2. Search for "Lokke Sponsor Marquee" widget in the widget list
3. Drag the widget to your page
4. Configure sponsors and settings

Data Source Selection

The widget offers two data sources:

QT Sponsor API (Automatic)

Automatic retrieval of sponsors via the QT API:

• Uses WordPress base URL with /wp-json/wp/v2/qtsponsor endpoint
• Displays logo and name
• Automatic caching for better performance
• External Links: Supports linkurl custom field for sponsor websites
  • Links open in new tab/window for external URLs
  • Priority: linkurl custom field → WordPress post link

Manual Input

Add sponsors manually:

• Sponsor Name: The name of the sponsor (for alt-text and accessibility)
• Sponsor Logo: Upload the sponsor logo
• Sponsor URL: Optional - link to sponsor website

Technical Details

File Structure

lokke-sponsor-marquee/
├── elementor-sponsors-marquee.php    # Main plugin file
├── widgets/
│   └── sponsors-marquee-widget.php   # Elementor widget class
├── assets/
│   ├── css/
│   │   └── sponsors-marquee.css      # Widget styles
│   └── js/
│       └── sponsors-marquee.js       # Widget JavaScript
├── languages/                        # Translation files
└── README.md                         # This file

CSS Classes

### CSS Classes

```css
.sponsors-marquee-container     # Main container
.sponsors-marquee-wrapper      # Wrapper for overflow handling
.sponsors-marquee-content      # Animated content container
.sponsor-item                  # Individual sponsor container
.sponsor-logo                  # Logo container