Skip to content

Using Browser Tabs and Windows Efficiently in WordPress Development

A lot of my work in WordPress is tacit knowledge: general know-how that I take for granted, and that it doesn’t even occur to me I have. The problem with tacit knowledge in teaching is that other people might miss important things that it wouldn’t even occur to you to teach because it feels “too basic.”

So this week, I thought I’d outline something quite basic but very important: how to use browser tabs and windows efficiently. All of this you could easily figure out yourself—but on the other hand, it’s likely that you don’t know some of it, and all of it saves me hours per month. Let’s dive in!

Time-Saving Tab Management

In general, I keep a browser tab open for every individual thing I’m doing on a site.

When I work on a WordPress site I almost always have at least two tabs open: one for the admin area and one to view changes on the front end.

More generally, I keep a tab open for every individual thing I’m doing on a site, since navigating between pages on both the front and back end can be quite slow. It’s a lot quicker to have two tabs open for both adding a new plugin and editing a post (say, to add a shortcode that the plugin provides) than to navigate between them.

Two-Tab Post Editing

The first place you should be using multiple tabs is to edit your WordPress posts.. My dream is front-end editing in WordPress, but until that day arrives we’re stuck making changes in the admin area, and then viewing those changes on the site’s front end.

Don’t do this in one tab. Keep an editing tab open, and open the front end in a new tab. If your post’s a draft, clicking “Preview” will automatically open a new tab. If your post is published, go to “View Post” but right-click it instead, and select “Open in new tab”:

post_updated_new_tab

In both cases, you’ll end up with the back end and front end open at the same time, and you don’t have to wait for long page loads to switch between the two:

two-tabs

One Tab per Task

If you find yourself consistently waiting for pages to load, take a look at your tab habits.

If I’m making a lot of changes—on a client site I’ll often be installing a plugin, editing a site’s widgets, modifying its nav menu, and editing a page—I’ll likely have a tab for each, since WordPress’s individual admin pages are often very slow to load if you’re trying to navigate between them. If I want to Google something, that’s a new tab as well, since that saves me the time of navigating back to the site once I’ve got the answer.

As an illustration, here are the browser tabs I’ve got open as this article is ready to publish:

chrome tabs

Click to enlarge

In general, if you find yourself consistently waiting for pages to load when you work in WordPress, then take a look at your tab habits. “One tab per task” is quite a time-saver if you’re not currently doing it.

Managing Multiple States with Incognito Windows

You can use an incognito window to access a site as a “brand-new person,” without needing to change devices or even browsers.

An incognito window is a browser window that does not store browser cookies or search history. You can use incognito windows to create new “sessions” across all kinds of sites, without having to worry about prior state you may have accumulated on those sites.

More concisely, you can use an incognito window to access a site as a “brand-new person,” without needing to change devices or even browsers.

When would you need this? A few examples:

  1. Simultaneously viewing the same WordPress site both logged-in and logged-out. WordPress sites can look and behave quite differently depending on whether or not you’re logged in, since many caching solutions won’t cache resources for logged-in users.
  2. Logging into the same site multiple times. As an example, a client may have three separate hosting accounts with the same host, and need something done to each account. Rather than log in and out three times, you can log into each account separately with a new incognito window. The same goes for logging into multiple Twitter accounts and so on.
  3. Testing a checkout flow or registration form while logged in. Again, some checkout flows, contact forms, and other site features behave quite differently if you’re logged in. You can test them as an anonymous user with no prior state in an incognito window.

To get the same effect, I used to open sites in a second browser (Firefox), set to never store cookies or cache resources, but incognito windows are more convenient, and have the advantage that you can create as many as you want.

How to Open an Incognito Window

In Chrome, create an incognito window with Ctrl+Shift+N, or in the top-right hamburger menu:

new-incognito-window

This will create a new browser window which you can think of as its own “session” for the purposes of browser state:

incognito-window

Browser Tab and Window Keyboard Shortcuts

The following keyboard shortcuts are quite useful to me in my work. These are for Chrome on Windows; for Mac, substitute Cmd for Ctrl. Other browsers have other shortcuts, although the first three should work in any decent browser.

  1. Create a new tab: Ctrl+T
  2. Create a new window: Ctrl+Shift+T
  3. Restore the last tab you closed: Ctrl+Shift+T
  4. New incognito window: Ctrl+Shift+N
  5. Switch view to next tab: Ctrl+Tab
  6. Switch view to previous tab: Ctrl+Shift+Tab

Here’s a full list of shortcuts from Google.

In Conclusion…

Managing tabs and windows efficiently is one thing that can save you time every day you use an internet-enabled computer, and it’s especially helpful in WordPress. I hope you’ve got some new ideas, and thanks for reading!

Yay! 🎉 You made it to the end of the article!
Fred Meyer

2 Comments
Most Voted
Newest Oldest
Inline Feedbacks
View all comments
violet
April 7, 2017 2:33 am

Hi,

I use the worksetup you’ve suggested but what drives me crazy is that I am usually editing multiple interlinked posts and the browser tabs for these all stupidly just say “edit post < website wordpress". even with a tabreformatting program that gives me three lines per tab, there's no more data coming from wordpress than this. have you found a program that either allows custom tab names or gets more post-title info from wordpress to put on the tab? thanks!

Or start the conversation in our Facebook group for WordPress professionals. Find answers, share tips, and get help from other WordPress experts. Join now (it’s free)!

2
0
Would love your thoughts, please comment.x

Most Searched Articles

Best JavaScript Libraries and Frameworks: Try These 14 in 2024

In this post, we look at the best JavaScript libraries and frameworks to try out this year. Why? Well, with JavaScript being available in every web browser, this makes it the most accessible programming language of ...

20 Best Free WordPress Themes for 2024 (Responsive, Mobile-Ready, Beautiful)

If you're looking for only the best free WordPress themes in the market for this year, then you're in the right place. We have more than enough such themes for you right ...

12 Best WordPress Hosting Providers of 2024 Compared and Tested

Looking for the best WordPress hosting that you can actually afford? We did the testing for you. Here are 10+ best hosts on the market ...

Handpicked Articles

How to Make a WordPress Website: Ultimate Guide for All Users – Beginners, Intermediate, Advanced

Many people wonder how to make a WordPress website. They’ve heard about WordPress, its incredible popularity, excellent features and designs, and now they want to join the pack and build a WordPress website of their own. So, where does one get ...

How to Start an Ecommerce Business: Ultimate Guide for 2024

Is this going to be the year you learn how to start an eCommerce business from scratch? You’re certainly in the right place! This guide will give you a roadmap to getting from 0 to a fully functional eCommerce business. ...