如何在Mac本地配置Gitlab上他人开发的WordPress站点并协作修改CSS

Hey there, let's walk through this step by step—since you're new to WordPress setup with an existing project, I'll keep this straightforward and skip any unnecessary jargon.

Step 1: Locate Your Local Git Repository Path #

First, find the folder where you pulled your GitLab WordPress project. To get its absolute path:

• In Finder, right-click the project folder and select Get Info
• Copy the path listed under "Where" (it’ll look something like /Users/YourName/Projects/your-wp-site)

Step 2: Set MAMP’s Document Root to Your Repo #

This tells MAMP to serve files directly from your Git folder instead of its default location:

• Open MAMP
• Click Preferences (top menu bar) → switch to the Web Server tab
• Click the folder icon next to "Document Root"
• Select the root folder of your WordPress repo (the one containing wp-content, wp-config.php, etc.)
• Save changes, then stop and restart MAMP’s servers (click the Stop/Start buttons in the MAMP main window)

Step 3: Configure WordPress Database Settings (wp-config.php) #

Your pulled repo likely has a wp-config.php file, but it’s set for the live site—we need to adjust it for MAMP’s local database:

1. Create a local database:
   • Click Open WebStart Page in MAMP → select phpMyAdmin
   • Click New (left sidebar), enter a database name (e.g., local_wp_site), set the collation to utf8mb4_general_ci, then click Create
2. Edit wp-config.php:
   • Open your repo’s wp-config.php file in a code editor (if there’s no wp-config.php, copy wp-config-sample.php and rename it)
   • Replace the database lines with these MAMP defaults:

     define( 'DB_NAME', 'local_wp_site' ); // Use the database name you just created
     define( 'DB_USER', 'root' ); // MAMP's default DB username
     define( 'DB_PASSWORD', 'root' ); // MAMP's default DB password
     define( 'DB_HOST', 'localhost' ); // Keep this as-is
     

   • Save the file

Step 4: Import the Live Database (If Needed) #

To match the live site’s content locally:

• Ask your WordPress developer for a .sql backup of the live database
• In phpMyAdmin, select your local database → click the Import tab
• Upload the .sql file and click Go to run the import
• Fix site URLs: After importing, the live URLs will break local access. Fix this in phpMyAdmin:
  • Go to the wp_options table (if your repo uses a custom table prefix, look for [prefix]_options)
  • Find the rows with option_name = siteurl and home
  • Update their option_value to http://localhost:8888 (use your MAMP port if you changed it from 8888)

Step 5: Test Local Access #

Open your browser and go to http://localhost:8888 (or your custom port). You should see your WordPress site load successfully!

Step 6: Modify CSS & Push Changes to GitLab #

Now that your local setup works, here’s how to safely edit CSS and share your changes:

1. Create a Git branch:
   • Open Terminal, navigate to your repo folder with cd /path/to/your/repo
   • Run git checkout -b feature/css-updates (name the branch something descriptive for your changes)
2. Edit CSS:
   • Always use a child theme if possible (avoids losing changes when the parent theme updates). If there’s no child theme, create one quickly:
     • Make a new folder in wp-content/themes/ (e.g., your-theme-child)
     • Create a style.css file inside it with this header:

       /*
       Theme Name: Your Theme Child
       Template: your-parent-theme-folder-name
       */
       

     • Activate the child theme in WP Admin (Appearance → Themes)
   • Edit the child theme’s style.css (or the parent theme’s if you have no other option) with your CSS changes
3. Commit & push changes:
   • Run git add . to stage your changes
   • Run git commit -m "Adjust navigation bar color and button padding" (write a clear message about what you changed)
   • Run git push origin feature/css-updates to send the branch to GitLab
4. Request a merge:
   • Tell your WordPress developer to review your branch and create a merge request (MR) to merge your changes into the main branch

Quick Notes #

• If you changed MAMP’s default port, replace 8888 in all URLs with your custom port
• Never edit core WordPress files (like wp-includes or wp-admin)—stick to theme files for CSS changes
• If you run into permission errors on MAMP, right-click your repo folder → Get Info → set "Sharing & Permissions" to allow read/write access for your user

内容的提问来源于stack exchange，提问作者icekomo