Editing WordPress Site

Editing Your WordPress Site 101

You know it: That terrible moment you hit save and refresh your browser only to see a white screen of death. You’re not the first victim and you won’t be the last. Below are some tips to help you avoid the white screen of death (or at least know what to do when it happens) when editing your WordPress site.

Ready?

Ok, so you find a tutorial on the web (or maybe even this site) and you think I can do that! I want to try this customization! Before you dive head long into editing your site files, here are some tips to follow.

Tip 1: Use an FTP Client to Access Your Site Files

Repeat with me: Never use the built-in WordPress file editor. I won’t bore you with all the reasons the built-in editor is a bad idea, but here’s the #1 reason: If you get a white screen of death, there’s no way to access your site via wp-admin anymore.

You’ll have to get into your site via FTP (or SFTP or your host’s cPanel and file manager) to fix the offending file, so save yourself the trouble and start with an FTP client.

Think of an FTP client as a dual-screen where you see your computer’s files on one side and your server’s files on the other. It’s a simple way to manage files.

There are about one billion FTP clients available for free online. If you already have a favorite, go for it. If you need a recommendation, here are a couple:

Tip 2: Use a Text Editor with Syntax Highlighting

If you’ve used the built-in WordPress editor to modify files, your head will spin with the magic and beauty of using a proper text editor. Text editors offer a ton of benefits to help improve your coding workflow, but one of my favorites is syntax highlighting.

When you’re copy/pasting code you’ve found on the web, you’re susceptible to all kinds of syntax errors (i.e. a single quote gets transformed to an apostrophe that crashes your site). Using a text editor with syntax highlighting makes it easier to spot these mistakes before you save them to your site.

As with FTP clients, there are a TON of text editors available (both free and premium). My goal isn’t to get you to use a particular editor, but simply to get you in the habit of using one at all. Here are a couple of my favorites to get you started:

  • Notepad++ (Windows – there’s also a Mac version now, too, but I’ve never used)
  • Sublime Text (Mac)

Tip #3: Don’t Edit a Live Site

This is a hard one. I’m tempted to do it, so I figure you are, too. But here’s the deal: Unless you’re using trusted code (i.e. code you have already tested out in a local or development environment), you risk taking your live site down. Save yourself the horror!

What do I mean when I say “live” site? A live site is any site where visitors are expected.

If you’re developing on a live URL (i.e. it’s out there for the world to see, but you’re not driving traffic to it, then I’d call that a development site). Bottom line is, you don’t want to make real-time edits to a site people are using.

Set up a development environment.

There are so many routes you can take to getting a development environment and there’s not necessarily a right or wrong way to do – it just depends on your workflow. Here are some quick examples:

You need a development site where the client can peak in:

In this case, you need a live server to test on. I keep a hosting account at WPEngine (aff link) just for this purpose. I can spin up a WordPress install with the click of a button, set up SFTP access and go to town.

Of course you can do this with any host, but WPEngine makes it easier (i.e. I don’t have to wade through a cPanel to create a subdomain, a database, etc – all that is done automatically).

You need a local development site:

If you’re comfortable getting your hands a little dirty, you can install WordPress locally on your Mac, Windows, or Ubuntu. WPExplorer just released a great series on installing WP locally on each of these platforms. I’ve used this method and it certainly works.

But then, a few months ago I was introduced to Desktop Server from ServerPress.com. It’s easier to set up (if the idea of creating a database scares you), but the realllllly cool features are the ability to clone sites. So, for instance, I set up what I like to call my “default install” with everything configured just like a Carrie likes it and I can clone that same setup over and over, saving me time every time I spin up a new WP install.

I digress a bit and probably need to write a full review of Desktop Server in another post, but for now just know it’s an alternative to a manual local install.

Tip #4: Have a Backup Ready to Go

Most problems we create by editing site files can easily be remedied by opening up the offending file, removing whatever customization we added, and re-saving.

But what about CATASTROPHIC FAILURES? In the event of a major catastrophe, you will thank yourself a million times over for having a backup of your site files and database. Before you go to the trouble of doing a full site restore, however, make sure that you’re experiencing a catastrophic event and not just a problem that could be fixed by going in and reverting whatever change caused the problem.

For example, if updating a plugin caused your site to tank, go deactivate that plugin. If you can no longer access your WordPress admin dashboard, log in to your site via FTP and go to wp-content/plugins/ and find the offending plugin. You can either delete it from there or just rename the folder. If that was the source of the problem, that maneuver will likely get you back on course. If it doesn’t then maybe there is a database issue and you need to do a restore.

