EthicalAd Component

The EthicalAd component is a React library for embedding ethical, privacy-respecting advertisements into your web applications. It integrates seamlessly with the EthicalAds platform to display ads that respect user privacy and avoid tracking.

Features

• Privacy-Respecting Ads: Displays ads without tracking or compromising user privacy.
• Customizable: Supports various customization options such as ad type, keywords, styles, and more.
• Lightweight: Automatically loads the EthicalAds client script only when needed.
• React-Friendly: Built with React, making it easy to integrate into your React applications.

Installation

Install the package using npm or yarn:

npm install react-ethical-ad
# or
yarn add react-ethical-ad

Usage

Here's an example of how to use the EthicalAd component in your React application:

import React from 'react';
import { EthicalAd } from 'react-ethical-ad';

function App() {
  return (
    <div>
      <h1>Welcome to My App</h1>
      <EthicalAd
        publisher="your-publisher-id"
        type="image"
        keywords={['technology', 'privacy']}
        verbosity="normal"
      />
    </div>
  );
}

export default App;

Props

The EthicalAd component accepts the following props:

| Prop Name | Type | Required/Optional | Description | |---|---|---|---| | publisher | string | Required | The publisher ID for your EthicalAds account. | | type | 'image' or 'text' | Optional | Typeof the ad| | id | string | Optional | A unique ID for the ad container. | | style | React.CSSProperties | Optional | Custom styles for the ad container. | | keywords | string[] | Optional | Keywords to target specific ad categories. | | campaignTypes | Array of 'paid' 'publisher-house' 'community' | Optional | Can only limit not extend from what is allowed | | manual | boolean | Optional | Whether to manually control ad loading. | | verbosity | 'quiet' or 'normal' or 'verbose'| Optional | Specifies the verbosity of the logs | |forceAd | string | Optional | Force a specific ad to display. | | forcedCampaign | string | Optional | Force a specific campaign to display. | | placementBotton | boolean | Optional | Whether to place the ad at the bottom of the container. | | className | string` | Optional | Additional CSS class names for the ad container. |

Development

To build or develop the library locally:

1. Clone the repository.
2. Install dependencies:

npm install

3. Start the development server:

num run dev

4. Build the library

npm run build

License

This project is licensed under the MIT License.

Contributing

Contributions are welcome! Please open an issue or submit a pull request for any improvements or bug fixes.

Support

For questions or support, feel free to open an issue or contact the maintainers.

Acknowledgments

This library is powered by EthicalAds, a platform for ethical, privacy-respecting advertisements.