# MarqueeX

**MarqueeX** enables you to add beautiful and customizable marquee effects to your WordPress site using the **Gutenberg block editor**. This plugin ensures smooth animations, responsive behavior, and SEO-friendly implementation for modern websites.


## Features

- **Horizontal and Vertical Directions**: Create engaging marquee effects in either direction.
- **Customizable Speed and Loop Options**: Fine-tune marquee speed, delays, and looping behavior.
- **Styling Options**: Customize font size, colors, spacing, and more to match your site design.
- **Pause on Hover**: Improve user experience with hover pause functionality.
- **Gutenberg Integration**: Simple and intuitive controls directly in the Gutenberg block editor.
- **SEO Optimized**: Built with search engine visibility in mind to help your content rank better.

## SEO Benefits

- **Search Engine Friendly**: Content remains accessible to search engines despite animation effects.
- **Structured Data Integration**: Automatically adds structured data to improve search engine understanding.
- **Smart Meta Descriptions**: Generates optimized meta descriptions from your marquee content.
- **Social Media Ready**: Adds Open Graph and Twitter Card tags for better social sharing.
- **XML Sitemap**: Creates a dedicated sitemap for pages with MarqueeX content for better indexing.
- **Compatible with SEO Plugins**: Works seamlessly with popular SEO plugins like Yoast SEO, Rank Math, and others.

## Performance & Responsiveness

- **Fully Responsive**: Adapts seamlessly to all screen sizes.
- **Lightweight and Fast**: Optimized for performance and minimal impact on load times.
- **Browser Compatibility**: Works smoothly on all modern browsers.
- **Versatile Applications**: Ideal for announcements, news tickers, and creative animations.

## Installation

1. **Upload & Install**: Upload the `marqueex` folder to the `/wp-content/plugins/` directory, or install it through the WordPress plugins screen.
2. **Activate**: Go to the 'Plugins' screen in WordPress and activate **MarqueeX**.
3. **Get Started**: In the Gutenberg editor, insert the **MarqueeX Slider** block and start adding your content blocks to create sliders.
4. **SEO Settings**: View SEO features and recommendations under Settings > MarqueeX SEO in your WordPress admin.

## Build Process

To build and package the **MarqueeX** plugin, follow these steps:

1. **Install Dependencies**:
   Run the following command to install all required dependencies:
   ```bash
   npm install
   npm run build
   npm run admin
   npm run elementor:dev
   npm run build:all
   ```

## SEO Best Practices When Using MarqueeX

For optimal search engine visibility when using MarqueeX:

1. Use descriptive, keyword-rich text in your marquee content.
2. Include static content alongside marquee content to provide context for search engines.
3. Use appropriate headings (H1, H2, etc.) in your page structure.
4. Set custom meta descriptions for important pages using your SEO plugin of choice.
5. Check your page speed after adding marquee elements to ensure performance remains excellent.