At any rate, make your future self love you by getting your present self to create regular backups of your sites. I use ManageWP and BackupBuddy (affiliate link bombs – watch out!), but if you don’t mind a more manual approach, there are plenty of free plugins/alternatives available.

Tip #5: Don’t Panic

I’ll end with this tip and it’s probably the most important. When your site tanks and words that would embarrass a sailor fly through your brain, don’t panic.

Take a deep breath.

Do your best to troubleshoot.

Finally, learn from your mistakes and set yourself up for success by implementing a proper system for editing your WordPress site.

Rainmaker Platform: Build a Powerful Website

Carrie Dils

I’m a recommended Genesis Developer with 15+ years experience in web design and development. I'm creative, resourceful, and ready to put my mind to your project. Want to discuss your WordPress project? Let's talk!

Comments

  1. Ginger says

    What are the odds? Just experienced my first white screen trying to setup WP manually, albeit locally. Turns out it was a Smart Quotes issue using TextEdit on my Mac….turned them off and it worked however, evaluating other text editors now. Thanks for the tip on DesktopServer, MAMP was a little challenging to configure, I’ll see how this goes.

  2. says

    Great post, Carrie! I confess I used the built in editor on a site a while ago because I was being lazy. Paid for it last week in cleanup time. Somehow it inserted a blank line after every existing line in the stylesheet. O.o

    Also, Filezilla and SublimeText are cross platform, not just for Macs. :)

  3. says

    Good post. I was going to ask how you were getting on with Desktop Server, but clearly you’re doing OK or you wouldn’t have mentioned it. I’m a fan; useful as you say, for cloning sites from your preferred set-up(s). Also good for taking a backup of a client’s site with (say) Duplicator and then working on it locally; Desktop Server’s Direct Deploy feature is very good too.

    • says

      Thanks for mentioning Duplicator – I didn’t know that was available! I’ve been using Migrate DB Pro for live to live duplications and Desktop Server for dev to live deploys, but Duplicator looks perfect for pulling a live site into a local environment. What’s your workflow for pushing changes back up to a client’s live site? Do you take the DB or just upload editing theme files?

      • Jodi says

        I’m curious to hear more about Desktop Server and others’ workflows. I’ve been using BackupBuddy to go back and forth. I think it has the ability to move it in pieces, but I’ve always done a full move, which seems a pain – so I do tend to tweak my CSS on my live site. I use the Advanced Code Editor plugin, which helps. I sometimes miss the good ol’ days of simple HTML websites and getting/putting individual files with Dreamweaver!

        • says

          Jodi, the Advanced Code Editor plugin shows not tested on the latest/greatest version of WordPress, so let me ask you – has it ever caused you any problems? I’m tempted to use it – but primarily on my desktop for tweaks here. Thanks – and I agree with you about sometimes missing the good old days, but it *is* only sometimes. :D

          • Jodi says

            Oh, it does look like it’s getting kind of stale and hasn’t been updated in awhile. I’ve never had any problems with it though. The only thing I don’t like about it is the window you’re working in gets a little wonky and moves below the file listing on the right side, sometimes causing some scrolling confusion.

      • says

        Hi Carrie, only just saw your query. Workflow for pushing changes back kind of depends on what I’m doing, i..e. how major the surgery. If it’s theme work (and maybe moving widgets around to suit, then I’ll upload the theme files and change the widgets. If it’s a major job then I’ve used Desktop Server’s Direct Deploy to overwrite the complete old install. It also allows me to do things like change to custom table prefixes offline, and then Direct Deploy will keep them, overwriting the default wp_ etc.

        Just noting some other comments, I’ve not had a problem with php time-outs on Duplicator (yet). I’ve just been using it for an install with a a few thousand CPT entries (Events Manager) and it took about 2 minutes to create the archive (hardly any images on that particular site…yet).

  4. says

    A white screen is more often that not is just a php syntax error. Usually easily found if you know what you are looking for if notnthat is what the error logs are for. I always recommend running a development version, always good to run upgrades and development changes the first.

  5. says

    I’ve never had much luck with Duplicator. 9 out of 10 times the archive ends up timing out.

    Another good rule, don’t touch any PHP code without first setting WP_DEBUG to true.

  6. says

    I can vouch for DeskTop Server. After struggling mightily with alternatives, I’ve found that it works like a charm–installs effortlessly. It’s a n00b-safe way (aka so simple even Steve can do it) to start, stop, access your local dev site. Also, it’s a great way to noodle around with a WordPress site clone while trapped on a non-stop flight (how DO you get off a ‘non-stop flight’?) over the ocean with no GoGo wifi, etc. I’ve installed a dev site on my dropbox folder too–for access via different PC’s, laptops, etc. Cool.

    In addition to the FTP/SFTP–very safe and smart–way to go about things like you suggest, I’ve found that I can quickly go to cpanel>file manager and make a copy (renamed to functions_orig.php in the same directory) or whatever file I’m playing with, er editing…like functions.php or custom.css…and then I have an easy fix if (when) I break something.

    It seems quicker to be working on my site with cpanel live in another tab, etc for emergency fixes. I don’t see this cpanel method talked about much as an alternate means of accomplishing backup safety, etc. Is it because it’s a bad idea?

    Thanks, Carrie, for another excellent and relevant post. You’re on a roll: You go!

    • Jodi says

      Have you used other alternatives like WAMP, XAMPP, MAMP? If so, how does DeskTop Server compare? I currently use WAMP, but it’s slowed down for some reason, which is another reason I’m not keen on going back and forth between dev and live for small tweaks. When tweaking functions, I always use a local dev site. Okay, almost always … I have been known to break it and learned the hard way :-)

      I do like that WAMP is free. I’m not sure I’m currently doing enough websites to justify yet another yearly subscription fee!

      • says

        Jodi, yes. i have-WAMP, Xamp…they drive me nuts, frankly.

        Try DesktopServer, there’s a free version (for personal use?) you can at least evaluate.

        Download, install, follow prompts from the simple startup screen (stop/start/install new dev site/go to existing dev site/s) and you’ll be up and running in 3-5min. (No exaggeration.)

        Plus, it installs very cleanly (operates a fork of XampLite? or one of those), so you can delete if you dont like.

        Hope that helps! Cheers

  7. says

    Thanks so much for the write-up and mention of DesktopServer, Carrie! Let us know if you have any questions at all for the review!

    A couple of things that were alluded to in the comments that I’ll address have to do with Duplicator and BackupBuddy. DesktopServer has the ability to import either of these formats seamlessly, so once you make your archive, download it and run the import and you’re set (Premium Version).

    Also, when you say that you can duplicate your sites, I am wondering if you knew about the blueprints feature. Did you know that if you output your configured site (export) to a .zip, you can stick it in your blueprints directory and use that to set up all of your sites? Blueprints, are one of its most powerful features.

    Lastly, there was a question about DS vs. WAMP. I actually did a very quick side-by-side video of mamp vs DS to show the speed and ease. You can check it out here: https://www.youtube.com/watch?v=dc3DXfNOVZA

    And lastly, lastly, I am sorry if this seems sales-y. I certainly did not mean to pitch here so much as answer the comments and most importantly, thank you for the shout out!

  8. says

    Hi Carrie,

    Why do you use ManageWP and Backup Buddy? I use ManageWP for my backups but have been wondering whether there’s any advantage to Backup Buddy.

    Samantha

    • says

      Hey Samantha,
      I originally used BackupBuddy, but after I started using ManageWP I let my license go on BackupBuddy. I think it’s a great standalone product, but yeah, if you’re using ManageWP you don’t need it (IMHO).

      Carrie

  9. says

    Thanks, Carrie. I have a couple of sites that won’t backup properly with ManageWP and I haven’t sat down and figured out why (probably the cheap hosting – they are both with the same web host). I’ll try to work it out and leave BackupBuddy for another day :-)

  10. Ginger says

    Another tip to share….if you want to see what changes you made say to your theme files since installing or to revert something back to the way it was, you can use a free tool called DiffMerge

    https://sourcegear.com/diffmerge/

    This cross-platform tool lets you compare two files and see what the differences are, even if it’s just a missing semi-colon it will find it :=) For example, maybe the original theme\style.css to the one you have altered. You can also use it to compare an entire folder/subfolder/file tree.

  11. says

    Back to “Appearance/Edit (and also Plugins/Edit) – Don’t do it” for a moment, you can easily disable this option. This is a great idea if you don’t want clients messing with things. It’s also a good security precaution. If a hacker or disgruntled employee gains access to the WP dashboard there is all sorts of mischief possible through this unlocked door.

    Simply open up wp-config.php with your freshly installed text editor, love Sublime Text by the way, and do a search for “EDIT.” You will find the following:

    define( ‘DISALLOW_FILE_EDIT’, FALSE );

    Change the state to TRUE, as follows:

    define( ‘DISALLOW_FILE_EDIT’, TRUE );

    Save the file and presto, temptation has been removed.

Trackbacks

Leave a Reply