树莓派搭建WordPress站点：外网访问时图片无法加载且页面错乱

Hey there! Let's troubleshoot why your WordPress site works perfectly on your local network but looks broken (no images, messed up layout) when accessing it over mobile data. This is a super common pitfall when moving from local to external access, so let's walk through the most likely fixes step by step:

1. Correct WordPress Site URL Settings #

This is the #1 culprit for this issue. If you set up WordPress using your Raspberry Pi's internal IP (like 192.168.x.x), all your site's resources (images, CSS, JS) are being loaded from that internal address—which mobile data can't reach.

• Fix via WordPress Admin (Internal Access):
  Log into your WordPress dashboard through your local network, go to Settings > General. Update both WordPress Address (URL) and Site Address (URL) to your No-IP domain (e.g., http://your-custom-domain.ddns.net). Save changes and test again over mobile data.

• Fix via phpMyAdmin (If Admin is Unreachable):
  Open phpMyAdmin locally, navigate to your WordPress database, then the wp_options table. Find the rows with option_name set to siteurl and home, update their option_value to your No-IP domain.

2. Replace Hardcoded Internal IPs in Content/Theme #

Sometimes themes, plugins, or even post content might have hardcoded references to your internal IP. You'll need to swap these out for your domain:

• Use a WordPress plugin like Better Search Replace (install it via your local admin) to search for your Raspberry Pi's internal IP and replace it with your No-IP domain. Make sure to select all relevant database tables, and back up your database first just in case.
• Alternatively, check your theme's functions.php file (via FTP or local file manager) for any absolute paths using the internal IP, and replace them with dynamic functions like get_site_url() instead.

3. Verify Nginx Configuration #

Double-check your Nginx site config to ensure it's pointing to your domain, not just the internal IP:

• Open your Nginx config file (usually located at /etc/nginx/sites-available/your-wordpress-site.conf)
• Ensure the server_name line is set to your No-IP domain, like this:

  server {
      listen 80;
      server_name your-custom-domain.ddns.net;
      root /var/www/wordpress;
      index index.php index.html index.htm;
  
      location / {
          try_files $uri $uri/ /index.php?$args;
      }
  
      location ~ \.php$ {
          include snippets/fastcgi-php.conf;
          fastcgi_pass unix:/run/php/php7.0-fpm.sock;
      }
  }
  

• Save the file and restart Nginx to apply changes: sudo systemctl restart nginx

4. Confirm Network/Router Settings #

Even with DMZ enabled, a few things might be off:

• Static Internal IP for Raspberry Pi: Make sure your Pi has a static internal IP (not DHCP-assigned). If the IP changes, your DMZ mapping will break. You can set this via your router's DHCP reservation or directly on the Pi.
• Verify Domain Resolution: On your mobile device, check that your No-IP domain resolves to your public IP. You can do this by visiting a "what's my IP" site on mobile, then comparing it to the IP your No-IP domain points to (check No-IP's dashboard).
• Port Forwarding Double-Check: While DMZ should open all ports, confirm that port 80 (HTTP) is forwarded to your Pi's internal IP in your router settings. Some routers have strict DMZ rules, so this extra check can help.

5. Clear Caches #

Cached resources can cause old internal IP references to stick around:

• Clear your mobile browser's cache and cookies.
• If you're using a caching plugin on WordPress (like WP Super Cache), clear its cache via the local admin dashboard.

Start with the first step (URL settings)—that's almost always the fix for this exact issue. If that doesn't work, move through the other checks one by one.

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