Elementor: Web Design
Adventures with Web Design Part III
Now that Terraza Data landing page is up, and now that I have endorsed the site on the multiple platforms that I am on, it’s “static”-ness finally kicked in. In my dissatisfaction of it being not responsive, I am now on a mission to build it with Elementor, a drag-and-drop WordPress plug-in for making webpages.
The single, most important objective in this process is keeping everything at low to no cost. As a budding data scientist in the middle of a pandemic, I literally cannot afford $50 or so on some plugin when I am not even sure if we would still be able to afford housing in the next few months…. anyway, let’s get to it!
- Follow this manual to install WordPress to your local computer. After downloading and unzipping the WordPress file, you should see something like this
“Core FTP is used only with the Windows while Filezilla is used with Windows, Linux & Mac OS. Filezilla is mostly used by everybody while core FTP is rarely used. Filezilla provides much features than the Core FTP.”
After downloading the FileZilla .exe, install it and upon opening the application, you should see something like this
3. I’m building this site with my secondhand laptop with a pre-installed Windows 8.1 OS on it so I followed this MySQL Windows installation manual.
Before getting into MySQL, I had to download Microsoft Visual C++ 2013 Redistributable Package from here
I selected vcredist_x64 because my OS is 64-bit, as seen here
After clicking on the downloaded vcredist_x64.exe , you should see something like this
When the Setup was complete, the next step is installing MySQL. Since I have a 64-bit Windows OS, I downloaded MySQL from here.
After extracting the mysql zip file, you should see something like this
After extracting the install archive, I moved the folder to C:\ and opened the command prompt and ran echo %WINDIR% to locate the Windows directory
After this, I ran Visual Studio Code as Administrator. I use VS Code as my IDE for HTML, CSS and Python programming. If you don’t have it yet, download it here, it’s free!
Upon opening VS Code as Administrator, I copy-pasted the option file content from MySQL website, as seen here
I had to change the code to what my root directory was, which was, C:\ and I also created a new directory C:\mydata and inside that directory is another folder named data (C:\mydata\data)
After copy-pasting the code, I saved it as a my.ini in the Windows directory
After this, I initialized a data directory. To do this, first, open the command prompt and navigate to the mysql folder, like so
I did have to rename the directory manually. I just went to C:\ and renamed it to mysql
After renaming the mysql directory, I ran command prompt as administrator again and added a user using the command below
Then I determined the ID of the user I just added using the following command
Then, I ran the following commands
After that, I kept encountering an error when I tried to initialize mysqld in the bin directory.
To solve this, I downloaded the VCRUNTIME from here
Then, I extracted the files from the zip and moved vcruntime140_1.dll to the Windows directory
After all these, I was able to initialize the directory successfully, as seen here
I also had to add mysql to Path. To do this, follow these steps
Setup of the MySQL server
Log as administrator or with an account with administrator privileges.
First I strongly suggest you add the MySQL binary directory to the Windows Environment path as follows:
Right-click on Computer and select Properties, or System in Control Panel and select Open.
Select the Advanced tab, then select Environment Variables and you will see a dialog
Scroll down in the System variables area and locate the Path variable, select it and click on Edit. Add C:\mysql\bin; to the end of the Path string, as shown in this image.
4. Since this is Windows: reboot to make the new path effective.
After adding to Path, I was able to run this command installing mysqld successfully
PS to be updated… depending on demand. If you want the follow up to this article, please hit me up!
Since I wrote this article, I found other equally aesthetic landing page builders that’s free. The best one that I found and actually used for Terraza Data was Mailchimp’s Landing Page Creator.
Here’s Terraza Data’s landing page made with mailchimp.