Palestine website bar plugin documentation
JavaScript Plugin
The plugin displays a website bar for the support and donation raising for Palestine. Like the one on top if this page or a popup like the one on the corner of this page.
Usage Instructions
Download the JavaScript file then include it in your HTML and the bar will appear automatically:
<script src="palestine-bar.js"></script>
You can customize the content and the appearance of the bar by using one or more the following parameters:
- data-text: The text in the middle.
- data-button-text: The text on the donation button.
- data-bar-mode:The display mode of the bar, it can be one of theses three fixed-header , fixed-footer , popup-left , popup-right , header which is the default.
- data-bg-color: The background color of the bar. default is #000 (Black).
- data-button-color: The color of the donation button. default is #ED2E38 (Red).
- data-text-color: The color of the text. default is #fff (White).
- data-donation-link: The donation link, don't use this parameter if you wish to use the default donation link.
- data-image-link: A URL to the image to be displayed on the Popup.
Like in the following example:
<script src="palestine-bar.js" data-text="أنقذوا أطفال فلسطين" data-button-text="تبرع الان" data-bar-mode="header" data-bg-color="#000" data-button-color="#ED2E38" data-text-color="#fff" data-donation-link="..." ></script>
If you wish to further customize the bar using css, use the following classes: palestine-bar, palestine-bar-flag, palestine-bar-text, palestine-bar-button
WordPress Plugin
The wordpress plugin is a wrapper for the javascript plugin. It even provides a settings page in the wordpress dashboard to facilitate the customization of the palestine website bar.
Installation
- Download the plugin ZIP file: palestine-bar.zip
- Log in to your WordPress admin panel.
- Go to Plugins > Add New.
- Click the Upload Plugin button.
- Choose the ZIP file and click Install Now.
- Activate the plugin after installation.
Once activated the bar will be displayed automatically.
To cutomize the bar:
Plugin installation:
The settings page:
