FUSION BUILDER LIVE  Compatibility Underway!

Ticket Support Hours: Monday-Friday 9am-5pm Eastern
Please note ticket response may take up to 24-hours.

Okay
  Print

Home    Articles    Snow, Particle & Image Window Effects

Documentation: Snow, Particle & Image Window Effects

Table of Contents

  1. Software Requirements
  2. Recommended PHP Configuration Limits
  1. Installation
  2. Registration
  3. User Guide

i. Software Requirements

  • WordPress 4.6 or higher
  • PHP 5.3 or higher (5.6 recommended)
  • MySQL 5.6 or higher

ii. Recommended PHP Configurations Limits

  • max_execution_time 180
  • memory_limit 128M
  • post_max_size 32M
  • upload_max_filesize 32M

1. Installation

  1. Download the plugin from your CodeCanyon "Downloads" page
  2. Open WordPress, go to plugins, then "Add New"
  3. Click "Upload Plugin"
  4. Upload the plugin .ZIP downloaded from CodeCanyon, then click "Install Now"
  5. Activate the plugin.
  6. Go to Fusion Builder > Settings
  7. Make sure the "ArcticLune Particle Window Effects" element is checked. Click Save Settings.

The element will now be available to add to your pages!

2. Registration

To enable updates including new features and bug fixes, you’ll need to register the plugin. 

After the plugin is activated in the WordPress plugin list, a notification bar will appear near the top of the screen with registration instructions. Once that process is complete, plugin updates will be activated. 

If for whatever reason the notification bar does not show up, you can also register by clicking "Registration" underneath the plugin name. This registration link will only show up if the plugin is activated. 

You can check for updates by going to the WordPress plugin list, and clicking "Check for updates" below the plugin description. 

3. User Guide

This element is designed to be used with the Fusion Builder page builder interface. 


Quick Start Guide

  1. Click the "+ Element" button, then "ArcticLune Particle Window Effects"
  2. Open the element's settings
  3. Use the fields provided to set the particle options, and customize other settings as needed.
  4. Click "Save" to apply the changes
  5. Update the page and view it to see the results!

Sizing note: the Snow, Particle & Image Window Effects is responsive, and will scale to fit the width of its container.


Change the Number of Particles

  1. Open the element's settings
  2. Under the "General" tab, move the "Number of Particles" slider depending on the amount of particles for your design and the performance of the plugin.
    • NOTE: Particle performance is determined by the user's computer. Testing on a few different devices is recommended when using a high number of particles.
  3. If desired, change the "Screen Size Particle Scaling" option to limit the number of particles for mobile and tablet devices.
  4. Click "Save" to apply the changes
  5. Update the page and view it to see the results!


Add a Link to Each Particle

  1. Open the element's settings
  2. Under the "General" tab, enter the link in the "Particle Link" field.
  3. You can set the link to open in the same tab or new tab with the "Link Target" options.
  4. Additionally, other attributes can be added in the "Link Additional Attributes" field.
    • NOTE: You can only use single quotes, and square brackets "[]" should be replaced with curly braces "{}" to ensure the Fusion Builder shortcode isn't corrupted.
  5. Click "Save" to apply the changes
  6. Update the page and view it to see the results!


Place Particle Effects Inside Other Elements

  1. Open the element's settings
  2. Under the "General" tab, enter the CSS selector for the element to place the effect on in the "Show on Element" field.
  3. Click "Save" to apply the changes
  4. Update the page and view it to see the results!


Change the Particle Type

  1. Open the element's settings
  2. Under the "Design" tab, set the "Particle Type" option.
    • NOTE: If choosing the "Snowflake" option, ensure FontAwesome is enabled.
  3. If a custom particle image is selected, upload the particle image in the "Particle Image" field.
    • NOTE: For best performance, resize the image to match the largest particle size.
  4. Click "Save" to apply the changes
  5. Update the page and view it to see the results!


Change the Particle Size and Speed

  1. Open the element's settings
  2. Under the "Design" tab, enter the minimum and maximum size, including units, in the "Particle Size" field.
  3. Enter the minimum and maximum speed in the "Particle Speed" field.
    • NOTE: The speed is approximately in pixels per second.
  4. Click "Save" to apply the changes
  5. Update the page and view it to see the results!

Responsive behavior

Sizing note: the particle window effect is responsive, and will scale to fit the width of its container on smaller screen sizes.  The number of particles will scale depending on the element's settings.