Getting Started

What you’ll need

Before you begin:

• A WordPress site running version 5.8 or newer.
• Administrator access to install and activate plugins.
• A page or post where you want to embed your composition.

That’s all. No coding knowledge required.

1. Install the Plugin

There are two ways to install Physicks, depending on which plan you’re using.

Free version

1. In your WordPress admin, go to Plugins → Add New.
2. Search for Physicks.
3. Click Install Now, then Activate.

You’ll see a new Physicks menu in the admin sidebar.

Pro or Business version

1. After purchasing, you’ll receive an email with a download link to a .zip file and your license key.
2. In your WordPress admin, go to Plugins → Add New → Upload Plugin.
3. Choose the .zip file and click Install Now, then Activate.
4. Go to Physicks → Settings, paste your license key, and click Activate.

You’ll see your plan badge change from FREEto PRO or BUSINESS.

2. Create your first composition

1. In the admin sidebar, click Physicks → Add New.
2. You’ll see a gallery of templates. Pick the one that best matches what you want to build. The Free version includes Blank Canvas, Falling Objects, Bouncing Balls, and Click to Drop. Physicks Pro adds Floating Bubbles, Collision Arena, Magnetic Cursor, Image Gallery, and Text Cloud:
   • Falling Objects — objects fall from the top of the canvas.
   • Floating Bubbles — objects drift gently across the screen.
   • Collision Arena — objects bounce off each other and the canvas borders.
   • Bouncing Balls — objects start with motion and bounce naturally.
   • Click to Drop — objects fall when the visitor clicks.
   • Magnetic Cursor — objects react to the visitor’s mouse.
   • Image Gallery — display images that respond to physics.
   • Text Cloud — words behave as physical objects.
   • Blank Canvas — start completely from scratch.
3. Click on a template to enter the editor with that configuration pre-loaded.

If you’re not sure where to start, Falling Objects is a great first template — it’s visually striking and easy to customize.

3. Customize your composition

Once you’re in the editor, you can:

• Add objects by clicking the + button in the top toolbar.
• Move objects by dragging them on the canvas.
• Resize and rotate using the handles around a selected object.
• Edit properties of any object using the panel on the right (shape, colors, borders, behavior).
• Adjust physics for the entire composition using the panel at the bottom (gravity, bounce, friction, collisions).

To preview the result, click the Play button in the top toolbar. The simulation runs live inside the editor, so you can see how your composition behaves before publishing.

For a complete tour of the editor, see the Editor Overview.

4. Save your composition

When you’re happy with the result, click Save in the top toolbar.

Your composition is now stored in your WordPress site and ready to be embedded anywhere.

After saving, you’ll see a unique shortcode for your composition near the title, in the format:

[physicks id="123"]

Copy this shortcode — you’ll use it in the next step.

5. Embed it on a page

There are three ways to embed your composition. Pick the one that fits your workflow.

Using the shortcode

1. Open the page or post where you want the composition to appear.
2. Paste the shortcode [physicks id="123"] wherever you want it to render.
3. Save or update the page.

That’s it — visit your page on the frontend and your composition will be there, fully interactive.

Using the Gutenberg block

1. In the WordPress block editor, click the + to add a new block.
2. Search for Physicks and select it.
3. Choose your composition from the dropdown.
4. Save the page.

Using a page builder (Elementor, WPBakery, etc.)

Use the shortcode method. Most page builders include a “Shortcode” widget or element where you can paste [physicks id="123"].

6. Make it responsive (optional)

If your composition needs to look different on tablet or mobile, switch to the corresponding view in the editor (Desktop / Tablet / Mobile toggle in the top toolbar) and adjust positions, sizes, or colors as needed.

Each breakpoint can have its own layout while sharing the same underlying objects. Learn more in the Responsive Design guide.

What’s next?

Now that you’ve published your first composition, here’s where to go next:

• Editor Overview — Master every panel and option in the editor.
• Templates — Discover what each of the 8 templates does and when to use it.
• Embedding Compositions — Advanced embedding scenarios.
• Responsive Design — Build experiences that work on every screen size.
• FAQ — Quick answers to common questions.

If you run into any issues, contact us at support@physicks.pro. We’re happy to help.