Install Breakdance WordPress Builder Locally using MAMP

Published July 12, 2022

If you're a WordPress developer, there's a good chance you've heard of the new page builder called Breakdance. It's currently in alpha, which means it's still being developed and has some bugs that need to be worked out. But the developers are promising a lot of features that will make creating pages and posts easier than ever before. Currently, it's not recommended for production sites, but if you want to test it out, you can install it locally on your computer using MAMP.

What is MAMP?

MAMP is a software package that allows you to install WordPress and other PHP-based applications on your computer. It stands for Macintosh, Apache, MySQL, and PHP. Once you've installed MAMP, you can create a local website on your computer that will mirror your live website. This is a great way to test new plugins, themes, and features without affecting your live site.

Macintosh: An operating system used by Apple computers.

Apache: Apache is the most popular web server software. It's free, open source, and runs on most operating systems.

MySQL: MySQL is a database software used by WordPress.

PHP: PHP is a programming language that powers WordPress.

MAMP combines all of these software packages into one easy-to-install application.

Why use MAMP?

MAMP is a great way to test out new features on your WordPress site without affecting your live site. It's also a good way to learn how WordPress works, since you can play around with the code without having to worry about breaking anything. Plus, it's free!

9 Steps to Installing Breakdance Builder with MAMP

1) Download WordPress locally

Download WordPress from the official website and unzip into a folder on your computer

2) Install MAMP on your computer

Download the free version of MAMP from their official website and install it on your computer.

mamp installer screen on mac os
MAMP Installer

3) Open & Setup Ports

open mamp application to begin wordpress development
Navigate to MAMP in your Applications folder
opening mamp from applications folder on mac
Open the MAMP Application

Open MAMP from your applications folder. Ensure web server is set to Apache. Click on preferences -> ports -> and update port values. I have my Apache set to 8888 and MySQL set to 8889.

mamp server port customization options

4) Change Site Directory

In the same preferences panel, go to server and choose the document root of where you want your sites to be located. I like to have mine under a new folder I created

users -> justin -> sites
mamp server document location to store website information

5) Start MAMP Server

Once this is all done, start your MAMP server by pressing the green start button. if everything is working, your web browser should have opened and should be on the splash screen for MAMP. If this doesn't happen but your server is running, enter the following URL into your browser and replace the numbers with the Apache port you specified earlier:

http://localhost:8888/MAMP/?language=English
Code language: JavaScript (javascript)
mamp main screen redirect after setting up website

Once this is up, you're good to go!

6) Create MySQL database with phpMyAdmin

What is phpMyAdmin?

phpMyAdmin is a free and open source web application used to manage MySQL databases. It allows you to create, edit, and delete databases. It also allows you to run SQL queries on your databases.

How to open phpMyAdmin with MAMP?

Simply add phpMyAdmin to the proper url path (with the correct port) like this:

http://localhost:8888/phpMyAdmin
Code language: JavaScript (javascript)

Once you're here, navigate to the databases page. You should see the 3 default ones that come with MAMP: mysql, information_schema, and performance_schema. Create a new database entering a name then by clicking on the "create database"

setting up database and rows with mamp website builder
Database viewer in phpMyAdmin

7) Unzip and Install WordPress

Create a folder in your MAMP site directory & unzip your WordPress install from earlier into it. I called mine Breakdance but you can name it whatever you want!

wordpress website setup inside mamp

Navigate to the installer by adding the folder name to your URL like this:

http://localhost:8888/breakdance
Code language: JavaScript (javascript)
wordpress configuration installer screen

Follow the instructions until you get to the database information screen. The database name is what you set it to earlier, and the username and password are both root.

wordpress database connection setup wizard
WordPress database connection screen
setting up wordpress user with mamp website
WordPress user information screen

Fill in all the user information for your site on the next screen and then finalize your WordPress installation. Log into your new WordPress site to start!

8) Download Breakdance Builder

Now that you have WordPress installed locally, you can download and install the Breakdance plugin. Download Breakdance from the Breakdance website to get your zip file.

 breakdance builder warnings

9) Install & Activate Breakdance Builder in WordPress

On your WordPress admin panel, go to plugins -> add new. Click on "upload plugin" then choose the file you just downloaded. Install & activate Breakdance.

breakdance builder setup wizard disable or keep theme screen

10) Start editing!

That's it! You're ready to start using Breakdance locally on your computer. To use the page builder, go into pages -> add new and you should see the Breakdance button in the center of your page. Give it a try and see how easy it is to use!

editing a page with the breakdance builder setup with MAMP

Conclusion

Amazing! We went step-by-step to describe how to install Breakdance Builder, the new WordPress page builder by SoFlyy, on your computer for local testing. We covered installing WordPress locally, MAMP, and adjusting your ports. We also went over how to create a MySQL database and install Breakdance. Finally, we walked through creating a new page in WordPress and using the Breakdance Builder to edit them. We hope you  found this tutorial helpful and easy to follow. If you have any questions, please feel free to leave a comment below! Happy building!

Written By Justin
Justin is the founder of Gold Penguin, a web design and marketing agency that helps businesses achieve their online goals. Justin has a passion for web design and marketing, and he loves working with clients to help them grow their businesses.

Related Posts

Comments

Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments
Made with 💛 by Gold Penguin © 2022