Development Guide

  <h2>The Communication Skills That Separate Senior Developers from Architects</h2>
  <p><p>The most technically skilled person in a room is rarely the most influential architect in that room. This is not unfair — it reflects a genuine truth about what architecture work requires.</p>

</p>
  <a href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">Read more</a>

  <h2>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h2>
  <p><p>One of the most disorienting parts of growing into an architecture role is learning to hold multiple time frames in your head simultaneously. Your sprint team wants to know what ships this week. Your product manager wants to know what is landing next quarter. Your CTO wants to know where the platform will be in three years.</p>

</p>
  <a href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">Read more</a>

  <h2>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h2>
  <p><p>If you work at any organization with a meaningful digital presence, you have almost certainly run into Adobe’s enterprise platform in some form. Adobe Experience Manager (AEM), Adobe Experience Platform (AEP), and the broader Adobe DXP (Digital Experience Platform) stack represent one of the most widely adopted enterprise content and data platforms on the market.</p>

</p>
  <a href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">Read more</a>

  <h2>What Junior Developers Should Learn First: Design, Ops, or Security?</h2>
  <p><p>Ask ten senior developers what a junior should focus on first and you will get ten different answers. Some say master the fundamentals. Others say learn cloud and DevOps immediately. A few say security is the most valuable differentiator.</p>

</p>
  <a href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">Read more</a>

  <h2>How to Think in Systems, Not Tickets</h2>
  <p><p>Most developers are trained to think in tickets. A ticket arrives, you understand the requirement, you write the code, you close the ticket. This is valuable. It is also insufficient for anyone who wants to understand why the system behaves the way it does.</p>

</p>
  <a href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">Read more</a>

  <h2>Developer to Architect: A 24-Month Skill Roadmap</h2>
  <p><p>There is no single moment when a developer becomes an architect. It is a gradual accumulation of breadth, judgment, and influence. But that accumulation can be directed. This post maps out a realistic 24-month progression that any motivated developer can follow.</p>

</p>
  <a href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">Read more</a>

  <h2>Enterprise Architecture for Developers: What It Is and What It Is Not</h2>
  <p><p>Enterprise architecture gets a bad reputation in developer circles. It conjures images of slides no one reads, acronyms no one agrees on, and decisions handed down from people who stopped writing code a decade ago.</p>

</p>
  <a href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">Read more</a>

  <h2>Getting Started with GitHub Actions</h2>
  <p><p>GitHub Actions automates software workflows directly in your repository. You can run tests, build artifacts, deploy apps, and handle repetitive tasks whenever events happen in GitHub.</p>

</p>
  <a href="/blog/2024/02/28/getting-started-github-actions.html">Read more</a>

  <h2>Common Misconceptions About WordPress</h2>
  <p><p>WordPress is undoubtedly one of the most popular content management systems (CMS) on the internet today. With its user-friendly interface and vast plugin ecosystem, it has empowered millions of users to create websites without extensive coding knowledge. However, there are several common misconceptions about WordPress that need to be addressed. In this article, we’ll debunk some of these myths.</p>

</p>
  <a href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">Read more</a>

  <h2>Private Email Address via Git Config</h2>
  <p><p>I’m constantly learning new things and most recently learned a little tidbit about a feature about Git, allowing for private email addresses during commits. Let’s take a look.</p>

</p>
  <a href="/blog/2022/11/26/private-git-email.html">Read more</a>

  <h2>David Auble, Manager</h2>
  <p><p>It’s been no secret that I’ve been working towards finishing my MBA in Finance. I am on track to graduate this coming December and am excited to have not only completed the two-year program, but also for what lies ahead. I’ve been striving to enter into management for several years and knew an MBA would help add value to my professional experience.</p>

</p>
  <a href="/blog/2020/09/06/new-job-promotion.html">Read more</a>

  <h2>Targeting Internet Explorer with CSS Media Queries</h2>
  <p><p>I’ve been using CSS Grid and Flexbox for a little while now for different parts of websites. They work in all modern browsers and it saves me time from having to put together cheap hacks. One of the caveats to using Grid though is that older browsers such as IE10 and 11 don’t fully support it.</p>

</p>
  <a href="/blog/2020/05/05/targeting-internet-explorer-with-css-media-queries.html">Read more</a>

  <h2>Common WordPress Helper Functions</h2>
  <p><p>I’ve used WordPress almost daily for the past six years and thought it’d be time to share some of my more commonly used functions WordPress has built in to the framework. Below is a list of the functions I use frequently on most of the sites I build.</p>

</p>
  <a href="/blog/2020/04/29/common-wordpress-helper-functions.html">Read more</a>

  <h2>Getting Jekyll Running on Windows 10 x64</h2>
  <p><p>I use a Mac and a PC equally and want to be able to work on projects regardless of development environment. As mentioned <a href="/2020/04/10/2020-blog-update.html">previously</a>, I’ve converted my site over to Jekyll. It works well on both systems, but when I went to install it on my PC, I ran into the following issue:</p>

</p>
  <a href="/blog/2020/04/19/jekyll-on-windows.html">Read more</a>

  <h2>Edit Robots.txt with WordPress and Yoast</h2>
  <p><p>An interesting project came my way this week at work and took some digging to resolve. Each website utilizes a file called a <code class="language-plaintext highlighter-rouge">robots.txt</code> file that helps point search engine bots what areas of your site to crawl and which to ignore. This helps the bots crawl your site and help it appear on search engines and can impact your search rankings.</p>

</p>
  <a href="/blog/2020/04/14/edit-robots-txt-wordpress-yoast.html">Read more</a>

  <h2>2020 Blog Update</h2>
  <p><p>It’s been nearly a year since I’ve had any updates to this site other than a couple of logos here and there. I’ve been overloaded between my full-time job, being a full-time MBA student, and helping raise my first child with my wife. The good news is life has been going well, I’ve just been extremely busy. We haven’t been able to travel due to my classes and projects, but have managed to get away for a couple weekends here and there to visit family and friends.</p>

</p>
  <a href="/blog/2020/04/10/2020-blog-update.html">Read more</a>

  <h2>Improving WordPress Search Results with Relevanssi</h2>
  <p><p>I’ve been managing 17 WordPress sites for the past few years and one thing I’ve noticed is the default search built into WordPress isn’t flexible and doesn’t always return the most accurate results. I use Advanced Custom Fields heavily for each of the sites and have noticed the default search doesn’t search into these fields; it only searches titles and what’s in the page’s main content box. Since most of the pages on our sites don’t use those, I needed to find a better option.</p>

</p>
  <a href="/blog/2019/03/05/improving-wordpress-search-results-with-relevanssi.html">Read more</a>

  <h2>How to Change the WordPress Admin Login Logo</h2>
  <p><p>Over the years I’ve had to search for tons of small snippets for WordPress to do simple tasks. This is another one of those little snippets. One of the final little touches I like to do before launching a website over to a client is to override the default WordPress logo with their logo on the WordPress login splash screen. It’s a simple trick and can be done with the code below.</p>

</p>
  <a href="/blog/2019/01/24/how-to-change-the-wordpress-admin-login-logo.html">Read more</a>

  <h2>Using PHP to Determine Server Protocol</h2>
  <p><p>For various projects I build, I always have three environments: local, staging and production. On my staging and production environments, I have HTTPS enabled, but to keep things simple, I never set up HTTPS on my local environment. A lot of sites I build require forms that redirect the user to a thank you page, once the data is sent and processed to Salesforce. The redirect though requires an absolute path, so I cannot use something like “/contact/thank-you/”. To accomplish this, I use this simple line in PHP to display the appropriate protocol, regardless of dev environment.</p>

</p>
  <a href="/blog/2018/11/05/using-php-to-determine-server-protocol.html">Read more</a>

  <h2>Fixing 'Another git process seems to be running in this repository' Error in Git</h2>
  <p><p>I sometimes come across a unique error when using Git and always have to look up how to fix the error. It’s a simple error and can be replicated by stopping a Git command before it’s finished. Git in turn generates a “index.lock” file, which prevents you from adding any additional files to the commit. The error message I usually receive in full is:</p>

</p>
  <a href="/blog/2018/10/23/fixing-another-git-process-seems-to-be-running-in-this-repository-error.html">Read more</a>

  <h2>Stop WordPress from adding 10px padding to Images</h2>
  <p><p>For quite some time now I’ve been struggling with WordPress adding an additional 10px of padding to images that are uploaded via the content editor. After a small amount of digging, I’ve discovered the following override:</p>

</p>
  <a href="/blog/2018/09/11/stop-wordpress-from-adding-10px-padding-to-images.html">Read more</a>

  <h2>Parking Assistant: An Arduino-based Program to Help You Park</h2>
  <p><p>For Christmas this past year I finally got something I’ve been wanting for a little while: an Arduino controller and small electronics kit. I’ve had several ideas of little projects, but have never had the time or parts to start working on them. Over the last several weeks though, I’ve been playing with them and have come up with a few projects.</p>

</p>
  <a href="/blog/2018/02/23/parking-assistant-arduino-based-program-help-park.html">Read more</a>

  <h2>Custom Pagination in WordPress</h2>
  <p><p>A while ago I was having troubles with the built-in pagination in WordPress and started looking for alternative solutions. I didn’t want to use a plugin, since I wanted it to work across the board – work with blog posts, search results, taxonomies, etc. I stumbled upon this <a href="http://www.wpbeginner.com/wp-themes/how-to-add-numeric-pagination-in-your-wordpress-theme/" target="_blank">custom method from WPBeginner</a> and gave it a shot. It worked brilliantly. After a few months though, I started noticing a problem – it wasn’t pulling the correct number of total pages, resulting in paged pages with zero results. I ended up looking into the code and have modified it for my needs. Feel free to use this – simply drop this into your <strong>functions.php </strong>file, then call it in your code with:</p>

</p>
  <a href="/blog/2018/02/14/custom-pagination-wordpress.html">Read more</a>

  <h2>Why Click Events Don't Work in Safari</h2>
  <p><p>Over the last few months I’ve been working on a weather dashboard with the goal of developing it into my first mobile app.</p>

</p>
  <a href="/blog/2018/01/29/why-click-events-dont-work-in-safari.html">Read more</a>

  <h2>Displaying Dates as Strings with PHP's sqlsrv_connect()</h2>
  <p><p>Over the last few weeks I’ve been working on a web application that allows me to track how website leads are performing at work. In building this app, I’m interacting with MySQL and SQL Server databases together and using PHP as my language of choice.</p>

</p>
  <a href="/blog/2018/01/16/displaying-dates-strings-phps-sqlsrv_connect.html">Read more</a>

  <h2>Chrome 63 Update: HTTPS Redirect on localhost</h2>
  <p><p>I ran into something frustrating yesterday and after extensive research, figured out the problem. With one of Chrome’s latest updates, all of my sites on my local machine were consistently being redirected to HTTPS.</p>

</p>
  <a href="/blog/2017/12/09/chrome-63-update-https-redirect-localhost.html">Read more</a>

  <h2>Run WordPress Multi-Site On localhost</h2>
  <p><p>This is something I have wanted to write about for quite some time. Part of my process involves three environments: local, staging, and production. Most of the sites I build are straightforward single-site setups with a few custom touches. At work, however, I manage several WordPress multisite networks.</p>

</p>
  <a href="/blog/2017/11/17/run-wordpress-multi-site-localhost.html">Read more</a>

  <h2>Adding Related Posts in WordPress Without a Plugin</h2>
  <p><p>This past week I had yet another challenge: add related posts to a blog entry and make it match a design. It seemed straightforward, especially since all the blog posts are organized by category. As I dug deeper, I realized it wasn’t going to be as simple as I’d originally thought.</p>

</p>
  <a href="/blog/2017/10/27/adding-related-posts-wordpress-without-plugin.html">Read more</a>

  <h2>Get Page URL via JavaScript</h2>
  <p><p>I come across this problem frequently and yet for some reason, can never remember how to get the URL of the current page via JavaScript.</p>

</p>
  <a href="/blog/2017/10/20/get-page-url-via-javascript.html">Read more</a>

  <h2>Embedding Google Maps: 'X-Frame-Options' to 'sameorigin'</h2>
  <p><p>This past week, I came across something odd. I was building a real-estate website for a client and the client requested a Google Maps embed of specific property. Simple, right? Not entirely. I was able to locate the address and embed an iframe dynamically by using the following code:</p>

</p>
  <a href="/blog/2017/08/25/embedding-google-maps-x-frame-options-sameorigin.html">Read more</a>

  <h2>How to Fix Common WordPress Errors</h2>
  <p><p>WordPress sites are usually straight-forward and not too complicated to build. However, when you start building your own themes and really digging into the core, you’re bound to run into a few issues. The most common issues are oftentimes the easiest to troubleshoot. This list should help you solve the most common WordPress errors.</p>

</p>
  <a href="/blog/2017/08/16/fix-common-wordpress-errors.html">Read more</a>

  <h2>Get WordPress Multisite Table Prefix</h2>
  <p><p>A while ago I wrote my first plugin for WordPress. It requires the creation of a table, encrypting some data, saving it to a WP table, then finally pushing clean data to Salesforce. Somewhat straightforward, but I learned a lot.</p>

</p>
  <a href="/blog/2017/08/09/get-wordpress-multisite-table-prefix.html">Read more</a>

  <h2>Reference WordPress Dashicons in CSS</h2>
  <p><p>Recently I had an issue where I needed to remove a mega menu plugin in order to improve a site’s PageSpeed score. In breaking it down, I realized the plugin was referencing the WordPress Dashicons, something I would need to add in when rebuilding the navigation menu.</p>

</p>
  <a href="/blog/2017/07/20/reference-wordpress-dashicons-css.html">Read more</a>

  <h2>How To: Remove Extra Tags from WordPress WYSIWYG Editor</h2>
  <p><p>From time to time, I find WordPress’ built-in WYSIWYG editor annoying. If you’ve dealt with it much, you know it adds formatting tags around every new line of text. Usually these don’t bother me, as I want my text to be wrapped in paragraph tags or similar. However, for the times I want to extract ONLY the content and not the tags, here’s an easy way to strip all tags from WordPress. Just a word of caution though, these will strip the tags from ALL of your templates.</p>

</p>
  <a href="/blog/2017/03/30/how-to-remove-extra-tags-from-wordpress-wysiwyg-editor.html">Read more</a>

  <h2>How To: Use FontAwesome Fonts in Your CSS :before & :after</h2>
  <p><p>I’ve been a fan of <a href="http://fontawesome.io/" target="_blank">FontAwesome</a> for a long time. I admire their work and appreciate everything they do for fonts, icons and making websites and web apps more user-friendly.</p>

</p>
  <a href="/blog/2017/03/15/how-to-use-fontawesome-fonts-in-your-css-before-after.html">Read more</a>

  <h2>Solution: wp_nav_menu Not Appearing on Category Template</h2>
  <p><p>Today while working on a site I came across a problem that seemed weird to me. The <strong>wp_nav_menu()</strong> was working fine on all the pages except for my category page. When I took a detailed look, I found that it was caused by conflict of custom post type.  So how did I fix it?</p>

</p>
  <a href="/blog/2017/03/08/wp_nav_menu-category-fix.html">Read more</a>

  <h2>My Git Workflow: Introduction to Version Control</h2>
  <p><h2 id="git-what-is-it">Git: What is it?</h2>

</p>
  <a href="/blog/2016/11/09/my-git-workflow-introduction-to-version-control.html">Read more</a>

  <h2>Three Reasons You Should Ditch Image Sliders</h2>
  <p><p><a href="http://ux.stackexchange.com/questions/13951/what-is-the-difference-between-a-slider-a-gallery-and-a-carousel" target="_blank">Carousels, sliders and rotating banners</a> – chances are you’ve heard one or more of these terms before. Image carousels can be found on nearly any news site, online store or informational site with one goal in mind: force-feed the user as much content as possible, as soon as they land on your site.</p>

</p>
  <a href="/blog/2015/01/16/three-reasons-you-should-ditch-image-sliders.html">Read more</a>

  <h2>Why It's Time to Update Your Browser</h2>
  <p>This is the excerpt</p>
  <a href="/blog/2012/04/23/why-its-time-to-update-your-browser.html">Read more</a>

  <h2>The Panda Effect</h2>
  <p><p>By now, most businesses are implementing some form of basic SEO.  Whether it’s optimizing page titles and structure, or optimizing all pictures, content and folder structure, it’s important to build your site with SEO in mind.</p>

</p>
  <a href="/blog/2011/12/06/the-panda-effect.html">Read more</a>

  <h2>Increase Page Views with jQuery Tabs and Google Analytics</h2>
  <p><p>If you’re not in e-commerce, I’m sure most of you have seen a decrease in website traffic, due to the holidays.  By now, most web developers use <a href="http://www.google.com/analytics" target="_blank">Google Analytics</a> to monitor traffic, keywords and other metrics.  With a combination of Analytics and Webmaster Tools, I’ve been able to increase my web traffic significantly.</p>

</p>
  <a href="/blog/2010/12/12/increase-page-views-with-jquery-tabs-and-google-analytics.html">Read more</a>

<!-- Date formatting -->


<!-- String manipulation -->



<!-- URL handling -->
/about


<!-- Array operations -->

Career<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      The Communication Skills That Separate Senior Developers from Architects
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>The Communication Skills That Separate Senior Developers from Architects | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="The Communication Skills That Separate Senior Developers from Architects" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="The most technically skilled person in a room is rarely the most influential architect in that room. This is not unfair — it reflects a genuine truth about what architecture work requires." />
<meta property="og:description" content="The most technically skilled person in a room is rarely the most influential architect in that room. This is not unfair — it reflects a genuine truth about what architecture work requires." />
<link rel="canonical" href="https://davidauble.com/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html" />
<meta property="og:url" content="https://davidauble.com/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/communication-skills-architecture.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2026-07-21T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/communication-skills-architecture.jpg" />
<meta property="twitter:title" content="The Communication Skills That Separate Senior Developers from Architects" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2026-07-21T00:00:00+00:00","datePublished":"2026-07-21T00:00:00+00:00","description":"The most technically skilled person in a room is rarely the most influential architect in that room. This is not unfair — it reflects a genuine truth about what architecture work requires.","headline":"The Communication Skills That Separate Senior Developers from Architects","image":"https://davidauble.com/assets/images/posts/communication-skills-architecture.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html"},"url":"https://davidauble.com/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>Career</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jul 21, 2026</span
          >
        </div>
        <h1>The Communication Skills That Separate Senior Developers from Architects</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 4 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>The most technically skilled person in a room is rarely the most influential architect in that room. This is not unfair — it reflects a genuine truth about what architecture work requires.</p>

<p>Architecture is a coordination problem. It involves aligning people who have different incentives, different vocabularies, and different time horizons. Technical correctness is the entry requirement. Communication is what gets decisions made.</p>

<h2 id="the-four-communication-shifts">The Four Communication Shifts</h2>

<h3 id="1-from-precision-to-clarity">1. From Precision to Clarity</h3>

<p>Senior developers communicate with technical precision. Architects communicate for clarity.</p>

<p><strong>Precision:</strong> “The latency spike is caused by lock contention on the PostgreSQL shared buffer pool during peak write amplification from the denormalized schema.”</p>

<p><strong>Clarity:</strong> “The database slows down under load because we are writing the same data too many times. We have two options to fix it, with different tradeoffs in time and risk.”</p>

<p>The precise version is accurate. The clear version is actionable for a broader audience. Architects need both — precision with engineers, clarity with everyone else.</p>

<h3 id="2-from-solving-to-framing">2. From Solving to Framing</h3>

<p>Developers are trained to solve problems. Architects are trained to frame them.</p>

<p>Framing a problem means defining:</p>

<ul>
  <li>What the actual problem is (not the symptom)</li>
  <li>What success looks like</li>
  <li>What constraints bound the solution space</li>
  <li>What the decision-making criteria are</li>
</ul>

<p>When architects walk into a room and immediately propose a solution, they often close off better options that stakeholders might have surfaced if given the chance. The discipline of framing first, solving second, is one of the most valuable habits you can develop.</p>

<div class="language-text highlighter-rouge"><div class="highlight"><pre class="highlight"><code>Poor framing: "We need to rewrite the API layer."

Better framing: "Our current API layer is causing three categories of problems:
  1. Slow time-to-market for new consumer apps (6 weeks per integration)
  2. Reliability incidents when a single downstream service fails
  3. No standard authentication pattern across products

  We have three options to address these, with different investment profiles..."
</code></pre></div></div>

<h3 id="3-from-debate-to-decision-making">3. From Debate to Decision-Making</h3>

<p>Technical discussions between developers often look like debates: two people advocating for their preferred approach until one runs out of arguments. This works fine for small decisions among people with shared context.</p>

<p>At the architecture level, the goal is not to win the argument — it is to reach a good, documented, reversible-where-possible decision. That requires a different set of skills:</p>

<ul>
  <li>Explicitly naming the decision that needs to be made</li>
  <li>Separating opinions from evidence</li>
  <li>Distinguishing reversible decisions (move fast) from irreversible ones (move carefully)</li>
  <li>Ensuring the person who will live with the decision most has the most weight in it</li>
</ul>

<p>The DACI framework (Driver, Approver, Contributor, Informed) is a lightweight tool for clarifying decision ownership:</p>

<div class="language-text highlighter-rouge"><div class="highlight"><pre class="highlight"><code>DACI for "Choose API Gateway Platform":
  Driver:       Platform Architect (that's you)
  Approver:     Engineering VP
  Contributors: Backend Tech Leads from each domain
  Informed:     Frontend teams, Security, Finance
</code></pre></div></div>

<h3 id="4-from-writing-code-to-writing-documents">4. From Writing Code to Writing Documents</h3>

<p>The most neglected communication skill in the transition from developer to architect is <strong>written communication</strong> — not technical documentation, but strategic written communication.</p>

<p>Architecture Decision Records, technology roadmaps, platform strategy briefs, and RFC documents all require the ability to write clearly for an audience that includes both technical and non-technical readers.</p>

<p>A few principles that help:</p>

<p><strong>Lead with the conclusion.</strong> Decision-makers read the first paragraph. Put the recommendation, the rationale in one sentence, and the alternatives considered at the top — not buried at the end.</p>

<p><strong>Use visuals for structure, not decoration.</strong> A diagram that shows the before and after state of an architecture change communicates more than three paragraphs of text.</p>

<p><strong>Distinguish facts from recommendations.</strong> “We have 47 services that call the user service directly” is a fact. “We should introduce an identity mesh layer” is a recommendation. Keep them clearly separated.</p>

<h2 id="what-to-practice-this-week">What to Practice This Week</h2>

<p>Pick one technical decision you are involved in this week. Before the meeting where it gets discussed:</p>

<ol>
  <li>Write a one-page framing document: problem, success criteria, constraints, options</li>
  <li>Share it before the meeting, not during</li>
  <li>In the meeting, start by asking if anyone has questions or corrections to the framing before discussing solutions</li>
</ol>

<p>This single habit — framing before solving — will make you noticeably more effective in architecture conversations within a few months of consistent practice.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#career"
          aria-label="View all posts in category Career"
          >Career</a
        >
         
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2020/09/06/new-job-promotion.html">
        
        <img src="/assets/images/posts/david-auble-manager.jpg" alt="David Auble, Manager" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 06, 2020 · </span
          >
          <h3>David Auble, Manager</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      What Junior Developers Should Learn First: Design, Ops, or Security?
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>What Junior Developers Should Learn First: Design, Ops, or Security? | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="What Junior Developers Should Learn First: Design, Ops, or Security?" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Ask ten senior developers what a junior should focus on first and you will get ten different answers. Some say master the fundamentals. Others say learn cloud and DevOps immediately. A few say security is the most valuable differentiator." />
<meta property="og:description" content="Ask ten senior developers what a junior should focus on first and you will get ten different answers. Some say master the fundamentals. Others say learn cloud and DevOps immediately. A few say security is the most valuable differentiator." />
<link rel="canonical" href="https://davidauble.com/blog/2026/06/30/what-junior-developers-should-learn-first.html" />
<meta property="og:url" content="https://davidauble.com/blog/2026/06/30/what-junior-developers-should-learn-first.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/junior-developer-learning-paths.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2026-06-30T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/junior-developer-learning-paths.jpg" />
<meta property="twitter:title" content="What Junior Developers Should Learn First: Design, Ops, or Security?" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2026-06-30T00:00:00+00:00","datePublished":"2026-06-30T00:00:00+00:00","description":"Ask ten senior developers what a junior should focus on first and you will get ten different answers. Some say master the fundamentals. Others say learn cloud and DevOps immediately. A few say security is the most valuable differentiator.","headline":"What Junior Developers Should Learn First: Design, Ops, or Security?","image":"https://davidauble.com/assets/images/posts/junior-developer-learning-paths.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2026/06/30/what-junior-developers-should-learn-first.html"},"url":"https://davidauble.com/blog/2026/06/30/what-junior-developers-should-learn-first.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>Career</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jun 30, 2026</span
          >
        </div>
        <h1>What Junior Developers Should Learn First: Design, Ops, or Security?</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 5 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>Ask ten senior developers what a junior should focus on first and you will get ten different answers. Some say master the fundamentals. Others say learn cloud and DevOps immediately. A few say security is the most valuable differentiator.</p>

<p>They are all partially right. Here is a more principled answer.</p>

<h2 id="the-three-domains">The Three Domains</h2>

<p><strong>Design</strong> covers how software is structured — patterns, abstractions, APIs, data models, and the tradeoffs between them.</p>

<p><strong>Ops</strong> covers how software runs — deployment, monitoring, scaling, incident response, and the infrastructure beneath it all.</p>

<p><strong>Security</strong> covers how software is protected — threat modeling, authentication, authorization, dependency risk, and secure design principles.</p>

<p>These three are not sequential. They are more like three lenses through which you view the same system.</p>

<h2 id="what-happens-when-you-skip-one">What Happens When You Skip One</h2>

<h3 id="skipping-design">Skipping Design</h3>

<p>Systems become tangled. Features become expensive to change. Every new addition requires touching five other files. This is the path to code that no one wants to inherit.</p>

<h3 id="skipping-ops">Skipping Ops</h3>

<p>You write software that works on your laptop and fails in production in ways you did not anticipate. You cannot interpret logs during an incident. You have no idea what your code costs to run or why it is slow.</p>

<h3 id="skipping-security">Skipping Security</h3>

<p>You ship vulnerabilities you do not know are there. You miss authentication gaps, pass user input directly into queries, and store secrets in places they do not belong.</p>

<div class="language-js highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="c1">// A security mistake many junior developers make:</span>
<span class="nx">app</span><span class="p">.</span><span class="kd">get</span><span class="p">(</span><span class="dl">"</span><span class="s2">/user</span><span class="dl">"</span><span class="p">,</span> <span class="k">async</span> <span class="p">(</span><span class="nx">req</span><span class="p">,</span> <span class="nx">res</span><span class="p">)</span> <span class="o">=&gt;</span> <span class="p">{</span>
  <span class="kd">const</span> <span class="nx">query</span> <span class="o">=</span> <span class="s2">`SELECT * FROM users WHERE id = </span><span class="p">${</span><span class="nx">req</span><span class="p">.</span><span class="nx">query</span><span class="p">.</span><span class="nx">id</span><span class="p">}</span><span class="s2">`</span><span class="p">;</span> <span class="c1">// SQL injection</span>
  <span class="kd">const</span> <span class="nx">result</span> <span class="o">=</span> <span class="k">await</span> <span class="nx">db</span><span class="p">.</span><span class="nx">query</span><span class="p">(</span><span class="nx">query</span><span class="p">);</span>
  <span class="nx">res</span><span class="p">.</span><span class="nx">json</span><span class="p">(</span><span class="nx">result</span><span class="p">);</span>
<span class="p">});</span>

<span class="c1">// Correct approach using parameterized queries:</span>
<span class="nx">app</span><span class="p">.</span><span class="kd">get</span><span class="p">(</span><span class="dl">"</span><span class="s2">/user</span><span class="dl">"</span><span class="p">,</span> <span class="k">async</span> <span class="p">(</span><span class="nx">req</span><span class="p">,</span> <span class="nx">res</span><span class="p">)</span> <span class="o">=&gt;</span> <span class="p">{</span>
  <span class="kd">const</span> <span class="nx">result</span> <span class="o">=</span> <span class="k">await</span> <span class="nx">db</span><span class="p">.</span><span class="nx">query</span><span class="p">(</span><span class="dl">"</span><span class="s2">SELECT * FROM users WHERE id = $1</span><span class="dl">"</span><span class="p">,</span> <span class="p">[</span>
    <span class="nx">req</span><span class="p">.</span><span class="nx">query</span><span class="p">.</span><span class="nx">id</span><span class="p">,</span>
  <span class="p">]);</span>
  <span class="nx">res</span><span class="p">.</span><span class="nx">json</span><span class="p">(</span><span class="nx">result</span><span class="p">);</span>
<span class="p">});</span>
</code></pre></div></div>

<h2 id="a-recommended-learning-order">A Recommended Learning Order</h2>

<p>The most pragmatic sequence for a junior developer aimed at long-term enterprise career growth:</p>

<p><strong>Year 1: Design fundamentals first</strong>
Learn to write readable, maintainable, testable code. Understand SOLID principles not as dogma but as heuristics. Practice designing small APIs and understand why your choices matter.</p>

<p><strong>Year 1 parallel: Security minimums</strong>
You cannot wait until later for security. Learn the OWASP Top 10. Understand what SQL injection, XSS, and broken access control actually look like in code — not just the names. This takes two focused weekends, not two years.</p>

<p><strong>Year 2: Ops awareness</strong>
Start reading your logs in production. Understand what a Kubernetes pod is, what a health check does, and what the difference between a 502 and a 503 tells you about your system. You do not need to become an SRE — you need to be literate.</p>

<p><strong>Year 2+: Go deeper on what your organization values most</strong>
Cloud architecture in a heavy AWS shop. Frontend performance if you are on a consumer-facing product. Data architecture if you are near ML systems.</p>

<h2 id="the-underrated-fourth-domain-communication">The Underrated Fourth Domain: Communication</h2>

<p>None of the above matters at scale unless you can communicate your technical understanding clearly. At the junior level that means:</p>

<ul>
  <li>Writing clear commit messages and PR descriptions</li>
  <li>Asking precise questions (“it returns 401 when the token is valid because…” not “it doesn’t work”)</li>
  <li>Documenting your decisions, however small</li>
</ul>

<p>The developers who grow fastest are rarely the ones who know the most. They are the ones who communicate clearly, ask good questions, and build trust with everyone around them.</p>

<h2 id="a-quick-self-assessment">A Quick Self-Assessment</h2>

<p>If you are not sure where to start, run through these checks:</p>

<div class="language-text highlighter-rouge"><div class="highlight"><pre class="highlight"><code>Design:
  [ ] Can I explain the single responsibility principle with a real example?
  [ ] Can I design a REST API with appropriate HTTP verbs and status codes?
  [ ] Can I write a unit test before I write the implementation?

Ops:
  [ ] Can I read an application log and identify the cause of a failure?
  [ ] Can I deploy my application to a cloud environment without hand-holding?
  [ ] Do I know how to set an environment variable securely?

Security:
  [ ] Can I identify at least three OWASP Top 10 vulnerabilities in code?
  [ ] Do I know how to store passwords correctly (bcrypt/argon2, never plaintext)?
  [ ] Do I know where my application's secrets live and who can access them?
</code></pre></div></div>

<p>Every unchecked box is a learning priority. Start with the one that would cause the most damage if left unaddressed.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#career"
          aria-label="View all posts in category Career"
          >Career</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#enterprise-architecture"
          aria-label="View all posts in category Enterprise Architecture"
          >Enterprise Architecture</a
        >
         
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2020/09/06/new-job-promotion.html">
        
        <img src="/assets/images/posts/david-auble-manager.jpg" alt="David Auble, Manager" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 06, 2020 · </span
          >
          <h3>David Auble, Manager</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Developer to Architect: A 24-Month Skill Roadmap
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Developer to Architect: A 24-Month Skill Roadmap | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Developer to Architect: A 24-Month Skill Roadmap" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="There is no single moment when a developer becomes an architect. It is a gradual accumulation of breadth, judgment, and influence. But that accumulation can be directed. This post maps out a realistic 24-month progression that any motivated developer can follow." />
<meta property="og:description" content="There is no single moment when a developer becomes an architect. It is a gradual accumulation of breadth, judgment, and influence. But that accumulation can be directed. This post maps out a realistic 24-month progression that any motivated developer can follow." />
<link rel="canonical" href="https://davidauble.com/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html" />
<meta property="og:url" content="https://davidauble.com/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/developer-to-architect-roadmap.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2026-06-16T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/developer-to-architect-roadmap.jpg" />
<meta property="twitter:title" content="Developer to Architect: A 24-Month Skill Roadmap" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2026-06-16T00:00:00+00:00","datePublished":"2026-06-16T00:00:00+00:00","description":"There is no single moment when a developer becomes an architect. It is a gradual accumulation of breadth, judgment, and influence. But that accumulation can be directed. This post maps out a realistic 24-month progression that any motivated developer can follow.","headline":"Developer to Architect: A 24-Month Skill Roadmap","image":"https://davidauble.com/assets/images/posts/developer-to-architect-roadmap.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html"},"url":"https://davidauble.com/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>Career</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jun 16, 2026</span
          >
        </div>
        <h1>Developer to Architect: A 24-Month Skill Roadmap</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 6 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>There is no single moment when a developer becomes an architect. It is a gradual accumulation of breadth, judgment, and influence. But that accumulation can be directed. This post maps out a realistic 24-month progression that any motivated developer can follow.</p>

<h2 id="why-24-months">Why 24 Months?</h2>

<p>Architecture skills develop in cycles: learn something, apply it, get feedback from production, repeat. Twelve months is too short to see real consequences of design decisions. Thirty-six months can feel abstract and distant. Twenty-four months is the practical window where meaningful changes compound.</p>

<p>This is not a sprint. It is a deliberate, structured shift in how you approach your work.</p>

<h2 id="months-16-expand-your-system-view">Months 1–6: Expand Your System View</h2>

<p>Most developers start with a narrow view — a service, a component, a feature. The first step is deliberately widening that view.</p>

<p><strong>Focus areas:</strong></p>

<ul>
  <li>Map the full data flow for your product end-to-end, including third-party integrations</li>
  <li>Learn to read and write sequence diagrams, C4 diagrams, and ERDs</li>
  <li>Study one adjacent system your product depends on, deeply</li>
  <li>Start attending architecture reviews — not to present, just to listen</li>
</ul>

<p><strong>Practical action:</strong></p>

<div class="language-bash highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="c"># Start an architecture journal — one entry per week</span>
<span class="c"># What decision was made? What was the alternative? What was the tradeoff?</span>
<span class="nb">mkdir</span> ~/arch-journal
<span class="nb">touch</span> ~/arch-journal/<span class="si">$(</span><span class="nb">date</span> +%Y-%m-%d<span class="si">)</span><span class="nt">-week-notes</span>.md
</code></pre></div></div>

<p><strong>Skill target:</strong> You can diagram your full product’s architecture from memory, including its external dependencies.</p>

<h2 id="months-712-make-intentional-tradeoffs">Months 7–12: Make Intentional Tradeoffs</h2>

<p>Junior developers optimize for solutions that work. Architects optimize for solutions that work <em>under specific constraints</em> — and they can articulate those constraints clearly.</p>

<p><strong>Focus areas:</strong></p>

<ul>
  <li>For every significant technical decision you make, write a one-pager explaining the alternatives you rejected</li>
  <li>Read at least three ADRs from well-known open-source projects</li>
  <li>Learn the CAP theorem and its implications for the systems you work on</li>
  <li>Study resiliency patterns: circuit breakers, retries with exponential backoff, bulkheads</li>
</ul>

<p><strong>Code to understand deeply:</strong></p>

<div class="language-js highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="c1">// Retry with exponential backoff — understand what this is doing, not just how to use it</span>
<span class="k">async</span> <span class="kd">function</span> <span class="nx">fetchWithRetry</span><span class="p">(</span><span class="nx">url</span><span class="p">,</span> <span class="nx">maxAttempts</span> <span class="o">=</span> <span class="mi">4</span><span class="p">)</span> <span class="p">{</span>
  <span class="k">for</span> <span class="p">(</span><span class="kd">let</span> <span class="nx">attempt</span> <span class="o">=</span> <span class="mi">1</span><span class="p">;</span> <span class="nx">attempt</span> <span class="o">&lt;=</span> <span class="nx">maxAttempts</span><span class="p">;</span> <span class="nx">attempt</span><span class="o">++</span><span class="p">)</span> <span class="p">{</span>
    <span class="k">try</span> <span class="p">{</span>
      <span class="kd">const</span> <span class="nx">response</span> <span class="o">=</span> <span class="k">await</span> <span class="nx">fetch</span><span class="p">(</span><span class="nx">url</span><span class="p">);</span>
      <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">response</span><span class="p">.</span><span class="nx">ok</span><span class="p">)</span> <span class="k">throw</span> <span class="k">new</span> <span class="nb">Error</span><span class="p">(</span><span class="s2">`HTTP </span><span class="p">${</span><span class="nx">response</span><span class="p">.</span><span class="nx">status</span><span class="p">}</span><span class="s2">`</span><span class="p">);</span>
      <span class="k">return</span> <span class="nx">response</span><span class="p">;</span>
    <span class="p">}</span> <span class="k">catch</span> <span class="p">(</span><span class="nx">err</span><span class="p">)</span> <span class="p">{</span>
      <span class="k">if</span> <span class="p">(</span><span class="nx">attempt</span> <span class="o">===</span> <span class="nx">maxAttempts</span><span class="p">)</span> <span class="k">throw</span> <span class="nx">err</span><span class="p">;</span>
      <span class="kd">const</span> <span class="nx">delay</span> <span class="o">=</span> <span class="nb">Math</span><span class="p">.</span><span class="nx">min</span><span class="p">(</span><span class="mi">100</span> <span class="o">*</span> <span class="mi">2</span> <span class="o">**</span> <span class="nx">attempt</span><span class="p">,</span> <span class="mi">5000</span><span class="p">);</span>
      <span class="k">await</span> <span class="k">new</span> <span class="nb">Promise</span><span class="p">((</span><span class="nx">r</span><span class="p">)</span> <span class="o">=&gt;</span> <span class="nx">setTimeout</span><span class="p">(</span><span class="nx">r</span><span class="p">,</span> <span class="nx">delay</span> <span class="o">+</span> <span class="nb">Math</span><span class="p">.</span><span class="nx">random</span><span class="p">()</span> <span class="o">*</span> <span class="mi">100</span><span class="p">));</span>
    <span class="p">}</span>
  <span class="p">}</span>
<span class="p">}</span>
</code></pre></div></div>

<p><strong>Skill target:</strong> You can articulate why you <em>did not</em> choose the other two reasonable approaches to any significant decision you made.</p>

<h2 id="months-1318-build-cross-team-influence">Months 13–18: Build Cross-Team Influence</h2>

<p>Architecture is fundamentally a coordination problem. Technical decisions that affect more than one team require trust, communication, and political awareness — not just correctness.</p>

<p><strong>Focus areas:</strong></p>

<ul>
  <li>Propose and lead one cross-team technical initiative (migration, shared library, API contract)</li>
  <li>Practice writing RFC-style documents — the goal is to invite disagreement productively</li>
  <li>Present one technical proposal to a non-technical audience and adjust the framing</li>
  <li>Build a personal network that spans at least three different product teams</li>
</ul>

<p><strong>An RFC template to start with:</strong></p>

<div class="language-markdown highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="gh"># RFC: [Short Title]</span>

<span class="gs">**Status:**</span> Draft | <span class="gs">**Author:**</span> [You] | <span class="gs">**Date:**</span> [Date]
<span class="gs">**Stakeholders:**</span> [Teams/Roles Affected]

<span class="gu">## Problem</span>

What problem are we solving? Why now?

<span class="gu">## Proposed Solution</span>

What are you recommending?

<span class="gu">## Alternatives Considered</span>

What did you evaluate and reject, and why?

<span class="gu">## Impact</span>

What changes for which teams? What are the migration or adoption costs?

<span class="gu">## Open Questions</span>

What do you not know yet? What do you need input on?
</code></pre></div></div>

<p><strong>Skill target:</strong> You have successfully driven a technical decision that required buy-in from at least two teams outside your own.</p>

<h2 id="months-1924-think-in-long-horizons">Months 19–24: Think in Long Horizons</h2>

<p>By this point you have breadth, tradeoff judgment, and influence skills. The final step is learning to hold multiple time horizons simultaneously: what ships this sprint, what the platform looks like in 12 months, and what the organization’s technology direction is in three years.</p>

<p><strong>Focus areas:</strong></p>

<ul>
  <li>Study the Three Horizons model and apply it to your current platform</li>
  <li>Write a 12-month technology roadmap for your product area — even if it is just for your own clarity</li>
  <li>Begin shadowing or contributing to enterprise architecture forums in your organization</li>
  <li>Identify one systemic risk in your organization’s technology portfolio and socialize a mitigation</li>
</ul>

<p><strong>Skill target:</strong> You can describe the same technology situation at three different time scales (today, 12 months, 3 years) for three different audiences.</p>

<h2 id="the-non-technical-skills-that-matter-equally">The Non-Technical Skills That Matter Equally</h2>

<p>Technical depth gets you noticed. These skills get you trusted:</p>

<table>
  <thead>
    <tr>
      <th>Skill</th>
      <th>Why It Matters</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Written communication</td>
      <td>Architecture is persuasion. Clarity of writing signals clarity of thinking.</td>
    </tr>
    <tr>
      <td>Active listening</td>
      <td>Stakeholders tell you the real constraints when they feel heard.</td>
    </tr>
    <tr>
      <td>Knowing what you do not know</td>
      <td>Overconfidence in architecture causes expensive production failures.</td>
    </tr>
    <tr>
      <td>Conflict navigation</td>
      <td>Cross-team alignment always involves some version of disagreement.</td>
    </tr>
  </tbody>
</table>

<h2 id="one-last-thing">One Last Thing</h2>

<p>The path from developer to architect is not a ladder — it is more of a terrain. You will move sideways, hit walls, and occasionally backtrack. The developers who make the transition successfully are not the ones who knew the most; they are the ones who stayed curious and built genuine trust across their organizations.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#career"
          aria-label="View all posts in category Career"
          >Career</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#enterprise-architecture"
          aria-label="View all posts in category Enterprise Architecture"
          >Enterprise Architecture</a
        >
         
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2020/09/06/new-job-promotion.html">
        
        <img src="/assets/images/posts/david-auble-manager.jpg" alt="David Auble, Manager" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 06, 2020 · </span
          >
          <h3>David Auble, Manager</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Enterprise Architecture for Developers: What It Is and What It Is Not
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Enterprise Architecture for Developers: What It Is and What It Is Not | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Enterprise Architecture for Developers: What It Is and What It Is Not" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Enterprise architecture gets a bad reputation in developer circles. It conjures images of slides no one reads, acronyms no one agrees on, and decisions handed down from people who stopped writing code a decade ago." />
<meta property="og:description" content="Enterprise architecture gets a bad reputation in developer circles. It conjures images of slides no one reads, acronyms no one agrees on, and decisions handed down from people who stopped writing code a decade ago." />
<link rel="canonical" href="https://davidauble.com/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html" />
<meta property="og:url" content="https://davidauble.com/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/ea-what-it-is.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2026-06-09T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/ea-what-it-is.jpg" />
<meta property="twitter:title" content="Enterprise Architecture for Developers: What It Is and What It Is Not" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2026-06-09T00:00:00+00:00","datePublished":"2026-06-09T00:00:00+00:00","description":"Enterprise architecture gets a bad reputation in developer circles. It conjures images of slides no one reads, acronyms no one agrees on, and decisions handed down from people who stopped writing code a decade ago.","headline":"Enterprise Architecture for Developers: What It Is and What It Is Not","image":"https://davidauble.com/assets/images/posts/ea-what-it-is.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html"},"url":"https://davidauble.com/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>Enterprise Architecture</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jun 09, 2026</span
          >
        </div>
        <h1>Enterprise Architecture for Developers: What It Is and What It Is Not</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 3 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>Enterprise architecture gets a bad reputation in developer circles. It conjures images of slides no one reads, acronyms no one agrees on, and decisions handed down from people who stopped writing code a decade ago.</p>

<p>That reputation is not entirely wrong. But it is not the whole picture either.</p>

<p>This is the first post in a series aimed at developers who are starting to wonder what architecture actually means — and whether it is a direction worth moving in.</p>

<h2 id="what-enterprise-architecture-is-not">What Enterprise Architecture Is Not</h2>

<p>Let’s start with clearing the air:</p>

<ul>
  <li>It is not a job title that unlocks automatic seniority.</li>
  <li>It is not about drawing boxes on slides and calling it governance.</li>
  <li>It is not divorced from code — the best architects write and review code regularly.</li>
  <li>It is not about slowing down delivery. Done right, it enables delivery at scale.</li>
</ul>

<h2 id="what-it-actually-is">What It Actually Is</h2>

<p>Enterprise Architecture (EA) is the practice of aligning technology decisions with business outcomes across an organization — not just for one team, one product, or one quarter.</p>

<p>At its core, EA answers three ongoing questions:</p>

<p><strong>1. What do we have?</strong>
A clear, maintained picture of systems, data flows, integrations, and dependencies. This is harder than it sounds. Most organizations have partial answers at best.</p>

<p><strong>2. What do we need?</strong>
Business capabilities that are missing, under-supported, or over-engineered. Translating business goals into technology gaps is the core skill.</p>

<p><strong>3. How do we get from here to there?</strong>
A roadmap with sequencing, tradeoffs, and decisions that teams can act on.</p>

<h2 id="what-the-work-actually-looks-like">What the Work Actually Looks Like</h2>

<p>Contrary to the stereotype, a working enterprise architect spends significant time:</p>

<ul>
  <li>In code reviews, looking for patterns that will compound into systemic problems</li>
  <li>In discovery sessions with product owners and business stakeholders</li>
  <li>Writing Architecture Decision Records (ADRs) that give future teams documented rationale</li>
  <li>Building reference architectures that squads can adopt without reinventing the wheel</li>
  <li>Unblocking cross-team integration problems that no single squad owns end-to-end</li>
</ul>

<h2 id="the-progression-from-developer-to-architect">The Progression From Developer to Architect</h2>

<p>Most developers who move toward architecture start as <strong>solution architects</strong> — scoped to one product or domain. The move to enterprise architecture is less about technical depth and more about breadth, communication, and long-horizon thinking.</p>

<div class="language-text highlighter-rouge"><div class="highlight"><pre class="highlight"><code>Developer → Senior Developer → Tech Lead → Solution Architect → Enterprise Architect
 (code)         (code+)          (team)        (product)          (organization)
</code></pre></div></div>

<p>Each step requires a broader antenna — more systems to understand, more stakeholders to align, more time horizons to hold simultaneously.</p>

<h2 id="why-this-series-exists">Why This Series Exists</h2>

<p>There is a lot of content for developers who want to improve at coding. There is much less for developers who want to improve at shaping systems at scale. This series tries to close that gap.</p>

<p>Upcoming topics:</p>

<ul>
  <li>How to think in systems rather than tickets</li>
  <li>How long-range planning models like Three Horizons work in practice</li>
  <li>Architecture Decision Records that teams actually reference</li>
  <li>Career traps that slow down high-potential developers</li>
</ul>

<p>If you are a developer curious about the bigger picture — this series is for you.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#enterprise-architecture"
          aria-label="View all posts in category Enterprise Architecture"
          >Enterprise Architecture</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#career"
          aria-label="View all posts in category Career"
          >Career</a
        >
         
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2020/09/06/new-job-promotion.html">
        
        <img src="/assets/images/posts/david-auble-manager.jpg" alt="David Auble, Manager" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 06, 2020 · </span
          >
          <h3>David Auble, Manager</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
Enterprise Architecture<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      The Three Horizons Model: Shipping Today While Designing for Three Years Out
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>The Three Horizons Model: Shipping Today While Designing for Three Years Out | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="One of the most disorienting parts of growing into an architecture role is learning to hold multiple time frames in your head simultaneously. Your sprint team wants to know what ships this week. Your product manager wants to know what is landing next quarter. Your CTO wants to know where the platform will be in three years." />
<meta property="og:description" content="One of the most disorienting parts of growing into an architecture role is learning to hold multiple time frames in your head simultaneously. Your sprint team wants to know what ships this week. Your product manager wants to know what is landing next quarter. Your CTO wants to know where the platform will be in three years." />
<link rel="canonical" href="https://davidauble.com/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html" />
<meta property="og:url" content="https://davidauble.com/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/three-horizons-model.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2026-07-14T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/three-horizons-model.jpg" />
<meta property="twitter:title" content="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2026-07-14T00:00:00+00:00","datePublished":"2026-07-14T00:00:00+00:00","description":"One of the most disorienting parts of growing into an architecture role is learning to hold multiple time frames in your head simultaneously. Your sprint team wants to know what ships this week. Your product manager wants to know what is landing next quarter. Your CTO wants to know where the platform will be in three years.","headline":"The Three Horizons Model: Shipping Today While Designing for Three Years Out","image":"https://davidauble.com/assets/images/posts/three-horizons-model.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html"},"url":"https://davidauble.com/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>Enterprise Architecture</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jul 14, 2026</span
          >
        </div>
        <h1>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 4 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>One of the most disorienting parts of growing into an architecture role is learning to hold multiple time frames in your head simultaneously. Your sprint team wants to know what ships this week. Your product manager wants to know what is landing next quarter. Your CTO wants to know where the platform will be in three years.</p>

<p>These are not three separate conversations. They are three lenses on the same system. The Three Horizons model is a framework for navigating all three at once.</p>

<h2 id="the-model">The Model</h2>

<p>Originally developed by McKinsey and adapted widely in technology strategy, the Three Horizons model divides work into three concurrent categories:</p>

<p><strong>Horizon 1 — Core business today</strong>
What keeps the lights on and generates current value. In technology terms: the systems and features your users depend on right now. Investment here is about reliability, performance, and incremental improvement.</p>

<p><strong>Horizon 2 — Emerging opportunities</strong>
The investments that are not yet generating full return but will in 12–24 months. Platform migrations, new technology adoptions, capability gaps being closed. These require sustained investment with uncertain near-term returns.</p>

<p><strong>Horizon 3 — Transformational bets</strong>
Longer-horizon explorations — often R&amp;D, proofs of concept, or strategic explorations — that could redefine what the organization does. These are small investments now with potentially large payoffs later.</p>

<div class="language-text highlighter-rouge"><div class="highlight"><pre class="highlight"><code>Value ^
      |                                           H3 (small bets, uncertain)
      |                              H2 (growing investment, emerging return)
      |   H1 (core, reliable, well-funded)
      +---------------------------------------------------&gt; Time
     Now                                               3 Years
</code></pre></div></div>

<h2 id="why-developers-often-only-see-horizon-1">Why Developers Often Only See Horizon 1</h2>

<p>Product teams are optimized for H1. The roadmap is quarterly. The backlog is prioritized by immediate user value. This is rational — it is how products survive. But it creates a systematic blindspot.</p>

<p>Technical debt accumulates in H1 without ever being addressed because it does not fit the urgency model. Platform migrations sit perpetually in H2 because the return is not visible until later. H3 never gets explored because there is no sprint for exploration.</p>

<p>Enterprise architects exist partly to protect H2 and H3 from being consumed by H1 indefinitely.</p>

<h2 id="applying-this-to-your-platform">Applying This to Your Platform</h2>

<p>A practical exercise: take your current technology portfolio and categorize your investments across three horizons.</p>

<div class="language-text highlighter-rouge"><div class="highlight"><pre class="highlight"><code>Example (pharma digital platform):

H1 (operational excellence):
  - Patient portal performance and availability
  - HCP-facing CRM integrations
  - Existing CMS content workflows

H2 (capability building):
  - Moving from monolith to modular services
  - Adopting AEP for unified customer data
  - Maturing CI/CD pipeline with automated security gates

H3 (transformational exploration):
  - AI-powered clinical trial recruitment personalization
  - Generative AI in medical content authoring
  - Decentralized identity for patient data portability
</code></pre></div></div>

<p>The distribution matters as much as the categorization. If 95% of investment is H1, the organization is running in place. If too much sits in H3 without H1 stability, nothing gets delivered reliably.</p>

<h2 id="the-architects-job-in-each-horizon">The Architect’s Job in Each Horizon</h2>

<p><strong>In H1:</strong> Defend quality, resist shortcuts that increase long-term cost, ensure operational reliability standards are met.</p>

<p><strong>In H2:</strong> Champion migration efforts, manage the technical risk of transition, create clear on-ramps and off-ramps for teams adopting new patterns.</p>

<p><strong>In H3:</strong> Run structured experiments, time-box explorations, create learning loops that feed insights back into H2 planning.</p>

<h2 id="a-practical-bias-most-h2-work-fails-without-an-h1-funding-model">A Practical Bias: Most H2 Work Fails Without an H1 Funding Model</h2>

<p>The most common failure mode for H2 investment is that it is funded episodically. Teams get budget for a platform migration, make partial progress, then get pulled back into H1 emergencies. The migration stalls, trust in the new platform erodes, and the organization remains on the old platform for years longer than planned.</p>

<p>The architectural fix is to <em>attach H2 investment to H1 deliverables</em>. Migrate a piece of the platform as part of delivering an H1 feature. Make H2 progress the path of least resistance for H1 work. This requires intentional sequencing and close collaboration with product management — but it is the most reliable way to make H2 investments actually complete.</p>

<h2 id="further-reading">Further Reading</h2>

<p>The original McKinsey framing of Three Horizons has been critiqued and extended by many practitioners. Steve Blank’s updated treatment — “McKinsey’s Three Horizons Model Defined Innovation for Years. Here’s Why It No Longer Applies.” — is worth reading as a counterpoint, particularly his argument that in fast-moving technology contexts, H3 innovations can collapse into H1 far faster than the original model assumed.</p>

<p>Both views are worth holding: the original model as a planning discipline, and Blank’s critique as a reminder that pace of change matters in how you apply it.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#enterprise-architecture"
          aria-label="View all posts in category Enterprise Architecture"
          >Enterprise Architecture</a
        >
         
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2020/09/06/new-job-promotion.html">
        
        <img src="/assets/images/posts/david-auble-manager.jpg" alt="David Auble, Manager" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 06, 2020 · </span
          >
          <h3>David Auble, Manager</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="If you work at any organization with a meaningful digital presence, you have almost certainly run into Adobe’s enterprise platform in some form. Adobe Experience Manager (AEM), Adobe Experience Platform (AEP), and the broader Adobe DXP (Digital Experience Platform) stack represent one of the most widely adopted enterprise content and data platforms on the market." />
<meta property="og:description" content="If you work at any organization with a meaningful digital presence, you have almost certainly run into Adobe’s enterprise platform in some form. Adobe Experience Manager (AEM), Adobe Experience Platform (AEP), and the broader Adobe DXP (Digital Experience Platform) stack represent one of the most widely adopted enterprise content and data platforms on the market." />
<link rel="canonical" href="https://davidauble.com/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html" />
<meta property="og:url" content="https://davidauble.com/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/adobe-dxp-stack.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2026-07-07T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/adobe-dxp-stack.jpg" />
<meta property="twitter:title" content="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2026-07-07T00:00:00+00:00","datePublished":"2026-07-07T00:00:00+00:00","description":"If you work at any organization with a meaningful digital presence, you have almost certainly run into Adobe’s enterprise platform in some form. Adobe Experience Manager (AEM), Adobe Experience Platform (AEP), and the broader Adobe DXP (Digital Experience Platform) stack represent one of the most widely adopted enterprise content and data platforms on the market.","headline":"Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know","image":"https://davidauble.com/assets/images/posts/adobe-dxp-stack.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html"},"url":"https://davidauble.com/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>Industry News</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jul 07, 2026</span
          >
        </div>
        <h1>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 6 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>If you work at any organization with a meaningful digital presence, you have almost certainly run into Adobe’s enterprise platform in some form. Adobe Experience Manager (AEM), Adobe Experience Platform (AEP), and the broader Adobe DXP (Digital Experience Platform) stack represent one of the most widely adopted enterprise content and data platforms on the market.</p>

<p>For enterprise architects, understanding this ecosystem is not optional — it is increasingly a prerequisite.</p>

<h2 id="what-adobes-dxp-stack-actually-includes">What Adobe’s DXP Stack Actually Includes</h2>

<p>Adobe positions its enterprise offerings around three interconnected pillars:</p>

<p><strong>Adobe Experience Manager (AEM)</strong>
A Java-based CMS and Digital Asset Management (DAM) platform. Available as AEM Cloud Service (hosted by Adobe) or as a managed-cloud deployment on Azure or AWS. AEM handles authoring, publishing, asset management, and translation workflows for large-scale digital properties.</p>

<p><strong>Adobe Experience Platform (AEP)</strong>
The data layer of the DXP. AEP centralizes customer behavioral data, unifies identity across channels, and powers real-time segmentation. It sits beneath most Adobe marketing applications including Journey Optimizer, Real-Time CDP, and Customer Journey Analytics.</p>

<p><strong>Adobe Analytics and Target</strong>
Behavioral data collection and personalization/experimentation, respectively. For enterprise web architectures, these frequently appear as requirements from marketing teams rather than technology teams — which creates interesting governance challenges.</p>

<h2 id="the-architecture-decisions-aem-forces-you-to-make">The Architecture Decisions AEM Forces You to Make</h2>

<p>AEM is not a system you plug in. It is a platform you build around. Every significant AEM engagement requires architectural decisions that ripple into your front-end, infrastructure, and deployment strategy.</p>

<p><strong>Headless vs. Hybrid vs. Traditional</strong></p>

<p>AEM supports three delivery models:</p>

<div class="language-text highlighter-rouge"><div class="highlight"><pre class="highlight"><code>Traditional (full-stack): AEM renders HTML server-side. Authors control the full page.
Hybrid:                   AEM manages content and some rendering; a JavaScript
                          framework handles the rest.
Headless:                 AEM is purely a content API. Any frontend framework
                          consumes it via GraphQL or REST.
</code></pre></div></div>

<p>Newer projects on AEM Cloud Service increasingly use the headless model, with AEM serving as a content repository behind a Next.js or React-based frontend. This pattern is called the <strong>WKND pattern</strong> in Adobe’s documentation and gives teams modern development workflows while preserving AEM’s authoring experience.</p>

<p><strong>Example: Querying AEM content via GraphQL</strong></p>

<div class="language-graphql highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="k">query</span><span class="w"> </span><span class="n">GetArticleList</span><span class="w"> </span><span class="p">{</span><span class="w">
  </span><span class="n">articleList</span><span class="w"> </span><span class="p">{</span><span class="w">
    </span><span class="n">items</span><span class="w"> </span><span class="p">{</span><span class="w">
      </span><span class="n">_path</span><span class="w">
      </span><span class="n">title</span><span class="w">
      </span><span class="n">summary</span><span class="w">
      </span><span class="n">publishDate</span><span class="w">
      </span><span class="n">author</span><span class="w"> </span><span class="p">{</span><span class="w">
        </span><span class="n">fullName</span><span class="w">
        </span><span class="n">profileImage</span><span class="w"> </span><span class="p">{</span><span class="w">
          </span><span class="p">...</span><span class="w"> </span><span class="k">on</span><span class="w"> </span><span class="n">ImageRef</span><span class="w"> </span><span class="p">{</span><span class="w">
            </span><span class="n">_path</span><span class="w">
          </span><span class="p">}</span><span class="w">
        </span><span class="p">}</span><span class="w">
      </span><span class="p">}</span><span class="w">
    </span><span class="p">}</span><span class="w">
  </span><span class="p">}</span><span class="w">
</span><span class="p">}</span><span class="w">
</span></code></pre></div></div>

<p><strong>Sling Model and Component Architecture</strong></p>

<p>If you are on a hybrid or traditional AEM deployment, understanding the Sling framework is non-negotiable. Sling maps HTTP requests to JCR (Java Content Repository) nodes, and custom components are backed by Sling Models — Java classes that inject content and expose it to HTL (HTML Template Language) templates.</p>

<div class="language-java highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nd">@Model</span><span class="o">(</span><span class="n">adaptables</span> <span class="o">=</span> <span class="nc">Resource</span><span class="o">.</span><span class="na">class</span><span class="o">)</span>
<span class="kd">public</span> <span class="kd">class</span> <span class="nc">HeroComponent</span> <span class="o">{</span>

    <span class="nd">@ValueMapValue</span>
    <span class="kd">private</span> <span class="nc">String</span> <span class="n">headline</span><span class="o">;</span>

    <span class="nd">@ValueMapValue</span>
    <span class="kd">private</span> <span class="nc">String</span> <span class="n">subtext</span><span class="o">;</span>

    <span class="nd">@ChildResource</span>
    <span class="kd">private</span> <span class="nc">Resource</span> <span class="n">image</span><span class="o">;</span>

    <span class="kd">public</span> <span class="nc">String</span> <span class="nf">getHeadline</span><span class="o">()</span> <span class="o">{</span> <span class="k">return</span> <span class="n">headline</span><span class="o">;</span> <span class="o">}</span>
    <span class="kd">public</span> <span class="nc">String</span> <span class="nf">getSubtext</span><span class="o">()</span>  <span class="o">{</span> <span class="k">return</span> <span class="n">subtext</span><span class="o">;</span> <span class="o">}</span>
    <span class="kd">public</span> <span class="nc">Resource</span> <span class="nf">getImage</span><span class="o">()</span>  <span class="o">{</span> <span class="k">return</span> <span class="n">image</span><span class="o">;</span> <span class="o">}</span>
<span class="o">}</span>
</code></pre></div></div>

<h2 id="what-aep-means-for-data-architecture">What AEP Means for Data Architecture</h2>

<p>Adobe Experience Platform is a schema-first, event-driven data platform built on top of Apache Kafka, Apache Spark, and a proprietary query service. For enterprise architects the key concepts are:</p>

<ul>
  <li><strong>XDM (Experience Data Model):</strong> Adobe’s standardized schema language. Every dataset in AEP must conform to XDM. This is a governance lever — and also a source of significant implementation effort when organizations have inconsistent data models.</li>
  <li><strong>Identity Graph:</strong> AEP maintains a probabilistic and deterministic identity resolution graph. Understanding this matters when designing data flows across authenticated and unauthenticated surfaces.</li>
  <li><strong>Real-Time CDP:</strong> The activation layer. Data from AEP segments flows into Real-Time CDP for audience activation across paid media, email, and on-site personalization.</li>
</ul>

<h2 id="common-architectural-traps">Common Architectural Traps</h2>

<p><strong>1. Coupling your frontend too tightly to AEM’s content model</strong>
When teams put too much structure into AEM’s content model, they create authoring rigidity that marketing teams quickly resent. Design content models for reuse and flexibility, not per-page specificity.</p>

<p><strong>2. Treating AEP as a data warehouse</strong>
AEP is optimized for identity resolution, segmentation, and activation — not batch analytics. Teams that try to run heavy reporting queries against AEP repeatedly hit performance and cost issues. Use Adobe Customer Journey Analytics or an external data warehouse for reporting workloads.</p>

<p><strong>3. Underestimating AEM Cloud Service’s CI/CD requirements</strong>
AEM Cloud Service does not accept arbitrary code deployments. All code ships through Cloud Manager — Adobe’s CI/CD pipeline. This is a good thing from a reliability standpoint, but it requires teams to adapt their deployment workflow and test coverage significantly.</p>

<div class="language-yaml highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="c1"># Simplified Cloud Manager pipeline stage overview</span>
<span class="na">stages</span><span class="pi">:</span>
  <span class="pi">-</span> <span class="na">name</span><span class="pi">:</span> <span class="s">build</span>
    <span class="na">type</span><span class="pi">:</span> <span class="s">Maven</span>
    <span class="na">goals</span><span class="pi">:</span> <span class="s">clean install</span>
    <span class="na">profiles</span><span class="pi">:</span> <span class="s">cloud</span>
  <span class="pi">-</span> <span class="na">name</span><span class="pi">:</span> <span class="s">code-quality</span>
    <span class="na">type</span><span class="pi">:</span> <span class="s">CodeScanning</span>
    <span class="na">blockers</span><span class="pi">:</span> <span class="s">critical,major</span>
  <span class="pi">-</span> <span class="na">name</span><span class="pi">:</span> <span class="s">deploy-stage</span>
    <span class="na">type</span><span class="pi">:</span> <span class="s">AEMDeploy</span>
    <span class="na">environment</span><span class="pi">:</span> <span class="s">stage</span>
  <span class="pi">-</span> <span class="na">name</span><span class="pi">:</span> <span class="s">ui-tests</span>
    <span class="na">type</span><span class="pi">:</span> <span class="s">Selenium</span>
  <span class="pi">-</span> <span class="na">name</span><span class="pi">:</span> <span class="s">deploy-prod</span>
    <span class="na">type</span><span class="pi">:</span> <span class="s">AEMDeploy</span>
    <span class="na">environment</span><span class="pi">:</span> <span class="s">production</span>
    <span class="na">requiresApproval</span><span class="pi">:</span> <span class="no">true</span>
</code></pre></div></div>

<h2 id="where-adobe-is-heading">Where Adobe Is Heading</h2>

<p>Adobe’s strategic direction centers on AI integration throughout the DXP stack. Adobe Firefly generative AI is being embedded into AEM authoring workflows, allowing content teams to generate and modify visual assets without leaving the CMS. Sensei-powered personalization and Journey Optimizer’s AI decisioning features are maturing rapidly.</p>

<p>For enterprise architects, the near-term question is: <strong>how do you govern AI-generated content at scale?</strong> Adobe is building the tooling; organizations need to build the policy and data governance frameworks around it.</p>

<p>More on Adobe Firefly and enterprise AI architecture in an upcoming post.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#industry-news"
          aria-label="View all posts in category Industry News"
          >Industry News</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#enterprise-architecture"
          aria-label="View all posts in category Enterprise Architecture"
          >Enterprise Architecture</a
        >
         
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2020/09/06/new-job-promotion.html">
        
        <img src="/assets/images/posts/david-auble-manager.jpg" alt="David Auble, Manager" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 06, 2020 · </span
          >
          <h3>David Auble, Manager</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      What Junior Developers Should Learn First: Design, Ops, or Security?
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>What Junior Developers Should Learn First: Design, Ops, or Security? | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="What Junior Developers Should Learn First: Design, Ops, or Security?" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Ask ten senior developers what a junior should focus on first and you will get ten different answers. Some say master the fundamentals. Others say learn cloud and DevOps immediately. A few say security is the most valuable differentiator." />
<meta property="og:description" content="Ask ten senior developers what a junior should focus on first and you will get ten different answers. Some say master the fundamentals. Others say learn cloud and DevOps immediately. A few say security is the most valuable differentiator." />
<link rel="canonical" href="https://davidauble.com/blog/2026/06/30/what-junior-developers-should-learn-first.html" />
<meta property="og:url" content="https://davidauble.com/blog/2026/06/30/what-junior-developers-should-learn-first.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/junior-developer-learning-paths.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2026-06-30T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/junior-developer-learning-paths.jpg" />
<meta property="twitter:title" content="What Junior Developers Should Learn First: Design, Ops, or Security?" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2026-06-30T00:00:00+00:00","datePublished":"2026-06-30T00:00:00+00:00","description":"Ask ten senior developers what a junior should focus on first and you will get ten different answers. Some say master the fundamentals. Others say learn cloud and DevOps immediately. A few say security is the most valuable differentiator.","headline":"What Junior Developers Should Learn First: Design, Ops, or Security?","image":"https://davidauble.com/assets/images/posts/junior-developer-learning-paths.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2026/06/30/what-junior-developers-should-learn-first.html"},"url":"https://davidauble.com/blog/2026/06/30/what-junior-developers-should-learn-first.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>Career</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jun 30, 2026</span
          >
        </div>
        <h1>What Junior Developers Should Learn First: Design, Ops, or Security?</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 5 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>Ask ten senior developers what a junior should focus on first and you will get ten different answers. Some say master the fundamentals. Others say learn cloud and DevOps immediately. A few say security is the most valuable differentiator.</p>

<p>They are all partially right. Here is a more principled answer.</p>

<h2 id="the-three-domains">The Three Domains</h2>

<p><strong>Design</strong> covers how software is structured — patterns, abstractions, APIs, data models, and the tradeoffs between them.</p>

<p><strong>Ops</strong> covers how software runs — deployment, monitoring, scaling, incident response, and the infrastructure beneath it all.</p>

<p><strong>Security</strong> covers how software is protected — threat modeling, authentication, authorization, dependency risk, and secure design principles.</p>

<p>These three are not sequential. They are more like three lenses through which you view the same system.</p>

<h2 id="what-happens-when-you-skip-one">What Happens When You Skip One</h2>

<h3 id="skipping-design">Skipping Design</h3>

<p>Systems become tangled. Features become expensive to change. Every new addition requires touching five other files. This is the path to code that no one wants to inherit.</p>

<h3 id="skipping-ops">Skipping Ops</h3>

<p>You write software that works on your laptop and fails in production in ways you did not anticipate. You cannot interpret logs during an incident. You have no idea what your code costs to run or why it is slow.</p>

<h3 id="skipping-security">Skipping Security</h3>

<p>You ship vulnerabilities you do not know are there. You miss authentication gaps, pass user input directly into queries, and store secrets in places they do not belong.</p>

<div class="language-js highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="c1">// A security mistake many junior developers make:</span>
<span class="nx">app</span><span class="p">.</span><span class="kd">get</span><span class="p">(</span><span class="dl">"</span><span class="s2">/user</span><span class="dl">"</span><span class="p">,</span> <span class="k">async</span> <span class="p">(</span><span class="nx">req</span><span class="p">,</span> <span class="nx">res</span><span class="p">)</span> <span class="o">=&gt;</span> <span class="p">{</span>
  <span class="kd">const</span> <span class="nx">query</span> <span class="o">=</span> <span class="s2">`SELECT * FROM users WHERE id = </span><span class="p">${</span><span class="nx">req</span><span class="p">.</span><span class="nx">query</span><span class="p">.</span><span class="nx">id</span><span class="p">}</span><span class="s2">`</span><span class="p">;</span> <span class="c1">// SQL injection</span>
  <span class="kd">const</span> <span class="nx">result</span> <span class="o">=</span> <span class="k">await</span> <span class="nx">db</span><span class="p">.</span><span class="nx">query</span><span class="p">(</span><span class="nx">query</span><span class="p">);</span>
  <span class="nx">res</span><span class="p">.</span><span class="nx">json</span><span class="p">(</span><span class="nx">result</span><span class="p">);</span>
<span class="p">});</span>

<span class="c1">// Correct approach using parameterized queries:</span>
<span class="nx">app</span><span class="p">.</span><span class="kd">get</span><span class="p">(</span><span class="dl">"</span><span class="s2">/user</span><span class="dl">"</span><span class="p">,</span> <span class="k">async</span> <span class="p">(</span><span class="nx">req</span><span class="p">,</span> <span class="nx">res</span><span class="p">)</span> <span class="o">=&gt;</span> <span class="p">{</span>
  <span class="kd">const</span> <span class="nx">result</span> <span class="o">=</span> <span class="k">await</span> <span class="nx">db</span><span class="p">.</span><span class="nx">query</span><span class="p">(</span><span class="dl">"</span><span class="s2">SELECT * FROM users WHERE id = $1</span><span class="dl">"</span><span class="p">,</span> <span class="p">[</span>
    <span class="nx">req</span><span class="p">.</span><span class="nx">query</span><span class="p">.</span><span class="nx">id</span><span class="p">,</span>
  <span class="p">]);</span>
  <span class="nx">res</span><span class="p">.</span><span class="nx">json</span><span class="p">(</span><span class="nx">result</span><span class="p">);</span>
<span class="p">});</span>
</code></pre></div></div>

<h2 id="a-recommended-learning-order">A Recommended Learning Order</h2>

<p>The most pragmatic sequence for a junior developer aimed at long-term enterprise career growth:</p>

<p><strong>Year 1: Design fundamentals first</strong>
Learn to write readable, maintainable, testable code. Understand SOLID principles not as dogma but as heuristics. Practice designing small APIs and understand why your choices matter.</p>

<p><strong>Year 1 parallel: Security minimums</strong>
You cannot wait until later for security. Learn the OWASP Top 10. Understand what SQL injection, XSS, and broken access control actually look like in code — not just the names. This takes two focused weekends, not two years.</p>

<p><strong>Year 2: Ops awareness</strong>
Start reading your logs in production. Understand what a Kubernetes pod is, what a health check does, and what the difference between a 502 and a 503 tells you about your system. You do not need to become an SRE — you need to be literate.</p>

<p><strong>Year 2+: Go deeper on what your organization values most</strong>
Cloud architecture in a heavy AWS shop. Frontend performance if you are on a consumer-facing product. Data architecture if you are near ML systems.</p>

<h2 id="the-underrated-fourth-domain-communication">The Underrated Fourth Domain: Communication</h2>

<p>None of the above matters at scale unless you can communicate your technical understanding clearly. At the junior level that means:</p>

<ul>
  <li>Writing clear commit messages and PR descriptions</li>
  <li>Asking precise questions (“it returns 401 when the token is valid because…” not “it doesn’t work”)</li>
  <li>Documenting your decisions, however small</li>
</ul>

<p>The developers who grow fastest are rarely the ones who know the most. They are the ones who communicate clearly, ask good questions, and build trust with everyone around them.</p>

<h2 id="a-quick-self-assessment">A Quick Self-Assessment</h2>

<p>If you are not sure where to start, run through these checks:</p>

<div class="language-text highlighter-rouge"><div class="highlight"><pre class="highlight"><code>Design:
  [ ] Can I explain the single responsibility principle with a real example?
  [ ] Can I design a REST API with appropriate HTTP verbs and status codes?
  [ ] Can I write a unit test before I write the implementation?

Ops:
  [ ] Can I read an application log and identify the cause of a failure?
  [ ] Can I deploy my application to a cloud environment without hand-holding?
  [ ] Do I know how to set an environment variable securely?

Security:
  [ ] Can I identify at least three OWASP Top 10 vulnerabilities in code?
  [ ] Do I know how to store passwords correctly (bcrypt/argon2, never plaintext)?
  [ ] Do I know where my application's secrets live and who can access them?
</code></pre></div></div>

<p>Every unchecked box is a learning priority. Start with the one that would cause the most damage if left unaddressed.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#career"
          aria-label="View all posts in category Career"
          >Career</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#enterprise-architecture"
          aria-label="View all posts in category Enterprise Architecture"
          >Enterprise Architecture</a
        >
         
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2020/09/06/new-job-promotion.html">
        
        <img src="/assets/images/posts/david-auble-manager.jpg" alt="David Auble, Manager" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 06, 2020 · </span
          >
          <h3>David Auble, Manager</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      How to Think in Systems, Not Tickets
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>How to Think in Systems, Not Tickets | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="How to Think in Systems, Not Tickets" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Most developers are trained to think in tickets. A ticket arrives, you understand the requirement, you write the code, you close the ticket. This is valuable. It is also insufficient for anyone who wants to understand why the system behaves the way it does." />
<meta property="og:description" content="Most developers are trained to think in tickets. A ticket arrives, you understand the requirement, you write the code, you close the ticket. This is valuable. It is also insufficient for anyone who wants to understand why the system behaves the way it does." />
<link rel="canonical" href="https://davidauble.com/blog/2026/06/23/how-to-think-in-systems-not-tickets.html" />
<meta property="og:url" content="https://davidauble.com/blog/2026/06/23/how-to-think-in-systems-not-tickets.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/systems-thinking.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2026-06-23T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/systems-thinking.jpg" />
<meta property="twitter:title" content="How to Think in Systems, Not Tickets" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2026-06-23T00:00:00+00:00","datePublished":"2026-06-23T00:00:00+00:00","description":"Most developers are trained to think in tickets. A ticket arrives, you understand the requirement, you write the code, you close the ticket. This is valuable. It is also insufficient for anyone who wants to understand why the system behaves the way it does.","headline":"How to Think in Systems, Not Tickets","image":"https://davidauble.com/assets/images/posts/systems-thinking.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2026/06/23/how-to-think-in-systems-not-tickets.html"},"url":"https://davidauble.com/blog/2026/06/23/how-to-think-in-systems-not-tickets.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>Enterprise Architecture</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jun 23, 2026</span
          >
        </div>
        <h1>How to Think in Systems, Not Tickets</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 4 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>Most developers are trained to think in tickets. A ticket arrives, you understand the requirement, you write the code, you close the ticket. This is valuable. It is also insufficient for anyone who wants to understand why the system behaves the way it does.</p>

<p>Systems thinking is the habit of asking a different class of question.</p>

<h2 id="the-difference-between-ticket-thinking-and-systems-thinking">The Difference Between Ticket Thinking and Systems Thinking</h2>

<table>
  <thead>
    <tr>
      <th>Ticket Thinking</th>
      <th>Systems Thinking</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Why is this feature broken?</td>
      <td>Why does this category of failure keep appearing?</td>
    </tr>
    <tr>
      <td>How do I fix this bug?</td>
      <td>What made this bug possible in the first place?</td>
    </tr>
    <tr>
      <td>What does this service do?</td>
      <td>What does this service’s behavior do to every other service?</td>
    </tr>
    <tr>
      <td>Is this the right implementation?</td>
      <td>Is this the right abstraction for the next three years?</td>
    </tr>
  </tbody>
</table>

<p>Neither mode is wrong. Both are necessary. The problem arises when developers only ever operate in ticket mode — because ticket mode is optimized for now, and architecture is optimized for later.</p>

<h2 id="feedback-loops-the-core-concept">Feedback Loops: The Core Concept</h2>

<p>The most important idea in systems thinking is the <strong>feedback loop</strong>. Every system has mechanisms that amplify or dampen behavior over time. Understanding these is the difference between building something that stays healthy and building something that slowly becomes unmanageable.</p>

<p><strong>Reinforcing loop (amplifying):</strong>
More users → more load → slower responses → worse user experience → fewer users.
Or in a positive direction: better DX → more contributors → more features → better DX.</p>

<p><strong>Balancing loop (damping):</strong>
High error rate → alerts fire → team investigates → root cause fixed → error rate drops.</p>

<p>When something in a system gets worse and worse despite fixes, you are usually fighting a reinforcing loop. When something never quite gets fully solved, you are probably in a balancing loop that has settled at an unacceptable equilibrium.</p>

<h2 id="a-practical-exercise-map-the-loops-in-your-system">A Practical Exercise: Map the Loops in Your System</h2>

<p>Take a service you know well. Write down:</p>

<ol>
  <li>What are the inputs to this service?</li>
  <li>What are the outputs?</li>
  <li>Which outputs feed back into inputs — directly or through other systems?</li>
  <li>What happens to behavior under load? Under failure? Under degraded dependency?</li>
</ol>

<div class="language-text highlighter-rouge"><div class="highlight"><pre class="highlight"><code>Example: User authentication service

Inputs:  login requests, token validation requests, session refresh calls
Outputs: JWT tokens, session states, audit log events

Feedback paths:
- Slow token validation → frontend retries → more requests → slower validation (reinforcing)
- Expired tokens → forced re-login → more login requests at peak hours (balancing)
- Failed logins → account lockout → support tickets → account unlocks → failed logins (balancing loop with cost)
</code></pre></div></div>

<h2 id="the-stocks-and-flows-mental-model">The Stocks and Flows Mental Model</h2>

<p>A “stock” is anything that accumulates — technical debt, database records, API contracts, trust between teams. A “flow” is what adds or removes from a stock.</p>

<p>Developers often work on flows (write code, deploy features) without tracking the stocks (accumulated complexity, growing coupling, mounting unresolved decisions). Architects track both.</p>

<div class="language-text highlighter-rouge"><div class="highlight"><pre class="highlight"><code>Stock: Monolith complexity

Flows in:  new features, quick fixes, copy-pasted modules
Flows out: refactors, service extractions, documentation, testing

The monolith grows when flows in exceed flows out — which they almost always do
unless the team deliberately invests in reducing the stock.
</code></pre></div></div>

<h2 id="shifting-the-habit">Shifting the Habit</h2>

<p>You cannot think in systems by reading about it. You shift the habit by practicing the right questions in your daily work:</p>

<ul>
  <li><strong>Before starting a ticket:</strong> What existing behavior in the system does this change?</li>
  <li><strong>In a code review:</strong> What does this change do to the system’s failure modes?</li>
  <li><strong>In a postmortem:</strong> What was the feedback loop that allowed this to reach production?</li>
  <li><strong>In planning:</strong> What stock are we growing this quarter, and is that intentional?</li>
</ul>

<p>Systems thinking is not a framework you bolt on. It is a habit of noticing that everything is connected, that time matters, and that the most important consequences are usually the ones that arrive late.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#enterprise-architecture"
          aria-label="View all posts in category Enterprise Architecture"
          >Enterprise Architecture</a
        >
         
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2020/09/06/new-job-promotion.html">
        
        <img src="/assets/images/posts/david-auble-manager.jpg" alt="David Auble, Manager" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 06, 2020 · </span
          >
          <h3>David Auble, Manager</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Developer to Architect: A 24-Month Skill Roadmap
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Developer to Architect: A 24-Month Skill Roadmap | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Developer to Architect: A 24-Month Skill Roadmap" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="There is no single moment when a developer becomes an architect. It is a gradual accumulation of breadth, judgment, and influence. But that accumulation can be directed. This post maps out a realistic 24-month progression that any motivated developer can follow." />
<meta property="og:description" content="There is no single moment when a developer becomes an architect. It is a gradual accumulation of breadth, judgment, and influence. But that accumulation can be directed. This post maps out a realistic 24-month progression that any motivated developer can follow." />
<link rel="canonical" href="https://davidauble.com/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html" />
<meta property="og:url" content="https://davidauble.com/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/developer-to-architect-roadmap.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2026-06-16T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/developer-to-architect-roadmap.jpg" />
<meta property="twitter:title" content="Developer to Architect: A 24-Month Skill Roadmap" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2026-06-16T00:00:00+00:00","datePublished":"2026-06-16T00:00:00+00:00","description":"There is no single moment when a developer becomes an architect. It is a gradual accumulation of breadth, judgment, and influence. But that accumulation can be directed. This post maps out a realistic 24-month progression that any motivated developer can follow.","headline":"Developer to Architect: A 24-Month Skill Roadmap","image":"https://davidauble.com/assets/images/posts/developer-to-architect-roadmap.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html"},"url":"https://davidauble.com/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>Career</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jun 16, 2026</span
          >
        </div>
        <h1>Developer to Architect: A 24-Month Skill Roadmap</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 6 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>There is no single moment when a developer becomes an architect. It is a gradual accumulation of breadth, judgment, and influence. But that accumulation can be directed. This post maps out a realistic 24-month progression that any motivated developer can follow.</p>

<h2 id="why-24-months">Why 24 Months?</h2>

<p>Architecture skills develop in cycles: learn something, apply it, get feedback from production, repeat. Twelve months is too short to see real consequences of design decisions. Thirty-six months can feel abstract and distant. Twenty-four months is the practical window where meaningful changes compound.</p>

<p>This is not a sprint. It is a deliberate, structured shift in how you approach your work.</p>

<h2 id="months-16-expand-your-system-view">Months 1–6: Expand Your System View</h2>

<p>Most developers start with a narrow view — a service, a component, a feature. The first step is deliberately widening that view.</p>

<p><strong>Focus areas:</strong></p>

<ul>
  <li>Map the full data flow for your product end-to-end, including third-party integrations</li>
  <li>Learn to read and write sequence diagrams, C4 diagrams, and ERDs</li>
  <li>Study one adjacent system your product depends on, deeply</li>
  <li>Start attending architecture reviews — not to present, just to listen</li>
</ul>

<p><strong>Practical action:</strong></p>

<div class="language-bash highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="c"># Start an architecture journal — one entry per week</span>
<span class="c"># What decision was made? What was the alternative? What was the tradeoff?</span>
<span class="nb">mkdir</span> ~/arch-journal
<span class="nb">touch</span> ~/arch-journal/<span class="si">$(</span><span class="nb">date</span> +%Y-%m-%d<span class="si">)</span><span class="nt">-week-notes</span>.md
</code></pre></div></div>

<p><strong>Skill target:</strong> You can diagram your full product’s architecture from memory, including its external dependencies.</p>

<h2 id="months-712-make-intentional-tradeoffs">Months 7–12: Make Intentional Tradeoffs</h2>

<p>Junior developers optimize for solutions that work. Architects optimize for solutions that work <em>under specific constraints</em> — and they can articulate those constraints clearly.</p>

<p><strong>Focus areas:</strong></p>

<ul>
  <li>For every significant technical decision you make, write a one-pager explaining the alternatives you rejected</li>
  <li>Read at least three ADRs from well-known open-source projects</li>
  <li>Learn the CAP theorem and its implications for the systems you work on</li>
  <li>Study resiliency patterns: circuit breakers, retries with exponential backoff, bulkheads</li>
</ul>

<p><strong>Code to understand deeply:</strong></p>

<div class="language-js highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="c1">// Retry with exponential backoff — understand what this is doing, not just how to use it</span>
<span class="k">async</span> <span class="kd">function</span> <span class="nx">fetchWithRetry</span><span class="p">(</span><span class="nx">url</span><span class="p">,</span> <span class="nx">maxAttempts</span> <span class="o">=</span> <span class="mi">4</span><span class="p">)</span> <span class="p">{</span>
  <span class="k">for</span> <span class="p">(</span><span class="kd">let</span> <span class="nx">attempt</span> <span class="o">=</span> <span class="mi">1</span><span class="p">;</span> <span class="nx">attempt</span> <span class="o">&lt;=</span> <span class="nx">maxAttempts</span><span class="p">;</span> <span class="nx">attempt</span><span class="o">++</span><span class="p">)</span> <span class="p">{</span>
    <span class="k">try</span> <span class="p">{</span>
      <span class="kd">const</span> <span class="nx">response</span> <span class="o">=</span> <span class="k">await</span> <span class="nx">fetch</span><span class="p">(</span><span class="nx">url</span><span class="p">);</span>
      <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">response</span><span class="p">.</span><span class="nx">ok</span><span class="p">)</span> <span class="k">throw</span> <span class="k">new</span> <span class="nb">Error</span><span class="p">(</span><span class="s2">`HTTP </span><span class="p">${</span><span class="nx">response</span><span class="p">.</span><span class="nx">status</span><span class="p">}</span><span class="s2">`</span><span class="p">);</span>
      <span class="k">return</span> <span class="nx">response</span><span class="p">;</span>
    <span class="p">}</span> <span class="k">catch</span> <span class="p">(</span><span class="nx">err</span><span class="p">)</span> <span class="p">{</span>
      <span class="k">if</span> <span class="p">(</span><span class="nx">attempt</span> <span class="o">===</span> <span class="nx">maxAttempts</span><span class="p">)</span> <span class="k">throw</span> <span class="nx">err</span><span class="p">;</span>
      <span class="kd">const</span> <span class="nx">delay</span> <span class="o">=</span> <span class="nb">Math</span><span class="p">.</span><span class="nx">min</span><span class="p">(</span><span class="mi">100</span> <span class="o">*</span> <span class="mi">2</span> <span class="o">**</span> <span class="nx">attempt</span><span class="p">,</span> <span class="mi">5000</span><span class="p">);</span>
      <span class="k">await</span> <span class="k">new</span> <span class="nb">Promise</span><span class="p">((</span><span class="nx">r</span><span class="p">)</span> <span class="o">=&gt;</span> <span class="nx">setTimeout</span><span class="p">(</span><span class="nx">r</span><span class="p">,</span> <span class="nx">delay</span> <span class="o">+</span> <span class="nb">Math</span><span class="p">.</span><span class="nx">random</span><span class="p">()</span> <span class="o">*</span> <span class="mi">100</span><span class="p">));</span>
    <span class="p">}</span>
  <span class="p">}</span>
<span class="p">}</span>
</code></pre></div></div>

<p><strong>Skill target:</strong> You can articulate why you <em>did not</em> choose the other two reasonable approaches to any significant decision you made.</p>

<h2 id="months-1318-build-cross-team-influence">Months 13–18: Build Cross-Team Influence</h2>

<p>Architecture is fundamentally a coordination problem. Technical decisions that affect more than one team require trust, communication, and political awareness — not just correctness.</p>

<p><strong>Focus areas:</strong></p>

<ul>
  <li>Propose and lead one cross-team technical initiative (migration, shared library, API contract)</li>
  <li>Practice writing RFC-style documents — the goal is to invite disagreement productively</li>
  <li>Present one technical proposal to a non-technical audience and adjust the framing</li>
  <li>Build a personal network that spans at least three different product teams</li>
</ul>

<p><strong>An RFC template to start with:</strong></p>

<div class="language-markdown highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="gh"># RFC: [Short Title]</span>

<span class="gs">**Status:**</span> Draft | <span class="gs">**Author:**</span> [You] | <span class="gs">**Date:**</span> [Date]
<span class="gs">**Stakeholders:**</span> [Teams/Roles Affected]

<span class="gu">## Problem</span>

What problem are we solving? Why now?

<span class="gu">## Proposed Solution</span>

What are you recommending?

<span class="gu">## Alternatives Considered</span>

What did you evaluate and reject, and why?

<span class="gu">## Impact</span>

What changes for which teams? What are the migration or adoption costs?

<span class="gu">## Open Questions</span>

What do you not know yet? What do you need input on?
</code></pre></div></div>

<p><strong>Skill target:</strong> You have successfully driven a technical decision that required buy-in from at least two teams outside your own.</p>

<h2 id="months-1924-think-in-long-horizons">Months 19–24: Think in Long Horizons</h2>

<p>By this point you have breadth, tradeoff judgment, and influence skills. The final step is learning to hold multiple time horizons simultaneously: what ships this sprint, what the platform looks like in 12 months, and what the organization’s technology direction is in three years.</p>

<p><strong>Focus areas:</strong></p>

<ul>
  <li>Study the Three Horizons model and apply it to your current platform</li>
  <li>Write a 12-month technology roadmap for your product area — even if it is just for your own clarity</li>
  <li>Begin shadowing or contributing to enterprise architecture forums in your organization</li>
  <li>Identify one systemic risk in your organization’s technology portfolio and socialize a mitigation</li>
</ul>

<p><strong>Skill target:</strong> You can describe the same technology situation at three different time scales (today, 12 months, 3 years) for three different audiences.</p>

<h2 id="the-non-technical-skills-that-matter-equally">The Non-Technical Skills That Matter Equally</h2>

<p>Technical depth gets you noticed. These skills get you trusted:</p>

<table>
  <thead>
    <tr>
      <th>Skill</th>
      <th>Why It Matters</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Written communication</td>
      <td>Architecture is persuasion. Clarity of writing signals clarity of thinking.</td>
    </tr>
    <tr>
      <td>Active listening</td>
      <td>Stakeholders tell you the real constraints when they feel heard.</td>
    </tr>
    <tr>
      <td>Knowing what you do not know</td>
      <td>Overconfidence in architecture causes expensive production failures.</td>
    </tr>
    <tr>
      <td>Conflict navigation</td>
      <td>Cross-team alignment always involves some version of disagreement.</td>
    </tr>
  </tbody>
</table>

<h2 id="one-last-thing">One Last Thing</h2>

<p>The path from developer to architect is not a ladder — it is more of a terrain. You will move sideways, hit walls, and occasionally backtrack. The developers who make the transition successfully are not the ones who knew the most; they are the ones who stayed curious and built genuine trust across their organizations.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#career"
          aria-label="View all posts in category Career"
          >Career</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#enterprise-architecture"
          aria-label="View all posts in category Enterprise Architecture"
          >Enterprise Architecture</a
        >
         
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2020/09/06/new-job-promotion.html">
        
        <img src="/assets/images/posts/david-auble-manager.jpg" alt="David Auble, Manager" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 06, 2020 · </span
          >
          <h3>David Auble, Manager</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Enterprise Architecture for Developers: What It Is and What It Is Not
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Enterprise Architecture for Developers: What It Is and What It Is Not | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Enterprise Architecture for Developers: What It Is and What It Is Not" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Enterprise architecture gets a bad reputation in developer circles. It conjures images of slides no one reads, acronyms no one agrees on, and decisions handed down from people who stopped writing code a decade ago." />
<meta property="og:description" content="Enterprise architecture gets a bad reputation in developer circles. It conjures images of slides no one reads, acronyms no one agrees on, and decisions handed down from people who stopped writing code a decade ago." />
<link rel="canonical" href="https://davidauble.com/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html" />
<meta property="og:url" content="https://davidauble.com/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/ea-what-it-is.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2026-06-09T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/ea-what-it-is.jpg" />
<meta property="twitter:title" content="Enterprise Architecture for Developers: What It Is and What It Is Not" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2026-06-09T00:00:00+00:00","datePublished":"2026-06-09T00:00:00+00:00","description":"Enterprise architecture gets a bad reputation in developer circles. It conjures images of slides no one reads, acronyms no one agrees on, and decisions handed down from people who stopped writing code a decade ago.","headline":"Enterprise Architecture for Developers: What It Is and What It Is Not","image":"https://davidauble.com/assets/images/posts/ea-what-it-is.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html"},"url":"https://davidauble.com/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>Enterprise Architecture</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jun 09, 2026</span
          >
        </div>
        <h1>Enterprise Architecture for Developers: What It Is and What It Is Not</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 3 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>Enterprise architecture gets a bad reputation in developer circles. It conjures images of slides no one reads, acronyms no one agrees on, and decisions handed down from people who stopped writing code a decade ago.</p>

<p>That reputation is not entirely wrong. But it is not the whole picture either.</p>

<p>This is the first post in a series aimed at developers who are starting to wonder what architecture actually means — and whether it is a direction worth moving in.</p>

<h2 id="what-enterprise-architecture-is-not">What Enterprise Architecture Is Not</h2>

<p>Let’s start with clearing the air:</p>

<ul>
  <li>It is not a job title that unlocks automatic seniority.</li>
  <li>It is not about drawing boxes on slides and calling it governance.</li>
  <li>It is not divorced from code — the best architects write and review code regularly.</li>
  <li>It is not about slowing down delivery. Done right, it enables delivery at scale.</li>
</ul>

<h2 id="what-it-actually-is">What It Actually Is</h2>

<p>Enterprise Architecture (EA) is the practice of aligning technology decisions with business outcomes across an organization — not just for one team, one product, or one quarter.</p>

<p>At its core, EA answers three ongoing questions:</p>

<p><strong>1. What do we have?</strong>
A clear, maintained picture of systems, data flows, integrations, and dependencies. This is harder than it sounds. Most organizations have partial answers at best.</p>

<p><strong>2. What do we need?</strong>
Business capabilities that are missing, under-supported, or over-engineered. Translating business goals into technology gaps is the core skill.</p>

<p><strong>3. How do we get from here to there?</strong>
A roadmap with sequencing, tradeoffs, and decisions that teams can act on.</p>

<h2 id="what-the-work-actually-looks-like">What the Work Actually Looks Like</h2>

<p>Contrary to the stereotype, a working enterprise architect spends significant time:</p>

<ul>
  <li>In code reviews, looking for patterns that will compound into systemic problems</li>
  <li>In discovery sessions with product owners and business stakeholders</li>
  <li>Writing Architecture Decision Records (ADRs) that give future teams documented rationale</li>
  <li>Building reference architectures that squads can adopt without reinventing the wheel</li>
  <li>Unblocking cross-team integration problems that no single squad owns end-to-end</li>
</ul>

<h2 id="the-progression-from-developer-to-architect">The Progression From Developer to Architect</h2>

<p>Most developers who move toward architecture start as <strong>solution architects</strong> — scoped to one product or domain. The move to enterprise architecture is less about technical depth and more about breadth, communication, and long-horizon thinking.</p>

<div class="language-text highlighter-rouge"><div class="highlight"><pre class="highlight"><code>Developer → Senior Developer → Tech Lead → Solution Architect → Enterprise Architect
 (code)         (code+)          (team)        (product)          (organization)
</code></pre></div></div>

<p>Each step requires a broader antenna — more systems to understand, more stakeholders to align, more time horizons to hold simultaneously.</p>

<h2 id="why-this-series-exists">Why This Series Exists</h2>

<p>There is a lot of content for developers who want to improve at coding. There is much less for developers who want to improve at shaping systems at scale. This series tries to close that gap.</p>

<p>Upcoming topics:</p>

<ul>
  <li>How to think in systems rather than tickets</li>
  <li>How long-range planning models like Three Horizons work in practice</li>
  <li>Architecture Decision Records that teams actually reference</li>
  <li>Career traps that slow down high-potential developers</li>
</ul>

<p>If you are a developer curious about the bigger picture — this series is for you.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#enterprise-architecture"
          aria-label="View all posts in category Enterprise Architecture"
          >Enterprise Architecture</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#career"
          aria-label="View all posts in category Career"
          >Career</a
        >
         
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2020/09/06/new-job-promotion.html">
        
        <img src="/assets/images/posts/david-auble-manager.jpg" alt="David Auble, Manager" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 06, 2020 · </span
          >
          <h3>David Auble, Manager</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
Industry News<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="If you work at any organization with a meaningful digital presence, you have almost certainly run into Adobe’s enterprise platform in some form. Adobe Experience Manager (AEM), Adobe Experience Platform (AEP), and the broader Adobe DXP (Digital Experience Platform) stack represent one of the most widely adopted enterprise content and data platforms on the market." />
<meta property="og:description" content="If you work at any organization with a meaningful digital presence, you have almost certainly run into Adobe’s enterprise platform in some form. Adobe Experience Manager (AEM), Adobe Experience Platform (AEP), and the broader Adobe DXP (Digital Experience Platform) stack represent one of the most widely adopted enterprise content and data platforms on the market." />
<link rel="canonical" href="https://davidauble.com/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html" />
<meta property="og:url" content="https://davidauble.com/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/adobe-dxp-stack.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2026-07-07T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/adobe-dxp-stack.jpg" />
<meta property="twitter:title" content="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2026-07-07T00:00:00+00:00","datePublished":"2026-07-07T00:00:00+00:00","description":"If you work at any organization with a meaningful digital presence, you have almost certainly run into Adobe’s enterprise platform in some form. Adobe Experience Manager (AEM), Adobe Experience Platform (AEP), and the broader Adobe DXP (Digital Experience Platform) stack represent one of the most widely adopted enterprise content and data platforms on the market.","headline":"Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know","image":"https://davidauble.com/assets/images/posts/adobe-dxp-stack.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html"},"url":"https://davidauble.com/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>Industry News</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jul 07, 2026</span
          >
        </div>
        <h1>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 6 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>If you work at any organization with a meaningful digital presence, you have almost certainly run into Adobe’s enterprise platform in some form. Adobe Experience Manager (AEM), Adobe Experience Platform (AEP), and the broader Adobe DXP (Digital Experience Platform) stack represent one of the most widely adopted enterprise content and data platforms on the market.</p>

<p>For enterprise architects, understanding this ecosystem is not optional — it is increasingly a prerequisite.</p>

<h2 id="what-adobes-dxp-stack-actually-includes">What Adobe’s DXP Stack Actually Includes</h2>

<p>Adobe positions its enterprise offerings around three interconnected pillars:</p>

<p><strong>Adobe Experience Manager (AEM)</strong>
A Java-based CMS and Digital Asset Management (DAM) platform. Available as AEM Cloud Service (hosted by Adobe) or as a managed-cloud deployment on Azure or AWS. AEM handles authoring, publishing, asset management, and translation workflows for large-scale digital properties.</p>

<p><strong>Adobe Experience Platform (AEP)</strong>
The data layer of the DXP. AEP centralizes customer behavioral data, unifies identity across channels, and powers real-time segmentation. It sits beneath most Adobe marketing applications including Journey Optimizer, Real-Time CDP, and Customer Journey Analytics.</p>

<p><strong>Adobe Analytics and Target</strong>
Behavioral data collection and personalization/experimentation, respectively. For enterprise web architectures, these frequently appear as requirements from marketing teams rather than technology teams — which creates interesting governance challenges.</p>

<h2 id="the-architecture-decisions-aem-forces-you-to-make">The Architecture Decisions AEM Forces You to Make</h2>

<p>AEM is not a system you plug in. It is a platform you build around. Every significant AEM engagement requires architectural decisions that ripple into your front-end, infrastructure, and deployment strategy.</p>

<p><strong>Headless vs. Hybrid vs. Traditional</strong></p>

<p>AEM supports three delivery models:</p>

<div class="language-text highlighter-rouge"><div class="highlight"><pre class="highlight"><code>Traditional (full-stack): AEM renders HTML server-side. Authors control the full page.
Hybrid:                   AEM manages content and some rendering; a JavaScript
                          framework handles the rest.
Headless:                 AEM is purely a content API. Any frontend framework
                          consumes it via GraphQL or REST.
</code></pre></div></div>

<p>Newer projects on AEM Cloud Service increasingly use the headless model, with AEM serving as a content repository behind a Next.js or React-based frontend. This pattern is called the <strong>WKND pattern</strong> in Adobe’s documentation and gives teams modern development workflows while preserving AEM’s authoring experience.</p>

<p><strong>Example: Querying AEM content via GraphQL</strong></p>

<div class="language-graphql highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="k">query</span><span class="w"> </span><span class="n">GetArticleList</span><span class="w"> </span><span class="p">{</span><span class="w">
  </span><span class="n">articleList</span><span class="w"> </span><span class="p">{</span><span class="w">
    </span><span class="n">items</span><span class="w"> </span><span class="p">{</span><span class="w">
      </span><span class="n">_path</span><span class="w">
      </span><span class="n">title</span><span class="w">
      </span><span class="n">summary</span><span class="w">
      </span><span class="n">publishDate</span><span class="w">
      </span><span class="n">author</span><span class="w"> </span><span class="p">{</span><span class="w">
        </span><span class="n">fullName</span><span class="w">
        </span><span class="n">profileImage</span><span class="w"> </span><span class="p">{</span><span class="w">
          </span><span class="p">...</span><span class="w"> </span><span class="k">on</span><span class="w"> </span><span class="n">ImageRef</span><span class="w"> </span><span class="p">{</span><span class="w">
            </span><span class="n">_path</span><span class="w">
          </span><span class="p">}</span><span class="w">
        </span><span class="p">}</span><span class="w">
      </span><span class="p">}</span><span class="w">
    </span><span class="p">}</span><span class="w">
  </span><span class="p">}</span><span class="w">
</span><span class="p">}</span><span class="w">
</span></code></pre></div></div>

<p><strong>Sling Model and Component Architecture</strong></p>

<p>If you are on a hybrid or traditional AEM deployment, understanding the Sling framework is non-negotiable. Sling maps HTTP requests to JCR (Java Content Repository) nodes, and custom components are backed by Sling Models — Java classes that inject content and expose it to HTL (HTML Template Language) templates.</p>

<div class="language-java highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nd">@Model</span><span class="o">(</span><span class="n">adaptables</span> <span class="o">=</span> <span class="nc">Resource</span><span class="o">.</span><span class="na">class</span><span class="o">)</span>
<span class="kd">public</span> <span class="kd">class</span> <span class="nc">HeroComponent</span> <span class="o">{</span>

    <span class="nd">@ValueMapValue</span>
    <span class="kd">private</span> <span class="nc">String</span> <span class="n">headline</span><span class="o">;</span>

    <span class="nd">@ValueMapValue</span>
    <span class="kd">private</span> <span class="nc">String</span> <span class="n">subtext</span><span class="o">;</span>

    <span class="nd">@ChildResource</span>
    <span class="kd">private</span> <span class="nc">Resource</span> <span class="n">image</span><span class="o">;</span>

    <span class="kd">public</span> <span class="nc">String</span> <span class="nf">getHeadline</span><span class="o">()</span> <span class="o">{</span> <span class="k">return</span> <span class="n">headline</span><span class="o">;</span> <span class="o">}</span>
    <span class="kd">public</span> <span class="nc">String</span> <span class="nf">getSubtext</span><span class="o">()</span>  <span class="o">{</span> <span class="k">return</span> <span class="n">subtext</span><span class="o">;</span> <span class="o">}</span>
    <span class="kd">public</span> <span class="nc">Resource</span> <span class="nf">getImage</span><span class="o">()</span>  <span class="o">{</span> <span class="k">return</span> <span class="n">image</span><span class="o">;</span> <span class="o">}</span>
<span class="o">}</span>
</code></pre></div></div>

<h2 id="what-aep-means-for-data-architecture">What AEP Means for Data Architecture</h2>

<p>Adobe Experience Platform is a schema-first, event-driven data platform built on top of Apache Kafka, Apache Spark, and a proprietary query service. For enterprise architects the key concepts are:</p>

<ul>
  <li><strong>XDM (Experience Data Model):</strong> Adobe’s standardized schema language. Every dataset in AEP must conform to XDM. This is a governance lever — and also a source of significant implementation effort when organizations have inconsistent data models.</li>
  <li><strong>Identity Graph:</strong> AEP maintains a probabilistic and deterministic identity resolution graph. Understanding this matters when designing data flows across authenticated and unauthenticated surfaces.</li>
  <li><strong>Real-Time CDP:</strong> The activation layer. Data from AEP segments flows into Real-Time CDP for audience activation across paid media, email, and on-site personalization.</li>
</ul>

<h2 id="common-architectural-traps">Common Architectural Traps</h2>

<p><strong>1. Coupling your frontend too tightly to AEM’s content model</strong>
When teams put too much structure into AEM’s content model, they create authoring rigidity that marketing teams quickly resent. Design content models for reuse and flexibility, not per-page specificity.</p>

<p><strong>2. Treating AEP as a data warehouse</strong>
AEP is optimized for identity resolution, segmentation, and activation — not batch analytics. Teams that try to run heavy reporting queries against AEP repeatedly hit performance and cost issues. Use Adobe Customer Journey Analytics or an external data warehouse for reporting workloads.</p>

<p><strong>3. Underestimating AEM Cloud Service’s CI/CD requirements</strong>
AEM Cloud Service does not accept arbitrary code deployments. All code ships through Cloud Manager — Adobe’s CI/CD pipeline. This is a good thing from a reliability standpoint, but it requires teams to adapt their deployment workflow and test coverage significantly.</p>

<div class="language-yaml highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="c1"># Simplified Cloud Manager pipeline stage overview</span>
<span class="na">stages</span><span class="pi">:</span>
  <span class="pi">-</span> <span class="na">name</span><span class="pi">:</span> <span class="s">build</span>
    <span class="na">type</span><span class="pi">:</span> <span class="s">Maven</span>
    <span class="na">goals</span><span class="pi">:</span> <span class="s">clean install</span>
    <span class="na">profiles</span><span class="pi">:</span> <span class="s">cloud</span>
  <span class="pi">-</span> <span class="na">name</span><span class="pi">:</span> <span class="s">code-quality</span>
    <span class="na">type</span><span class="pi">:</span> <span class="s">CodeScanning</span>
    <span class="na">blockers</span><span class="pi">:</span> <span class="s">critical,major</span>
  <span class="pi">-</span> <span class="na">name</span><span class="pi">:</span> <span class="s">deploy-stage</span>
    <span class="na">type</span><span class="pi">:</span> <span class="s">AEMDeploy</span>
    <span class="na">environment</span><span class="pi">:</span> <span class="s">stage</span>
  <span class="pi">-</span> <span class="na">name</span><span class="pi">:</span> <span class="s">ui-tests</span>
    <span class="na">type</span><span class="pi">:</span> <span class="s">Selenium</span>
  <span class="pi">-</span> <span class="na">name</span><span class="pi">:</span> <span class="s">deploy-prod</span>
    <span class="na">type</span><span class="pi">:</span> <span class="s">AEMDeploy</span>
    <span class="na">environment</span><span class="pi">:</span> <span class="s">production</span>
    <span class="na">requiresApproval</span><span class="pi">:</span> <span class="no">true</span>
</code></pre></div></div>

<h2 id="where-adobe-is-heading">Where Adobe Is Heading</h2>

<p>Adobe’s strategic direction centers on AI integration throughout the DXP stack. Adobe Firefly generative AI is being embedded into AEM authoring workflows, allowing content teams to generate and modify visual assets without leaving the CMS. Sensei-powered personalization and Journey Optimizer’s AI decisioning features are maturing rapidly.</p>

<p>For enterprise architects, the near-term question is: <strong>how do you govern AI-generated content at scale?</strong> Adobe is building the tooling; organizations need to build the policy and data governance frameworks around it.</p>

<p>More on Adobe Firefly and enterprise AI architecture in an upcoming post.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#industry-news"
          aria-label="View all posts in category Industry News"
          >Industry News</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#enterprise-architecture"
          aria-label="View all posts in category Enterprise Architecture"
          >Enterprise Architecture</a
        >
         
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2020/09/06/new-job-promotion.html">
        
        <img src="/assets/images/posts/david-auble-manager.jpg" alt="David Auble, Manager" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 06, 2020 · </span
          >
          <h3>David Auble, Manager</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
apache<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Edit Robots.txt with WordPress and Yoast
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Edit Robots.txt with WordPress and Yoast | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Edit Robots.txt with WordPress and Yoast" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="An interesting project came my way this week at work and took some digging to resolve. Each website utilizes a file called a robots.txt file that helps point search engine bots what areas of your site to crawl and which to ignore. This helps the bots crawl your site and help it appear on search engines and can impact your search rankings." />
<meta property="og:description" content="An interesting project came my way this week at work and took some digging to resolve. Each website utilizes a file called a robots.txt file that helps point search engine bots what areas of your site to crawl and which to ignore. This helps the bots crawl your site and help it appear on search engines and can impact your search rankings." />
<link rel="canonical" href="https://davidauble.com/blog/2020/04/14/edit-robots-txt-wordpress-yoast.html" />
<meta property="og:url" content="https://davidauble.com/blog/2020/04/14/edit-robots-txt-wordpress-yoast.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/robots.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2020-04-14T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/robots.jpg" />
<meta property="twitter:title" content="Edit Robots.txt with WordPress and Yoast" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2020-04-14T00:00:00+00:00","datePublished":"2020-04-14T00:00:00+00:00","description":"An interesting project came my way this week at work and took some digging to resolve. Each website utilizes a file called a robots.txt file that helps point search engine bots what areas of your site to crawl and which to ignore. This helps the bots crawl your site and help it appear on search engines and can impact your search rankings.","headline":"Edit Robots.txt with WordPress and Yoast","image":"https://davidauble.com/assets/images/posts/robots.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2020/04/14/edit-robots-txt-wordpress-yoast.html"},"url":"https://davidauble.com/blog/2020/04/14/edit-robots-txt-wordpress-yoast.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Apr 14, 2020</span
          >
        </div>
        <h1>Edit Robots.txt with WordPress and Yoast</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 2 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/robots.jpg" alt="Edit Robots.txt with WordPress and Yoast" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>An interesting project came my way this week at work and took some digging to resolve. Each website utilizes a file called a <code class="language-plaintext highlighter-rouge">robots.txt</code> file that helps point search engine bots what areas of your site to crawl and which to ignore. This helps the bots crawl your site and help it appear on search engines and can impact your search rankings.</p>

<p>We’ve been using Yoast SEO for our primary SEO plugin on all of our sites for quite some time and albeit it buggy and <a href="https://yoast.com/media-attachment-urls/" target="_blank">catastrophic at times</a>, however for the most part, it is the best SEO plugin available for WordPress.</p>

<p>Anyway, I was given the task to update the <code class="language-plaintext highlighter-rouge">robots.txt</code> file on each site to include a link to the sitemap.xml file, generated by Yoast. I immediately thought to check the site’s primary directory, but didn’t see a text file in that location. I then checked the built-in file editor in WordPress, but came up blank, as it only allowed me to edit template files. Hmm..</p>

<p>Oh, for some background, each of our websites is set up using the <a href="https://wordpress.org/support/article/glossary/#multisite" target="_blank">Multisite</a> feature in WordPress. Each site in the network has its own set of options with Yoast and has an area to update the <code class="language-plaintext highlighter-rouge">robots.txt</code>. However, that option has been removed and I wasn’t able to find which version of Yoast removed that option.</p>

<p>Finally, after digging much further, I was able to find that in the Network Admin area, another Yoast Options page exists. From here, you have the option to click <em>Edit Files</em>, which allows you to generate and modify the <code class="language-plaintext highlighter-rouge">robots.txt</code> file from within WordPress. Finally! Below are the steps I took to solve this problem.</p>

<ol>
  <li>Click on Network Admin -&gt; Dashboard<br />
<img src="/assets/images/posts/network-admin.jpg" alt="Clicking on Network Admin, followed by Dashboard link" /></li>
  <li>Hover over the Yoast SEO options and click Edit Files<br />
<img src="/assets/images/posts/seo-edit-files.jpg" alt="Click on Yoast SEO, Edit Files" /></li>
  <li>Edit robots.txt<br />
<img src="/assets/images/posts/edit-robots.jpg" alt="Edit robots.txt text input" /></li>
</ol>

<p><strong>Note</strong> If a robots.txt file does not exist, in the current verion of WordPress, 5.4, clicking the “Generate robots.txt” button will redirect you to a page that has HTML markup not being rendered. Simply click the browser’s back button and refresh the page. You will then see the edit text area as seen above.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#apache"
          aria-label="View all posts in category apache"
          >apache</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#iis"
          aria-label="View all posts in category iis"
          >iis</a
        >
         
        <a
          class="chip"
          href="/tags/#seo"
          aria-label="View all posts tagged seo"
          >seo</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
arduino<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Parking Assistant: An Arduino-based Program to Help You Park
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Parking Assistant: An Arduino-based Program to Help You Park | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Parking Assistant: An Arduino-based Program to Help You Park" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="For Christmas this past year I finally got something I’ve been wanting for a little while: an Arduino controller and small electronics kit. I’ve had several ideas of little projects, but have never had the time or parts to start working on them. Over the last several weeks though, I’ve been playing with them and have come up with a few projects." />
<meta property="og:description" content="For Christmas this past year I finally got something I’ve been wanting for a little while: an Arduino controller and small electronics kit. I’ve had several ideas of little projects, but have never had the time or parts to start working on them. Over the last several weeks though, I’ve been playing with them and have come up with a few projects." />
<link rel="canonical" href="https://davidauble.com/blog/2018/02/23/parking-assistant-arduino-based-program-help-park.html" />
<meta property="og:url" content="https://davidauble.com/blog/2018/02/23/parking-assistant-arduino-based-program-help-park.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/parking-assistant.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2018-02-23T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/parking-assistant.jpg" />
<meta property="twitter:title" content="Parking Assistant: An Arduino-based Program to Help You Park" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2018-02-23T00:00:00+00:00","datePublished":"2018-02-23T00:00:00+00:00","description":"For Christmas this past year I finally got something I’ve been wanting for a little while: an Arduino controller and small electronics kit. I’ve had several ideas of little projects, but have never had the time or parts to start working on them. Over the last several weeks though, I’ve been playing with them and have come up with a few projects.","headline":"Parking Assistant: An Arduino-based Program to Help You Park","image":"https://davidauble.com/assets/images/posts/parking-assistant.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2018/02/23/parking-assistant-arduino-based-program-help-park.html"},"url":"https://davidauble.com/blog/2018/02/23/parking-assistant-arduino-based-program-help-park.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>arduino</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Feb 23, 2018</span
          >
        </div>
        <h1>Parking Assistant: An Arduino-based Program to Help You Park</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 2 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/parking-assistant.jpg" alt="Parking Assistant: An Arduino-based Program to Help You Park" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>For Christmas this past year I finally got something I’ve been wanting for a little while: an Arduino controller and small electronics kit. I’ve had several ideas of little projects, but have never had the time or parts to start working on them. Over the last several weeks though, I’ve been playing with them and have come up with a few projects.</p>

<p>My first project was a simple thermometer and humidity gauge. It worked well and was accurate (within reason) and it ignited a spark for other projects. I got to thinking about what else I could build, then it hit me: how about a parking assistant?</p>

<p>We’re looking at getting another car and instead of using a 2”x4” block of wood, why not use my technical skills and make something cool. Something to annoy my wife. Enter Parking Assistant.</p>

<p><a href="http://www.youtube.com/watch?v=WnKiokYo1i4" title="Video Title" target="_blank"><img src="http://img.youtube.com/vi/WnKiokYo1i4/0.jpg" alt="IMAGE ALT TEXT" /></a></p>

<p>This is just a simple project that uses an ultrasonic sensor to determine the range from an object and then display the appropriate color on the matrix. If you get too close though, it displays a flashing red “X” on the matrix.</p>

<p>The next steps will be to work on power consumption so I can use it in the garage and run it off either standard electricity or just keep it battery powered for now. We’ll see.</p>

<p>If you want to play around with it, be sure to check it the <a href="https://github.com/dauble/Parking-Assistant" target="_blank">Parking Assistant GitHub project</a>. Feel free to use it and change it how you want.</p>

<p><strong>Update (3/18/2018): </strong>
I started noticing that the ultrasonic sensors were receiving input a little too frequently, so updated the code to get the average of five distances, then display that as the distance. This allows it to be more accurate, as it was sending additional triggers before it was receiving the echos, causing invalid ranges.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#arduino"
          aria-label="View all posts in category arduino"
          >arduino</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#projects"
          aria-label="View all posts in category projects"
          >projects</a
        >
         
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
blog<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      2020 Blog Update
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>2020 Blog Update | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="2020 Blog Update" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="It’s been nearly a year since I’ve had any updates to this site other than a couple of logos here and there. I’ve been overloaded between my full-time job, being a full-time MBA student, and helping raise my first child with my wife. The good news is life has been going well, I’ve just been extremely busy. We haven’t been able to travel due to my classes and projects, but have managed to get away for a couple weekends here and there to visit family and friends." />
<meta property="og:description" content="It’s been nearly a year since I’ve had any updates to this site other than a couple of logos here and there. I’ve been overloaded between my full-time job, being a full-time MBA student, and helping raise my first child with my wife. The good news is life has been going well, I’ve just been extremely busy. We haven’t been able to travel due to my classes and projects, but have managed to get away for a couple weekends here and there to visit family and friends." />
<link rel="canonical" href="https://davidauble.com/blog/2020/04/10/2020-blog-update.html" />
<meta property="og:url" content="https://davidauble.com/blog/2020/04/10/2020-blog-update.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/2020-blog-update.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2020-04-10T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/2020-blog-update.jpg" />
<meta property="twitter:title" content="2020 Blog Update" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2020-04-10T00:00:00+00:00","datePublished":"2020-04-10T00:00:00+00:00","description":"It’s been nearly a year since I’ve had any updates to this site other than a couple of logos here and there. I’ve been overloaded between my full-time job, being a full-time MBA student, and helping raise my first child with my wife. The good news is life has been going well, I’ve just been extremely busy. We haven’t been able to travel due to my classes and projects, but have managed to get away for a couple weekends here and there to visit family and friends.","headline":"2020 Blog Update","image":"https://davidauble.com/assets/images/posts/2020-blog-update.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2020/04/10/2020-blog-update.html"},"url":"https://davidauble.com/blog/2020/04/10/2020-blog-update.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>blog</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Apr 10, 2020</span
          >
        </div>
        <h1>2020 Blog Update</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 3 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/2020-blog-update.jpg" alt="2020 Blog Update" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>It’s been nearly a year since I’ve had any updates to this site other than a couple of logos here and there. I’ve been overloaded between my full-time job, being a full-time MBA student, and helping raise my first child with my wife. The good news is life has been going well, I’ve just been extremely busy. We haven’t been able to travel due to my classes and projects, but have managed to get away for a couple weekends here and there to visit family and friends.</p>

<p>I have, however, been paying particularly close attention to the performance side of websites with my current job. I’ve been researching what goes into web page performance and have found a combination of several things. For many years now I’ve wanted to get away from using a CMS and WordPress for my personal site, as it offers too much and I simply don’t use most of its features.</p>

<p>Instead, I’ve switched to a static site generator, <a href="https://jekyllrb.com/" target="_blank">Jekyll</a>. Jekyll is a static site generator and uses a combination of Markdown, Liquid, HTML, CSS to build out websites. It is designed for bloggers who want a simple site. It can be run on any web host, with many users hosting their sites on GitHub Pages. I chose not to do that, as I have other projects and need a web host.</p>

<p>So far, I love Jekyll. It’s quick to learn, and requires minimal effort to create a new post. Best of all, it allows you to build a site and run it locally without having to have a virtual server running - it creates one for you!</p>

<p>One thing worth mentioning - this year, it is my goal to completely move away from Bootstrap and roll my own scaffolding. I’ve been working with <a href="https://css-tricks.com/snippets/css/complete-guide-grid/" target="_blank">CSS Grid</a> and <a href="https://css-tricks.com/snippets/css/a-guide-to-flexbox/" target="_blank">Flexbox</a> more and more lately, pushing myself to keep up with the times. I definitely am liking the benefits, and have a ways to go before I’m as comfortable with them as other languages. I’ll get there. Stay tuned, as I’m sure I’ll write about caveats I find along the way.</p>

<p>Anyway, that’s pretty much it for now. While spending quite a bit of time inside due to <a href="https://en.wikipedia.org/wiki/Coronavirus_disease_2019" target="_blank">COVID-19</a>, I’ve been able to slow down and get to some projects that have been on the backburner for a while. It feels great to accomplish projects, regardless of size. Stay safe out there, everyone! Wear a mask, and keep up with the social distancing! It does work, and together, let’s <a href="https://twitter.com/hashtag/FlattenTheCurve" target="_blank">#flattenthecurve</a>.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#blog"
          aria-label="View all posts in category blog"
          >blog</a
        >
         
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
carousel<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Three Reasons You Should Ditch Image Sliders
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Three Reasons You Should Ditch Image Sliders | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Three Reasons You Should Ditch Image Sliders" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Carousels, sliders and rotating banners – chances are you’ve heard one or more of these terms before. Image carousels can be found on nearly any news site, online store or informational site with one goal in mind: force-feed the user as much content as possible, as soon as they land on your site." />
<meta property="og:description" content="Carousels, sliders and rotating banners – chances are you’ve heard one or more of these terms before. Image carousels can be found on nearly any news site, online store or informational site with one goal in mind: force-feed the user as much content as possible, as soon as they land on your site." />
<link rel="canonical" href="https://davidauble.com/blog/2015/01/16/three-reasons-you-should-ditch-image-sliders.html" />
<meta property="og:url" content="https://davidauble.com/blog/2015/01/16/three-reasons-you-should-ditch-image-sliders.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/carousel.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2015-01-16T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/carousel.jpg" />
<meta property="twitter:title" content="Three Reasons You Should Ditch Image Sliders" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2015-01-16T00:00:00+00:00","datePublished":"2015-01-16T00:00:00+00:00","description":"Carousels, sliders and rotating banners – chances are you’ve heard one or more of these terms before. Image carousels can be found on nearly any news site, online store or informational site with one goal in mind: force-feed the user as much content as possible, as soon as they land on your site.","headline":"Three Reasons You Should Ditch Image Sliders","image":"https://davidauble.com/assets/images/posts/carousel.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2015/01/16/three-reasons-you-should-ditch-image-sliders.html"},"url":"https://davidauble.com/blog/2015/01/16/three-reasons-you-should-ditch-image-sliders.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>carousel</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jan 16, 2015</span
          >
        </div>
        <h1>Three Reasons You Should Ditch Image Sliders</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 3 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/carousel.jpg" alt="Three Reasons You Should Ditch Image Sliders" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p><a href="http://ux.stackexchange.com/questions/13951/what-is-the-difference-between-a-slider-a-gallery-and-a-carousel" target="_blank">Carousels, sliders and rotating banners</a> – chances are you’ve heard one or more of these terms before. Image carousels can be found on nearly any news site, online store or informational site with one goal in mind: force-feed the user as much content as possible, as soon as they land on your site.</p>

<p>The concept of image sliders dates back several years to when JavaScript started booming. Image sliders were a great way to show users multiple promotions or features while freeing up page space. Once they started gaining momentum, online retailers began using them to showcase their weekly promotions, similar to a weekly insert in the Sunday paper.</p>

<p>Now, image sliders are overused and oftentimes ignored by the consumer. Here are a few reasons why customers aren’t paying attention:</p>

<ul>
  <li><strong>Automatic rotation</strong> Most image sliders have multiple slides that automatically rotate when users land on the site. For example, <a href="http://www.ikea.com/us/en/">IKEA</a> currently has four promotions in their image slider, which includes an auto-rotate feature. A recent study conducted on the <a href="http://www.nngroup.com/articles/auto-forwarding/">usability</a> of image sliders by Neilson Norman group confirmed that auto-forwarding sliders annoy users and reduce visibility of your messages.</li>
  <li><strong>Increased site load time</strong> Typically, users will need to load jQuery (and a slider script) in order to display a carousel, which will increase your page loading time. Additionally, sites may have large, high-resolution banners, which also add to the page-load time. Carousels add <a href="http://chrislema.com/comparing-premium-sliders-for-wordpress-by-performance/">between .4  and five seconds</a> to your page-load time. Keep in mind, <a href="http://www.lauradhamilton.com/5-quick-and-easy-seo-tips">Google incorporates page speeds into search engine rankings</a>, so if your site is slow, you’re going to be punished.</li>
  <li><strong>Negative impacts on your SEO and conversion rates</strong> Basic SEO practices state that there should be only one h1 tag per page and it should appear before any other heading tag. The problem with using h1 or any heading tag in an image carousel is that every time the slide changes, the h1 tag changes. A page with five slides in the carousel will have five h1 tags, which greatly devalues keyword relevance.</li>
</ul>

<p>​A 2013 study at the University of Notre Dame was conducted on the <a href="http://weedygarden.net/2013/01/carousel-stats/" target="_blank">efficiency of image carousels</a> and revealed that only one percent of three million site visitors clicked on a carousel’s featured image.</p>

<p>Too many messages oftentimes equal no message to consumers. Sometimes, slides on image sliders are so fast that people are not able to finish reading them. Check out these sites below that allow the user to be in control of the content they are viewing:</p>

<ul>
  <li><a href="https://www.mint.com/" target="_blank">Mint</a> does a good job of breaking things down and hiding nothing.</li>
  <li><a href="http://www.bensherman.com/" target="_blank">Ben Sherman</a> has one promotion up front; that’s it.</li>
  <li><a href="http://www.nike.com/us/en_us/?ref=https%3A%2F%2Fwww.google.com%2F" target="_blank">Nike</a> does a good job of sticking to their upcoming events and focusing on one campaign at a time.</li>
</ul>

<p>Keep your website timely without becoming a promotion hoarder. You don’t need to hold onto everything you’ve ever promoted; every campaign has a shelf life. When considering alternatives to image sliders, here are a few points to keep in mind:</p>

<ul>
  <li>Maintain one message. Yes, it’s possible – focus!</li>
  <li>Organize key points in the layout on level of importance.</li>
  <li>Give the user more control by disabling auto rotate carousels.</li>
  <li>Limit or simplify the amount of sliders if you use a slideshow.</li>
</ul>

<p>Before you make a big decision on how to direct your users, consider your customer and the experience first, and do it right. Measure, adjust, rinse and repeat.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#carousel"
          aria-label="View all posts in category carousel"
          >carousel</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#seo"
          aria-label="View all posts in category seo"
          >seo</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#modern-web"
          aria-label="View all posts in category modern web"
          >modern web</a
        >
         
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
categories<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Adding Related Posts in WordPress Without a Plugin
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Adding Related Posts in WordPress Without a Plugin | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Adding Related Posts in WordPress Without a Plugin" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="This past week I had yet another challenge: add related posts to a blog entry and make it match a design. It seemed straightforward, especially since all the blog posts are organized by category. As I dug deeper, I realized it wasn’t going to be as simple as I’d originally thought." />
<meta property="og:description" content="This past week I had yet another challenge: add related posts to a blog entry and make it match a design. It seemed straightforward, especially since all the blog posts are organized by category. As I dug deeper, I realized it wasn’t going to be as simple as I’d originally thought." />
<link rel="canonical" href="https://davidauble.com/blog/2017/10/27/adding-related-posts-wordpress-without-plugin.html" />
<meta property="og:url" content="https://davidauble.com/blog/2017/10/27/adding-related-posts-wordpress-without-plugin.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/related-posts.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2017-10-27T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/related-posts.jpg" />
<meta property="twitter:title" content="Adding Related Posts in WordPress Without a Plugin" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2017-10-27T00:00:00+00:00","datePublished":"2017-10-27T00:00:00+00:00","description":"This past week I had yet another challenge: add related posts to a blog entry and make it match a design. It seemed straightforward, especially since all the blog posts are organized by category. As I dug deeper, I realized it wasn’t going to be as simple as I’d originally thought.","headline":"Adding Related Posts in WordPress Without a Plugin","image":"https://davidauble.com/assets/images/posts/related-posts.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2017/10/27/adding-related-posts-wordpress-without-plugin.html"},"url":"https://davidauble.com/blog/2017/10/27/adding-related-posts-wordpress-without-plugin.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Oct 27, 2017</span
          >
        </div>
        <h1>Adding Related Posts in WordPress Without a Plugin</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 2 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/related-posts.jpg" alt="Adding Related Posts in WordPress Without a Plugin" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>This past week I had yet another challenge: add related posts to a blog entry and make it match a design. It seemed straightforward, especially since all the blog posts are organized by category. As I dug deeper, I realized it wasn’t going to be as simple as I’d originally thought.</p>

<p>Let me preface this post by saying <strong>I don’t like using unnecessary WordPress plugins. </strong>I’d much rather build something from scratch that doesn’t have limitations from a plugin. There are times when plugins are necessary, sure, but I’d much rather have something that doesn’t need to be updated constantly or be limited to a plugin’s design.</p>

<p>I should preface this with there are two ways of doing this: display related posts by <strong>tags </strong>and by <strong>categories</strong>. I’ll first demonstrate by displaying related posts by tags. I feel this is the better way to show related posts. <em>Let’s assume this will be going on your default single.php page.</em></p>

<h2 id="related-posts-by-tags">Related Posts by Tags</h2>
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>&lt;div class="related-posts"&gt;
  &lt;?php
    $tags = wp_get_post_tags($post-&gt;ID);

    if ($tags):
      $first_tag = $tags[0]-&gt;term_id;

      $args = array(
        'tag__in' =&gt; array($first_tag),
        'post__not_in' =&gt; array($post-&gt;ID),
        'posts_per_page' =&gt; 2,
        'caller_get_posts' =&gt; 1,
        'orderby' =&gt; 'rand'
      );

      $posts = new WP_Query($args);
  ?&gt;

      &lt;?php if($posts-&gt;have_posts()): while($posts-&gt;have_posts()): $posts-&gt;the_post(); ?&gt;

        &lt;div class="related-posts__post"&gt;
          &lt;a href="&lt;?php the_permalink(); ?&gt;"&gt;
            &lt;?php $image = wp_get_attachment_image_src(get_post_thumbnail_id($post-&gt;ID), 'medium'); ?&gt;
            &lt;img src="&lt;?php echo $image[0]; ?&gt;" alt="" class=""&gt;

            &lt;span class="related-posts__post--title"&gt;&lt;?php the_title(); ?&gt;&lt;/span&gt;
          &lt;/a&gt;
        &lt;/div&gt;

      &lt;?php endwhile; endif; wp_reset_query(); ?&gt;

  &lt;?php endif; ?&gt;
&lt;/div&gt;
</code></pre></div></div>

<h2 id="related-posts-by-categories">Related Posts by Categories</h2>
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>&lt;div class="related-posts"&gt;
  &lt;?php
    $tags = wp_get_post_categories($post-&gt;ID);

    if ($tags):
      $args = array(
        'current_category' =&gt; $tags,
        'orderby' =&gt; 'rand',
        'posts_per_page' =&gt; 2
      );

      $posts = new WP_Query($args);
      while ($posts-&gt;have_posts()): $posts-&gt;the_post();
  ?&gt;
      &lt;div class="related-posts__post"&gt;
        &lt;a href="&lt;?php the_permalink(); ?&gt;" class="related-posts__post--link"&gt;
          &lt;span class="related-posts__post--link--wrap"&gt;
            &lt;span class="related-posts__post--link--wrap__overlay"&gt;&lt;/span&gt;

            &lt;?php $image = wp_get_attachment_image_src(get_post_thumbnail_id($post-&gt;ID), 'blog_image'); ?&gt;
            &lt;img src="&lt;?php echo $image[0]; ?&gt;" alt="" class="related-posts__post--link--image"&gt;

            &lt;span class="btn btn-secondary"&gt;Read More&lt;/span&gt;
          &lt;/span&gt;
          &lt;h4&gt;&lt;?php the_title(); ?&gt;&lt;/h4&gt;
        &lt;/a&gt;
      &lt;/div&gt;
    &lt;?php endwhile; ?&gt;
  &lt;?php wp_reset_query(); endif; ?&gt;
&lt;/div&gt;
</code></pre></div></div>

<p>And voila! I hope this helps.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#categories"
          aria-label="View all posts in category categories"
          >categories</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#tags"
          aria-label="View all posts in category tags"
          >tags</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#php"
          aria-label="View all posts in category php"
          >php</a
        >
         
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
chrome<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Chrome 63 Update: HTTPS Redirect on localhost
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Chrome 63 Update: HTTPS Redirect on localhost | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Chrome 63 Update: HTTPS Redirect on localhost" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="I ran into something frustrating yesterday and after extensive research, figured out the problem. With one of Chrome’s latest updates, all of my sites on my local machine were consistently being redirected to HTTPS." />
<meta property="og:description" content="I ran into something frustrating yesterday and after extensive research, figured out the problem. With one of Chrome’s latest updates, all of my sites on my local machine were consistently being redirected to HTTPS." />
<link rel="canonical" href="https://davidauble.com/blog/2017/12/09/chrome-63-update-https-redirect-localhost.html" />
<meta property="og:url" content="https://davidauble.com/blog/2017/12/09/chrome-63-update-https-redirect-localhost.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/chrome-update.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2017-12-09T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/chrome-update.jpg" />
<meta property="twitter:title" content="Chrome 63 Update: HTTPS Redirect on localhost" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2017-12-09T00:00:00+00:00","datePublished":"2017-12-09T00:00:00+00:00","description":"I ran into something frustrating yesterday and after extensive research, figured out the problem. With one of Chrome’s latest updates, all of my sites on my local machine were consistently being redirected to HTTPS.","headline":"Chrome 63 Update: HTTPS Redirect on localhost","image":"https://davidauble.com/assets/images/posts/chrome-update.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2017/12/09/chrome-63-update-https-redirect-localhost.html"},"url":"https://davidauble.com/blog/2017/12/09/chrome-63-update-https-redirect-localhost.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>chrome</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Dec 09, 2017</span
          >
        </div>
        <h1>Chrome 63 Update: HTTPS Redirect on localhost</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 1 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/chrome-update.jpg" alt="Chrome 63 Update: HTTPS Redirect on localhost" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>I ran into something frustrating yesterday and after extensive research, figured out the problem. With one of Chrome’s latest updates, all of my sites on my local machine were consistently being redirected to HTTPS.</p>

<p>Each of my sites had an extension of “.app”, and after reading through <a href="https://stackoverflow.com/questions/25277457/google-chrome-redirecting-localhost-to-https/47714902#47714902" target="_blank">this StackOverflow thread</a>, I updated them to “.local” and magically, everything started working as expected.</p>

<p>I’m not entirely sure why or when this update occurred, but it seems to affect Chrome 63.</p>

<p><strong>Update (12/11/2017): </strong>
I found <a href="https://stackoverflow.com/questions/47735877/how-to-stop-chrome-from-redirecting-to-https" target="_blank">another article on StackOverflow</a> that helped outline the issue. Apparently Chrome v63 is no longer allowing certain top-level domains (TLDs) and will automatically forward those domains to HTTPS.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#chrome"
          aria-label="View all posts in category chrome"
          >chrome</a
        >
         
        <a
          class="chip"
          href="/tags/#update"
          aria-label="View all posts tagged update"
          >update</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
css<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Targeting Internet Explorer with CSS Media Queries
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Targeting Internet Explorer with CSS Media Queries | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Targeting Internet Explorer with CSS Media Queries" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="I’ve been using CSS Grid and Flexbox for a little while now for different parts of websites. They work in all modern browsers and it saves me time from having to put together cheap hacks. One of the caveats to using Grid though is that older browsers such as IE10 and 11 don’t fully support it." />
<meta property="og:description" content="I’ve been using CSS Grid and Flexbox for a little while now for different parts of websites. They work in all modern browsers and it saves me time from having to put together cheap hacks. One of the caveats to using Grid though is that older browsers such as IE10 and 11 don’t fully support it." />
<link rel="canonical" href="https://davidauble.com/blog/2020/05/05/targeting-internet-explorer-with-css-media-queries.html" />
<meta property="og:url" content="https://davidauble.com/blog/2020/05/05/targeting-internet-explorer-with-css-media-queries.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/ie-11-background.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2020-05-05T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/ie-11-background.jpg" />
<meta property="twitter:title" content="Targeting Internet Explorer with CSS Media Queries" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2020-05-05T00:00:00+00:00","datePublished":"2020-05-05T00:00:00+00:00","description":"I’ve been using CSS Grid and Flexbox for a little while now for different parts of websites. They work in all modern browsers and it saves me time from having to put together cheap hacks. One of the caveats to using Grid though is that older browsers such as IE10 and 11 don’t fully support it.","headline":"Targeting Internet Explorer with CSS Media Queries","image":"https://davidauble.com/assets/images/posts/ie-11-background.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2020/05/05/targeting-internet-explorer-with-css-media-queries.html"},"url":"https://davidauble.com/blog/2020/05/05/targeting-internet-explorer-with-css-media-queries.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>css</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >May 05, 2020</span
          >
        </div>
        <h1>Targeting Internet Explorer with CSS Media Queries</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 2 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/ie-11-background.jpg" alt="Targeting Internet Explorer with CSS Media Queries" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>I’ve been using CSS Grid and Flexbox for a little while now for different parts of websites. They work in all modern browsers and it saves me time from having to put together cheap hacks. One of the caveats to using Grid though is that older browsers such as IE10 and 11 don’t fully support it.</p>

<p>On a recent build I had a section with four small boxes and a title. Normally I’d use Bootstrap’s <code class="language-plaintext highlighter-rouge">.col-md-3</code> class, but since I am moving away from Bootstrap alltogether, I was faced with another challenge.</p>

<p>Typically I support browsers back two versions, so I’m still supporting IE10/11. Although many of Grid/Flexbox’s capabilities work, there are some legacy specs that need to be used for them to work properly.</p>

<p>The most useful though is an IE-only media query, so it doesn’t break other styles. Take a look:</p>

<div class="language-css highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="k">@media</span> <span class="n">all</span> <span class="n">and</span> <span class="p">(</span><span class="n">-ms-high-contrast</span><span class="p">:</span> <span class="nb">none</span><span class="p">),</span> <span class="p">(</span><span class="n">-ms-high-contrast</span><span class="p">:</span> <span class="n">active</span><span class="p">)</span> <span class="p">{</span>
  <span class="c">/* IE specific queries here */</span>
<span class="p">}</span>
</code></pre></div></div>

<p>And that’s it! When using this media query, it is important to note you can’t simply but styles in the brackets. You must define the class and then styles. Below is a sample of my implemenation.</p>

<div class="language-css highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="k">@media</span> <span class="n">all</span> <span class="n">and</span> <span class="p">(</span><span class="n">-ms-high-contrast</span><span class="p">:</span> <span class="nb">none</span><span class="p">),</span> <span class="p">(</span><span class="n">-ms-high-contrast</span><span class="p">:</span> <span class="n">active</span><span class="p">)</span> <span class="p">{</span>
  <span class="nc">.callout__container</span> <span class="p">{</span>
    <span class="nl">margin</span><span class="p">:</span> <span class="m">0</span> <span class="m">1em</span><span class="p">;</span>
  <span class="p">}</span>

  <span class="nc">.callout__container</span><span class="nd">:first-of-type</span> <span class="p">{</span>
    <span class="nl">margin</span><span class="p">:</span> <span class="m">0</span> <span class="m">1em</span> <span class="m">0</span> <span class="m">0</span><span class="p">;</span>
  <span class="p">}</span>

  <span class="nc">.callout__container</span><span class="nd">:last-of-type</span> <span class="p">{</span>
    <span class="nl">margin</span><span class="p">:</span> <span class="m">0</span> <span class="m">0</span> <span class="m">0</span> <span class="m">1em</span><span class="p">;</span>
  <span class="p">}</span>
<span class="p">}</span>
</code></pre></div></div>

<p>I hope this helps!</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#css"
          aria-label="View all posts in category css"
          >css</a
        >
         
        <a
          class="chip"
          href="/tags/#ie"
          aria-label="View all posts tagged ie"
          >ie</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Why Click Events Don't Work in Safari
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Why Click Events Don’t Work in Safari | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Why Click Events Don’t Work in Safari" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Over the last few months I’ve been working on a weather dashboard with the goal of developing it into my first mobile app." />
<meta property="og:description" content="Over the last few months I’ve been working on a weather dashboard with the goal of developing it into my first mobile app." />
<link rel="canonical" href="https://davidauble.com/blog/2018/01/29/why-click-events-dont-work-in-safari.html" />
<meta property="og:url" content="https://davidauble.com/blog/2018/01/29/why-click-events-dont-work-in-safari.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/cup-of-coffee-laptop-office-macbook-89786.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2018-01-29T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/cup-of-coffee-laptop-office-macbook-89786.jpg" />
<meta property="twitter:title" content="Why Click Events Don’t Work in Safari" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2018-01-29T00:00:00+00:00","datePublished":"2018-01-29T00:00:00+00:00","description":"Over the last few months I’ve been working on a weather dashboard with the goal of developing it into my first mobile app.","headline":"Why Click Events Don’t Work in Safari","image":"https://davidauble.com/assets/images/posts/cup-of-coffee-laptop-office-macbook-89786.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2018/01/29/why-click-events-dont-work-in-safari.html"},"url":"https://davidauble.com/blog/2018/01/29/why-click-events-dont-work-in-safari.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>css</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jan 29, 2018</span
          >
        </div>
        <h1>Why Click Events Don't Work in Safari</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 1 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/cup-of-coffee-laptop-office-macbook-89786.jpg" alt="Why Click Events Don't Work in Safari" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>Over the last few months I’ve been working on a weather dashboard with the goal of developing it into my first mobile app.</p>

<p>One of the features I’ve added has been a pull-out menu, which displays additional information that won’t fit on the primary screen. It’s been working in all the browsers except Safari mobile. I’m pulling a lot of data asynchronously, so several items don’t appear in the DOM when the page is loaded. Because of this, I was having to target click events in the following way:</p>

<pre>$(document).on('click', '.js-menu-cog', function() {
                   $('.js-menu').fadeIn('fast').addClass('active');
                });</pre>

<p>It was working in all browsers yet again, Safari was being problematic. Finally, I remember reading an article years ago about Safari not reading elements as buttons unless they had the cursor: pointer CSS property applied.</p>

<p>Once I added the cursor: pointer style to my button, it started working!</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#css"
          aria-label="View all posts in category css"
          >css</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#safari"
          aria-label="View all posts in category safari"
          >safari</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#rwd"
          aria-label="View all posts in category rwd"
          >rwd</a
        >
         
        <a
          class="chip"
          href="/tags/#browsers"
          aria-label="View all posts tagged browsers"
          >browsers</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Reference WordPress Dashicons in CSS
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Reference WordPress Dashicons in CSS | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Reference WordPress Dashicons in CSS" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Recently I had an issue where I needed to remove a mega menu plugin in order to improve a site’s PageSpeed score. In breaking it down, I realized the plugin was referencing the WordPress Dashicons, something I would need to add in when rebuilding the navigation menu." />
<meta property="og:description" content="Recently I had an issue where I needed to remove a mega menu plugin in order to improve a site’s PageSpeed score. In breaking it down, I realized the plugin was referencing the WordPress Dashicons, something I would need to add in when rebuilding the navigation menu." />
<link rel="canonical" href="https://davidauble.com/blog/2017/07/20/reference-wordpress-dashicons-css.html" />
<meta property="og:url" content="https://davidauble.com/blog/2017/07/20/reference-wordpress-dashicons-css.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/bg-tools.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2017-07-20T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/bg-tools.jpg" />
<meta property="twitter:title" content="Reference WordPress Dashicons in CSS" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2017-07-20T00:00:00+00:00","datePublished":"2017-07-20T00:00:00+00:00","description":"Recently I had an issue where I needed to remove a mega menu plugin in order to improve a site’s PageSpeed score. In breaking it down, I realized the plugin was referencing the WordPress Dashicons, something I would need to add in when rebuilding the navigation menu.","headline":"Reference WordPress Dashicons in CSS","image":"https://davidauble.com/assets/images/bg-tools.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2017/07/20/reference-wordpress-dashicons-css.html"},"url":"https://davidauble.com/blog/2017/07/20/reference-wordpress-dashicons-css.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jul 20, 2017</span
          >
        </div>
        <h1>Reference WordPress Dashicons in CSS</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 1 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/bg-tools.jpg" alt="Reference WordPress Dashicons in CSS" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>Recently I had an issue where I needed to remove a mega menu plugin in order to improve a site’s PageSpeed score. In breaking it down, I realized the plugin was referencing the WordPress Dashicons, something I would need to add in when rebuilding the navigation menu.</p>

<p>I looked online and finally found the solution: load the dashicons from the functions.php file.</p>

<pre>
add_action( 'wp_enqueue_scripts', 'load_dashicons_front_end' );

function load_dashicons_front_end() {
  wp_enqueue_style( 'dashicons' );
}
</pre>

<p>Then, in your CSS, simply reference them as a new font:</p>

<pre>.item { content: '\f140'; display: inline-block; font-family: dashicons; }</pre>

<p>I found this snippet from <a href="https://wpsites.net/web-design/adding-dashicons-in-wordpress/" target="_blank">WP Sites</a>. For the complete Dashicon library, look at the <a href="https://developer.wordpress.org/resource/dashicons/" target="_blank">WordPress Dashicon Developer Resource</a>.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#dashicons"
          aria-label="View all posts in category dashicons"
          >dashicons</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#css"
          aria-label="View all posts in category css"
          >css</a
        >
         
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
        <a
          class="chip"
          href="/tags/#css"
          aria-label="View all posts tagged css"
          >css</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      How To: Use FontAwesome Fonts in Your CSS :before & :after
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>How To: Use FontAwesome Fonts in Your CSS :before &amp; :after | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="How To: Use FontAwesome Fonts in Your CSS :before &amp; :after" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="I’ve been a fan of FontAwesome for a long time. I admire their work and appreciate everything they do for fonts, icons and making websites and web apps more user-friendly." />
<meta property="og:description" content="I’ve been a fan of FontAwesome for a long time. I admire their work and appreciate everything they do for fonts, icons and making websites and web apps more user-friendly." />
<link rel="canonical" href="https://davidauble.com/blog/2017/03/15/how-to-use-fontawesome-fonts-in-your-css-before-after.html" />
<meta property="og:url" content="https://davidauble.com/blog/2017/03/15/how-to-use-fontawesome-fonts-in-your-css-before-after.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/code.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2017-03-15T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/code.jpg" />
<meta property="twitter:title" content="How To: Use FontAwesome Fonts in Your CSS :before &amp; :after" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2017-03-15T00:00:00+00:00","datePublished":"2017-03-15T00:00:00+00:00","description":"I’ve been a fan of FontAwesome for a long time. I admire their work and appreciate everything they do for fonts, icons and making websites and web apps more user-friendly.","headline":"How To: Use FontAwesome Fonts in Your CSS :before &amp; :after","image":"https://davidauble.com/assets/images/posts/code.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2017/03/15/how-to-use-fontawesome-fonts-in-your-css-before-after.html"},"url":"https://davidauble.com/blog/2017/03/15/how-to-use-fontawesome-fonts-in-your-css-before-after.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>fontawesome</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Mar 15, 2017</span
          >
        </div>
        <h1>How To: Use FontAwesome Fonts in Your CSS :before & :after</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 1 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/code.jpg" alt="How To: Use FontAwesome Fonts in Your CSS :before & :after" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>I’ve been a fan of <a href="http://fontawesome.io/" target="_blank">FontAwesome</a> for a long time. I admire their work and appreciate everything they do for fonts, icons and making websites and web apps more user-friendly.</p>

<p>Often, I come across instances where I need to use their icons in my CSS and I am constantly forgetting how to use them in CSS. Below are the steps in case you’re as forgetful as I am. (Don’t forget to include the fonts in your header!)</p>

<ol>
  <li>Find the font you want on their collection</li>
  <li>Copy the Unicode code (ie, f10d)</li>
  <li>Use the following CSS:</li>
</ol>

<pre>:before { font-family: "FontAwesome"; content: "\f10d"; }</pre>

<p>You may need to adjust other properties, such as color and position, but this is the process. And, in case you’re wanting to incorporate them into a design, follow these steps:</p>

<ol>
  <li>Download the font collection from <a href="https://github.com/FortAwesome/Font-Awesome" target="_blank">GitHub</a></li>
  <li>Find the font you want to use on the <a href="http://fontawesome.io/cheatsheet/" target="_blank">FontAwesome Cheatsheet</a></li>
  <li>Copy the icon character you wish and paste it into your design</li>
  <li>Change the font to FontAwesome and voila!</li>
</ol>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#fontawesome"
          aria-label="View all posts in category fontawesome"
          >fontawesome</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#css"
          aria-label="View all posts in category css"
          >css</a
        >
         
        <a
          class="chip"
          href="/tags/#css"
          aria-label="View all posts tagged css"
          >css</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
dashicons<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Reference WordPress Dashicons in CSS
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Reference WordPress Dashicons in CSS | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Reference WordPress Dashicons in CSS" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Recently I had an issue where I needed to remove a mega menu plugin in order to improve a site’s PageSpeed score. In breaking it down, I realized the plugin was referencing the WordPress Dashicons, something I would need to add in when rebuilding the navigation menu." />
<meta property="og:description" content="Recently I had an issue where I needed to remove a mega menu plugin in order to improve a site’s PageSpeed score. In breaking it down, I realized the plugin was referencing the WordPress Dashicons, something I would need to add in when rebuilding the navigation menu." />
<link rel="canonical" href="https://davidauble.com/blog/2017/07/20/reference-wordpress-dashicons-css.html" />
<meta property="og:url" content="https://davidauble.com/blog/2017/07/20/reference-wordpress-dashicons-css.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/bg-tools.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2017-07-20T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/bg-tools.jpg" />
<meta property="twitter:title" content="Reference WordPress Dashicons in CSS" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2017-07-20T00:00:00+00:00","datePublished":"2017-07-20T00:00:00+00:00","description":"Recently I had an issue where I needed to remove a mega menu plugin in order to improve a site’s PageSpeed score. In breaking it down, I realized the plugin was referencing the WordPress Dashicons, something I would need to add in when rebuilding the navigation menu.","headline":"Reference WordPress Dashicons in CSS","image":"https://davidauble.com/assets/images/bg-tools.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2017/07/20/reference-wordpress-dashicons-css.html"},"url":"https://davidauble.com/blog/2017/07/20/reference-wordpress-dashicons-css.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jul 20, 2017</span
          >
        </div>
        <h1>Reference WordPress Dashicons in CSS</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 1 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/bg-tools.jpg" alt="Reference WordPress Dashicons in CSS" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>Recently I had an issue where I needed to remove a mega menu plugin in order to improve a site’s PageSpeed score. In breaking it down, I realized the plugin was referencing the WordPress Dashicons, something I would need to add in when rebuilding the navigation menu.</p>

<p>I looked online and finally found the solution: load the dashicons from the functions.php file.</p>

<pre>
add_action( 'wp_enqueue_scripts', 'load_dashicons_front_end' );

function load_dashicons_front_end() {
  wp_enqueue_style( 'dashicons' );
}
</pre>

<p>Then, in your CSS, simply reference them as a new font:</p>

<pre>.item { content: '\f140'; display: inline-block; font-family: dashicons; }</pre>

<p>I found this snippet from <a href="https://wpsites.net/web-design/adding-dashicons-in-wordpress/" target="_blank">WP Sites</a>. For the complete Dashicon library, look at the <a href="https://developer.wordpress.org/resource/dashicons/" target="_blank">WordPress Dashicon Developer Resource</a>.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#dashicons"
          aria-label="View all posts in category dashicons"
          >dashicons</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#css"
          aria-label="View all posts in category css"
          >css</a
        >
         
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
        <a
          class="chip"
          href="/tags/#css"
          aria-label="View all posts tagged css"
          >css</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
development<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Getting Started with GitHub Actions
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Getting Started with GitHub Actions | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Getting Started with GitHub Actions" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="GitHub Actions automates software workflows directly in your repository. You can run tests, build artifacts, deploy apps, and handle repetitive tasks whenever events happen in GitHub." />
<meta property="og:description" content="GitHub Actions automates software workflows directly in your repository. You can run tests, build artifacts, deploy apps, and handle repetitive tasks whenever events happen in GitHub." />
<link rel="canonical" href="https://davidauble.com/blog/2024/02/28/getting-started-github-actions.html" />
<meta property="og:url" content="https://davidauble.com/blog/2024/02/28/getting-started-github-actions.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2024-02-28T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" />
<meta property="twitter:title" content="Getting Started with GitHub Actions" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2024-02-28T00:00:00+00:00","datePublished":"2024-02-28T00:00:00+00:00","description":"GitHub Actions automates software workflows directly in your repository. You can run tests, build artifacts, deploy apps, and handle repetitive tasks whenever events happen in GitHub.","headline":"Getting Started with GitHub Actions","image":"https://davidauble.com/assets/images/posts/pexels-realtoughcandycom-11035544.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2024/02/28/getting-started-github-actions.html"},"url":"https://davidauble.com/blog/2024/02/28/getting-started-github-actions.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>github</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Feb 28, 2024</span
          >
        </div>
        <h1>Getting Started with GitHub Actions</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 3 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>GitHub Actions automates software workflows directly in your repository. You can run tests, build artifacts, deploy apps, and handle repetitive tasks whenever events happen in GitHub.</p>

<p>This quick guide covers the core concepts and a simple workflow you can adapt for your own projects.</p>

<h2 id="what-is-github-actions">What is GitHub Actions?</h2>

<p>GitHub Actions is GitHub’s built-in CI/CD platform. Workflows are defined in YAML and triggered by repository events like pushes, pull requests, and issue activity.</p>

<h2 id="setting-up-a-workflow">Setting up a Workflow</h2>

<p>Create a <code class="language-plaintext highlighter-rouge">.github/workflows</code> directory at the root of your repository, then add a workflow file such as <code class="language-plaintext highlighter-rouge">test.yml</code>.</p>

<p>This example runs tests on pushes and pull requests to the <code class="language-plaintext highlighter-rouge">main</code> branch.</p>

<div class="language-yaml highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="c1"># .github/workflows/test.yml</span>

<span class="na">name</span><span class="pi">:</span> <span class="s">Run Tests</span>

<span class="na">on</span><span class="pi">:</span>
  <span class="na">push</span><span class="pi">:</span>
    <span class="na">branches</span><span class="pi">:</span>
      <span class="pi">-</span> <span class="s">main</span>
  <span class="na">pull_request</span><span class="pi">:</span>
    <span class="na">branches</span><span class="pi">:</span>
      <span class="pi">-</span> <span class="s">main</span>

<span class="na">jobs</span><span class="pi">:</span>
  <span class="na">test</span><span class="pi">:</span>
    <span class="na">runs-on</span><span class="pi">:</span> <span class="s">ubuntu-latest</span>

    <span class="na">steps</span><span class="pi">:</span>
      <span class="pi">-</span> <span class="na">name</span><span class="pi">:</span> <span class="s">Checkout repository</span>
        <span class="na">uses</span><span class="pi">:</span> <span class="s">actions/checkout@v4</span>

      <span class="pi">-</span> <span class="na">name</span><span class="pi">:</span> <span class="s">Set up Node.js</span>
        <span class="na">uses</span><span class="pi">:</span> <span class="s">actions/setup-node@v4</span>
        <span class="na">with</span><span class="pi">:</span>
          <span class="na">node-version</span><span class="pi">:</span> <span class="m">20</span>

      <span class="pi">-</span> <span class="na">name</span><span class="pi">:</span> <span class="s">Install dependencies</span>
        <span class="na">run</span><span class="pi">:</span> <span class="s">npm install</span>

      <span class="pi">-</span> <span class="na">name</span><span class="pi">:</span> <span class="s">Run tests</span>
        <span class="na">run</span><span class="pi">:</span> <span class="s">npm test</span>
</code></pre></div></div>

<p>This workflow defines a <code class="language-plaintext highlighter-rouge">test</code> job on Ubuntu, checks out code, sets up Node.js, installs dependencies, and runs tests. You can replace these steps with commands specific to your stack.</p>

<h2 id="workflow-triggers">Workflow Triggers</h2>

<p>The <code class="language-plaintext highlighter-rouge">on</code> section controls when a workflow runs. In this example it triggers on:</p>

<ul>
  <li>pushes to <code class="language-plaintext highlighter-rouge">main</code></li>
  <li>pull requests targeting <code class="language-plaintext highlighter-rouge">main</code></li>
</ul>

<p>You can also trigger on schedules, tags, releases, and many other events.</p>

<h2 id="actions-marketplace">Actions Marketplace</h2>

<p>The GitHub Marketplace includes many reusable actions for common tasks such as deployments, notifications, linting, and security checks.</p>

<p>For example, you can deploy to GitHub Pages after tests complete:</p>

<div class="language-yaml highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="pi">-</span> <span class="na">name</span><span class="pi">:</span> <span class="s">Deploy to GitHub Pages</span>
  <span class="na">uses</span><span class="pi">:</span> <span class="s">JamesIves/[email protected]</span>
  <span class="na">with</span><span class="pi">:</span>
    <span class="na">branch</span><span class="pi">:</span> <span class="s">gh-pages</span>
    <span class="na">folder</span><span class="pi">:</span> <span class="s">build</span>
</code></pre></div></div>

<p>This action publishes the <code class="language-plaintext highlighter-rouge">build</code> directory to the <code class="language-plaintext highlighter-rouge">gh-pages</code> branch.</p>

<h2 id="monitoring-workflow-runs">Monitoring Workflow Runs</h2>

<p>After pushing changes or opening pull requests, view run history in the repository’s <strong>Actions</strong> tab. Each run includes per-step logs for debugging failed jobs.</p>

<h2 id="conclusion">Conclusion</h2>

<p>GitHub Actions can dramatically improve consistency and speed by automating repetitive work. Start with a small test workflow, then expand into build, release, and deployment pipelines as your process matures.</p>

<p>Once your first workflow is in place, you will have a reliable baseline you can iterate on with each project.</p>

<p><a href="https://www.pexels.com/photo/person-holding-a-black-and-white-paper-with-message-11035544/">Photo by RealToughCandy.com</a></p>

<p><em>This post was generated with the help of AI.</em></p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#github"
          aria-label="View all posts in category github"
          >github</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#development"
          aria-label="View all posts in category development"
          >development</a
        >
         
        <a
          class="chip"
          href="/tags/#github"
          aria-label="View all posts tagged github"
          >github</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2020/09/06/new-job-promotion.html">
        
        <img src="/assets/images/posts/david-auble-manager.jpg" alt="David Auble, Manager" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 06, 2020 · </span
          >
          <h3>David Auble, Manager</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Common Misconceptions About WordPress
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Common Misconceptions About WordPress | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Common Misconceptions About WordPress" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="WordPress is undoubtedly one of the most popular content management systems (CMS) on the internet today. With its user-friendly interface and vast plugin ecosystem, it has empowered millions of users to create websites without extensive coding knowledge. However, there are several common misconceptions about WordPress that need to be addressed. In this article, we’ll debunk some of these myths." />
<meta property="og:description" content="WordPress is undoubtedly one of the most popular content management systems (CMS) on the internet today. With its user-friendly interface and vast plugin ecosystem, it has empowered millions of users to create websites without extensive coding knowledge. However, there are several common misconceptions about WordPress that need to be addressed. In this article, we’ll debunk some of these myths." />
<link rel="canonical" href="https://davidauble.com/blog/2023/09/01/common-misconceptions-in-wordpress.html" />
<meta property="og:url" content="https://davidauble.com/blog/2023/09/01/common-misconceptions-in-wordpress.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/wordpress-misconceptions.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2023-09-01T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/wordpress-misconceptions.jpg" />
<meta property="twitter:title" content="Common Misconceptions About WordPress" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2023-09-01T00:00:00+00:00","datePublished":"2023-09-01T00:00:00+00:00","description":"WordPress is undoubtedly one of the most popular content management systems (CMS) on the internet today. With its user-friendly interface and vast plugin ecosystem, it has empowered millions of users to create websites without extensive coding knowledge. However, there are several common misconceptions about WordPress that need to be addressed. In this article, we’ll debunk some of these myths.","headline":"Common Misconceptions About WordPress","image":"https://davidauble.com/assets/images/posts/wordpress-misconceptions.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2023/09/01/common-misconceptions-in-wordpress.html"},"url":"https://davidauble.com/blog/2023/09/01/common-misconceptions-in-wordpress.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Sep 01, 2023</span
          >
        </div>
        <h1>Common Misconceptions About WordPress</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 3 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>WordPress is undoubtedly one of the most popular content management systems (CMS) on the internet today. With its user-friendly interface and vast plugin ecosystem, it has empowered millions of users to create websites without extensive coding knowledge. However, there are several common misconceptions about WordPress that need to be addressed. In this article, we’ll debunk some of these myths.</p>

<h2 id="myth-1-wordpress-is-just-for-blogs">Myth 1: WordPress is Just for Blogs</h2>

<p>One of the most persistent misconceptions is that WordPress is primarily a platform for bloggers. While WordPress initially gained popularity as a blogging platform, it has evolved into a versatile CMS that can power a wide range of websites, including e-commerce stores, business websites, forums, and more. Its flexibility allows developers to build almost any type of website.</p>

<h2 id="myth-2-wordpress-is-not-secure">Myth 2: WordPress is Not Secure</h2>

<p>Security concerns often arise when discussing WordPress. Some believe that it’s inherently insecure and prone to hacking. In reality, WordPress takes security seriously. The core development team regularly releases updates to patch vulnerabilities, and there is a robust community of security experts and plugins dedicated to enhancing WordPress security. The key to a secure WordPress site is keeping it updated and following best security practices.</p>

<h2 id="myth-3-all-wordpress-sites-look-the-same">Myth 3: All WordPress Sites Look the Same</h2>

<p>Another misconception is that all WordPress websites look generic and similar. While it’s true that some beginners might use default themes, WordPress offers thousands of free and premium themes, allowing you to create a unique and customized design for your site. With the help of custom themes and CSS, you can make your WordPress site stand out from the crowd.</p>

<h2 id="myth-4-wordpress-is-slow">Myth 4: WordPress is Slow</h2>

<p>WordPress performance largely depends on how it’s configured and optimized. While it’s true that poorly coded themes and excessive plugins can slow down your site, a well-optimized WordPress site can be incredibly fast. Utilize caching, image optimization, and choose a reliable hosting provider to ensure your WordPress site loads quickly.</p>

<h2 id="myth-5-wordpress-cant-handle-large-websites">Myth 5: WordPress Can’t Handle Large Websites</h2>

<p>Some believe that WordPress is not suitable for large websites with a high volume of content. This misconception arises from the idea that WordPress is only for small blogs. However, many high-traffic and enterprise-level websites are built on WordPress, thanks to its scalability and the ability to handle large amounts of content with ease.</p>

<h2 id="myth-6-you-need-to-know-code-to-use-wordpress">Myth 6: You Need to Know Code to Use WordPress</h2>

<p>While coding skills can be beneficial for advanced customization, they are not a requirement to use WordPress. The platform offers a user-friendly interface, a visual editor, and a plethora of plugins that allow users to create and manage content without writing code. Anyone can start using WordPress, and the learning curve is not as steep as some might think.</p>

<p>In conclusion, WordPress is a powerful and versatile CMS that can be used for a wide range of websites, is secure when properly managed, allows for unique design customization, can be optimized for speed, handles large websites effectively, and is user-friendly for both beginners and experienced developers. Dispelling these common misconceptions will help you make the most out of WordPress and harness its full potential.</p>

<p><a href="https://www.pexels.com/photo/white-printer-paper-on-a-vintage-typewriter-4152505/">Photo by Markus Winkler</a></p>

<p><em>This post was generated with the help of AI.</em></p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#development"
          aria-label="View all posts in category development"
          >development</a
        >
         
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2020/09/06/new-job-promotion.html">
        
        <img src="/assets/images/posts/david-auble-manager.jpg" alt="David Auble, Manager" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 06, 2020 · </span
          >
          <h3>David Auble, Manager</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
fontawesome<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      How To: Use FontAwesome Fonts in Your CSS :before & :after
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>How To: Use FontAwesome Fonts in Your CSS :before &amp; :after | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="How To: Use FontAwesome Fonts in Your CSS :before &amp; :after" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="I’ve been a fan of FontAwesome for a long time. I admire their work and appreciate everything they do for fonts, icons and making websites and web apps more user-friendly." />
<meta property="og:description" content="I’ve been a fan of FontAwesome for a long time. I admire their work and appreciate everything they do for fonts, icons and making websites and web apps more user-friendly." />
<link rel="canonical" href="https://davidauble.com/blog/2017/03/15/how-to-use-fontawesome-fonts-in-your-css-before-after.html" />
<meta property="og:url" content="https://davidauble.com/blog/2017/03/15/how-to-use-fontawesome-fonts-in-your-css-before-after.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/code.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2017-03-15T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/code.jpg" />
<meta property="twitter:title" content="How To: Use FontAwesome Fonts in Your CSS :before &amp; :after" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2017-03-15T00:00:00+00:00","datePublished":"2017-03-15T00:00:00+00:00","description":"I’ve been a fan of FontAwesome for a long time. I admire their work and appreciate everything they do for fonts, icons and making websites and web apps more user-friendly.","headline":"How To: Use FontAwesome Fonts in Your CSS :before &amp; :after","image":"https://davidauble.com/assets/images/posts/code.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2017/03/15/how-to-use-fontawesome-fonts-in-your-css-before-after.html"},"url":"https://davidauble.com/blog/2017/03/15/how-to-use-fontawesome-fonts-in-your-css-before-after.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>fontawesome</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Mar 15, 2017</span
          >
        </div>
        <h1>How To: Use FontAwesome Fonts in Your CSS :before & :after</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 1 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/code.jpg" alt="How To: Use FontAwesome Fonts in Your CSS :before & :after" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>I’ve been a fan of <a href="http://fontawesome.io/" target="_blank">FontAwesome</a> for a long time. I admire their work and appreciate everything they do for fonts, icons and making websites and web apps more user-friendly.</p>

<p>Often, I come across instances where I need to use their icons in my CSS and I am constantly forgetting how to use them in CSS. Below are the steps in case you’re as forgetful as I am. (Don’t forget to include the fonts in your header!)</p>

<ol>
  <li>Find the font you want on their collection</li>
  <li>Copy the Unicode code (ie, f10d)</li>
  <li>Use the following CSS:</li>
</ol>

<pre>:before { font-family: "FontAwesome"; content: "\f10d"; }</pre>

<p>You may need to adjust other properties, such as color and position, but this is the process. And, in case you’re wanting to incorporate them into a design, follow these steps:</p>

<ol>
  <li>Download the font collection from <a href="https://github.com/FortAwesome/Font-Awesome" target="_blank">GitHub</a></li>
  <li>Find the font you want to use on the <a href="http://fontawesome.io/cheatsheet/" target="_blank">FontAwesome Cheatsheet</a></li>
  <li>Copy the icon character you wish and paste it into your design</li>
  <li>Change the font to FontAwesome and voila!</li>
</ol>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#fontawesome"
          aria-label="View all posts in category fontawesome"
          >fontawesome</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#css"
          aria-label="View all posts in category css"
          >css</a
        >
         
        <a
          class="chip"
          href="/tags/#css"
          aria-label="View all posts tagged css"
          >css</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
git<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Private Email Address via Git Config
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Private Email Address via Git Config | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Private Email Address via Git Config" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="I’m constantly learning new things and most recently learned a little tidbit about a feature about Git, allowing for private email addresses during commits. Let’s take a look." />
<meta property="og:description" content="I’m constantly learning new things and most recently learned a little tidbit about a feature about Git, allowing for private email addresses during commits. Let’s take a look." />
<link rel="canonical" href="https://davidauble.com/blog/2022/11/26/private-git-email.html" />
<meta property="og:url" content="https://davidauble.com/blog/2022/11/26/private-git-email.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/git-1.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2022-11-26T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/git-1.jpg" />
<meta property="twitter:title" content="Private Email Address via Git Config" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2022-11-26T00:00:00+00:00","datePublished":"2022-11-26T00:00:00+00:00","description":"I’m constantly learning new things and most recently learned a little tidbit about a feature about Git, allowing for private email addresses during commits. Let’s take a look.","headline":"Private Email Address via Git Config","image":"https://davidauble.com/assets/images/posts/git-1.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2022/11/26/private-git-email.html"},"url":"https://davidauble.com/blog/2022/11/26/private-git-email.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>git</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Nov 26, 2022</span
          >
        </div>
        <h1>Private Email Address via Git Config</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 3 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>I’m constantly learning new things and most recently learned a little tidbit about a feature about Git, allowing for private email addresses during commits. Let’s take a look.</p>

<p>The scenario is that I went to make a commit to a repo on a new computer. I hadn’t set up my personal settings or configured my Git user.name or user.email settings yet, and Git warned me about it. My GitHub profile is set to private, and details about my repos are also private. When I was notified to update these settings, without thinking I entered my name and email address and saved the information to the global config. Life went on.</p>

<p>When I went to commit code later in the day, however, I was notified by Git that my personal email would be exposed, as it was tied to the commit history, thus violating my privacy settings, and ultimately refusing my commit. So what to do? I tried resetting my Git config but that didn’t work. I didn’t feel like uninstallling and reinstalling Git entirely from my system, so looked online for another solution. Enter, Tower.</p>

<p>For those of you who don’t know about <a href="https://www.git-tower.com/" target="_blank">Tower</a>, I want to start off and explain it’s a fantastic tool for learning how to use Git and working with Git. It features a streamlined GUI for using version control and works flawlessly. I have zero complaints about the software, and have personally used it. The thing I like about Tower the most, though, is their “Git FAQ” section on their site. It provides clean, clear instructions on so many Git commands. I’ve stumbled across it numerous times. With the help of this <a href="https://www.git-tower.com/learn/git/faq/change-author-name-email" target="_blank">Tower article</a>, I was able to run the following command to change the email address of my previous commit:</p>

<div class="language-shell highlighter-rouge"><div class="highlight"><pre class="highlight"><code>git commit <span class="nt">--amend</span> <span class="nt">--author</span><span class="o">=</span><span class="s2">"John Doe &lt;[email protected]&gt;"</span>
</code></pre></div></div>

<p>Now, the interesting point and back to the initial problem with Git. GitHub offers private no-reply email addresses for users wishing to keep their commits private. On the folling article on <a href="https://docs.github.com/en/account-and-profile/setting-up-and-managing-your-personal-account-on-github/managing-email-preferences/setting-your-commit-email-address">GitHub’s documentation</a>, in Step 6, GitHub explains how to set up a private email forwarding address. Simply add your GitHub username and “@users.noreply.github.com” and emails will be forwarded to your private email address. Pretty neat, huh?</p>

<p>Once I changed my global Git config email address to the one above, I was able to push my commit and finish my work.</p>

<p>Header image credit: <a href="https://www.hostinger.com/tutorials/basic-git-commands" target="_blank">Hostinger</a></p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#git"
          aria-label="View all posts in category git"
          >git</a
        >
         
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2020/09/06/new-job-promotion.html">
        
        <img src="/assets/images/posts/david-auble-manager.jpg" alt="David Auble, Manager" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 06, 2020 · </span
          >
          <h3>David Auble, Manager</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Fixing 'Another git process seems to be running in this repository' Error in Git
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Fixing ‘Another git process seems to be running in this repository’ Error in Git | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Fixing ‘Another git process seems to be running in this repository’ Error in Git" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="I sometimes come across a unique error when using Git and always have to look up how to fix the error. It’s a simple error and can be replicated by stopping a Git command before it’s finished. Git in turn generates a “index.lock” file, which prevents you from adding any additional files to the commit. The error message I usually receive in full is:" />
<meta property="og:description" content="I sometimes come across a unique error when using Git and always have to look up how to fix the error. It’s a simple error and can be replicated by stopping a Git command before it’s finished. Git in turn generates a “index.lock” file, which prevents you from adding any additional files to the commit. The error message I usually receive in full is:" />
<link rel="canonical" href="https://davidauble.com/blog/2018/10/23/fixing-another-git-process-seems-to-be-running-in-this-repository-error.html" />
<meta property="og:url" content="https://davidauble.com/blog/2018/10/23/fixing-another-git-process-seems-to-be-running-in-this-repository-error.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/code.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2018-10-23T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/code.jpg" />
<meta property="twitter:title" content="Fixing ‘Another git process seems to be running in this repository’ Error in Git" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2018-10-23T00:00:00+00:00","datePublished":"2018-10-23T00:00:00+00:00","description":"I sometimes come across a unique error when using Git and always have to look up how to fix the error. It’s a simple error and can be replicated by stopping a Git command before it’s finished. Git in turn generates a “index.lock” file, which prevents you from adding any additional files to the commit. The error message I usually receive in full is:","headline":"Fixing ‘Another git process seems to be running in this repository’ Error in Git","image":"https://davidauble.com/assets/images/posts/code.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2018/10/23/fixing-another-git-process-seems-to-be-running-in-this-repository-error.html"},"url":"https://davidauble.com/blog/2018/10/23/fixing-another-git-process-seems-to-be-running-in-this-repository-error.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>git</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Oct 23, 2018</span
          >
        </div>
        <h1>Fixing 'Another git process seems to be running in this repository' Error in Git</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 1 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/code.jpg" alt="Fixing 'Another git process seems to be running in this repository' Error in Git" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>I sometimes come across a unique error when using Git and always have to look up how to fix the error. It’s a simple error and can be replicated by stopping a Git command before it’s finished. Git in turn generates a “index.lock” file, which prevents you from adding any additional files to the commit. The error message I usually receive in full is:</p>

<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>Another git process seems to be running in this repository, e.g. an editor opened by 'git commit'. Please make sure all processes are terminated then try again. If it still fails, a git process may have crashed in this repository earlier: remove the file manually to continue.
</code></pre></div></div>

<p>The fix is simple: remove the “<strong>git.lock</strong>” file in the “/.git/” directory.</p>

<pre>rm -f .git/index.lock</pre>

<p><a href="https://stackoverflow.com/questions/38004148/another-git-process-seems-to-be-running-in-this-repository" target="_blank">Credit: StackOverflow</a></p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#git"
          aria-label="View all posts in category git"
          >git</a
        >
         
        <a
          class="chip"
          href="/tags/#command-line"
          aria-label="View all posts tagged command line"
          >command line</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      My Git Workflow: Introduction to Version Control
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>My Git Workflow: Introduction to Version Control | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="My Git Workflow: Introduction to Version Control" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Git: What is it?" />
<meta property="og:description" content="Git: What is it?" />
<link rel="canonical" href="https://davidauble.com/blog/2016/11/09/my-git-workflow-introduction-to-version-control.html" />
<meta property="og:url" content="https://davidauble.com/blog/2016/11/09/my-git-workflow-introduction-to-version-control.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/branching-with-git.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2016-11-09T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/branching-with-git.jpg" />
<meta property="twitter:title" content="My Git Workflow: Introduction to Version Control" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2016-11-09T00:00:00+00:00","datePublished":"2016-11-09T00:00:00+00:00","description":"Git: What is it?","headline":"My Git Workflow: Introduction to Version Control","image":"https://davidauble.com/assets/images/posts/branching-with-git.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2016/11/09/my-git-workflow-introduction-to-version-control.html"},"url":"https://davidauble.com/blog/2016/11/09/my-git-workflow-introduction-to-version-control.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>git</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Nov 09, 2016</span
          >
        </div>
        <h1>My Git Workflow: Introduction to Version Control</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 4 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/branching-with-git.jpg" alt="My Git Workflow: Introduction to Version Control" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <h2 id="git-what-is-it">Git: What is it?</h2>

<p>Git is a free and open source distributed version control system designed to handle everything from small to massive projects with speed and efficiency. In layman’s terms, it’s a way to store versions of code that can be managed easily and effortlessly. Git stores revision history in forms of hashes; it does not store files, rather hashes of files to save space and improve speed.</p>

<h2 id="how-do-i-get-started">How do I get started?</h2>

<p>Projects must be initialized by the following code:</p>

<div class="language-shell highlighter-rouge"><div class="highlight"><pre class="highlight"><code>git init
</code></pre></div></div>

<p>This creates a hidden folder “.git” in your working directory. This must not be removed!</p>

<h2 id="what-are-some-commands">What are some commands?</h2>

<p>Whenever you want to make a change, there are a few commands that you’ll need to learn. They are:</p>

<div class="language-shell highlighter-rouge"><div class="highlight"><pre class="highlight"><code>git pull
</code></pre></div></div>

<p>This grabs the latest versions of the files in the repository.</p>

<div class="language-shell highlighter-rouge"><div class="highlight"><pre class="highlight"><code>git status
</code></pre></div></div>

<p>This gets the status of the files contained within your project and shows which files have been altered, or “unstaged.”</p>

<div class="language-shell highlighter-rouge"><div class="highlight"><pre class="highlight"><code>git add <span class="nb">.</span>
</code></pre></div></div>

<p>This adds all modified, or “unstaged,” files to the current commit.</p>

<div class="language-shell highlighter-rouge"><div class="highlight"><pre class="highlight"><code>git commit <span class="nt">-am</span> <span class="s2">"This is a message about the code I’m committing"</span>
</code></pre></div></div>

<p>This commits all changes to the repository with a descriptive message saying what’s been changed.</p>

<div class="language-shell highlighter-rouge"><div class="highlight"><pre class="highlight"><code>git merge <span class="nt">--no-ff</span> feature-branch-name
</code></pre></div></div>

<p>Used in branching, this will merge your branch into another trunk.</p>

<div class="language-shell highlighter-rouge"><div class="highlight"><pre class="highlight"><code>git push
</code></pre></div></div>

<p>This pushes the last commit into the repo for others to grab.</p>

<h3 id="thats-a-ton-this-looks-like-command-line-coderight">That’s a ton. This looks like command line code…right?</h3>

<p>Yes! Although you can use Git with a GUI program, it’s faster and easier to use it though a command line program, Git Bash. <a href="https://git-scm.com/downloads"><strong><u>https://git-scm.com/downloads</u></strong></a></p>

<h2 id="getting-started--cloning-a-repo">Getting Started – Cloning a Repo</h2>

<p>Getting started is simple. The first step is to clone the repository.</p>

<div class="language-shell highlighter-rouge"><div class="highlight"><pre class="highlight"><code>git clone https://your_repo_url/your_project_name.git
</code></pre></div></div>

<p>This will copy all files in the repo to your local machine so you can make changes.</p>

<h2 id="the-git-workflow">The Git Workflow</h2>

<h3 id="branching--what-is-that">“Branching” – What is that?</h3>

<p>Branching is a term that will clone the base “trunk” (or Master code version), allowing a developer to make changes. Once all changes have been made, the developer will then commit his code, then merge it into one of two branches: <strong>Master</strong> or <strong>Development</strong>.</p>

<h3 id="why-two-branches">Why two branches?</h3>

<p>Most projects have two environments: <strong>Production</strong> and <strong>Staging</strong>. The <strong>Master</strong> branch reflects code that has been reviewed and is ready to be pushed to <strong>Production</strong>, while code that is ready to be reviewed is merged into <strong>Development</strong>.</p>

<p>Developers should <strong>NEVER</strong> work from the Master branch. Instead, they should check out the branch, pull the latest changes, and then check out a new branch.</p>

<p>You can name your branch whatever you’d like, however it should follow a naming convention and describe what you’re going to be modifying. For example:</p>

<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>hotfix-branch-name
</code></pre></div></div>

<p>This will describe a quick fix – like a spelling error, color change, link style, etc.</p>

<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>feature-branch-name
</code></pre></div></div>

<p>This should be used to describe a new module, feature or other large addition to the code. An example would be adding a new section or adding a new site search.</p>

<h3 id="what-does-a-typical-branching-workflow-look-like">What does a typical branching workflow look like?</h3>

<p>Simple! With branching, making an update couldn’t be easier.</p>

<pre>
git checkout master
git pull git checkout -b feature-add-tracking-scripts
_..make changes.._
git status
git add .
git commit – am “Added tracking scripts to site”
git checkout dev
git pull git merge –no-ff feature-add-tracking-scripts
git push
</pre>

<p>Once this new addition has been approved, simply:</p>
<pre>
git checkout master
git pull git merge –no-ff feature-add-tracking-scripts
git push
</pre>

<h3 id="i-got-a-merge-conflict-what-do-i-do">I got a merge conflict. What do I do?</h3>

<p>These are fairly common when working with multiple branches. This just means there is newer code in the repository than what you have on your machine. Git is intelligent and will tell you which files have conflicts. In our new build lifecycle, most of the time conflicts will arise in the stylesheets or JavaScript files. Simply rebuild and you’re good!</p>

<h2 id="next-steps">Next Steps</h2>

<p><strong><em>No more coding on the fly. No more working directly off the FTP server.</em></strong> If changes are made on the fly or by working directly off the FTP server and are not stored in Git, they will be overwritten the next time a change is made using Git. It is important that once implemented, all changes be run through Git.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#git"
          aria-label="View all posts in category git"
          >git</a
        >
         
        <a
          class="chip"
          href="/tags/#command-line"
          aria-label="View all posts tagged command line"
          >command line</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
github<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Getting Started with GitHub Actions
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Getting Started with GitHub Actions | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Getting Started with GitHub Actions" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="GitHub Actions automates software workflows directly in your repository. You can run tests, build artifacts, deploy apps, and handle repetitive tasks whenever events happen in GitHub." />
<meta property="og:description" content="GitHub Actions automates software workflows directly in your repository. You can run tests, build artifacts, deploy apps, and handle repetitive tasks whenever events happen in GitHub." />
<link rel="canonical" href="https://davidauble.com/blog/2024/02/28/getting-started-github-actions.html" />
<meta property="og:url" content="https://davidauble.com/blog/2024/02/28/getting-started-github-actions.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2024-02-28T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" />
<meta property="twitter:title" content="Getting Started with GitHub Actions" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2024-02-28T00:00:00+00:00","datePublished":"2024-02-28T00:00:00+00:00","description":"GitHub Actions automates software workflows directly in your repository. You can run tests, build artifacts, deploy apps, and handle repetitive tasks whenever events happen in GitHub.","headline":"Getting Started with GitHub Actions","image":"https://davidauble.com/assets/images/posts/pexels-realtoughcandycom-11035544.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2024/02/28/getting-started-github-actions.html"},"url":"https://davidauble.com/blog/2024/02/28/getting-started-github-actions.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>github</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Feb 28, 2024</span
          >
        </div>
        <h1>Getting Started with GitHub Actions</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 3 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>GitHub Actions automates software workflows directly in your repository. You can run tests, build artifacts, deploy apps, and handle repetitive tasks whenever events happen in GitHub.</p>

<p>This quick guide covers the core concepts and a simple workflow you can adapt for your own projects.</p>

<h2 id="what-is-github-actions">What is GitHub Actions?</h2>

<p>GitHub Actions is GitHub’s built-in CI/CD platform. Workflows are defined in YAML and triggered by repository events like pushes, pull requests, and issue activity.</p>

<h2 id="setting-up-a-workflow">Setting up a Workflow</h2>

<p>Create a <code class="language-plaintext highlighter-rouge">.github/workflows</code> directory at the root of your repository, then add a workflow file such as <code class="language-plaintext highlighter-rouge">test.yml</code>.</p>

<p>This example runs tests on pushes and pull requests to the <code class="language-plaintext highlighter-rouge">main</code> branch.</p>

<div class="language-yaml highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="c1"># .github/workflows/test.yml</span>

<span class="na">name</span><span class="pi">:</span> <span class="s">Run Tests</span>

<span class="na">on</span><span class="pi">:</span>
  <span class="na">push</span><span class="pi">:</span>
    <span class="na">branches</span><span class="pi">:</span>
      <span class="pi">-</span> <span class="s">main</span>
  <span class="na">pull_request</span><span class="pi">:</span>
    <span class="na">branches</span><span class="pi">:</span>
      <span class="pi">-</span> <span class="s">main</span>

<span class="na">jobs</span><span class="pi">:</span>
  <span class="na">test</span><span class="pi">:</span>
    <span class="na">runs-on</span><span class="pi">:</span> <span class="s">ubuntu-latest</span>

    <span class="na">steps</span><span class="pi">:</span>
      <span class="pi">-</span> <span class="na">name</span><span class="pi">:</span> <span class="s">Checkout repository</span>
        <span class="na">uses</span><span class="pi">:</span> <span class="s">actions/checkout@v4</span>

      <span class="pi">-</span> <span class="na">name</span><span class="pi">:</span> <span class="s">Set up Node.js</span>
        <span class="na">uses</span><span class="pi">:</span> <span class="s">actions/setup-node@v4</span>
        <span class="na">with</span><span class="pi">:</span>
          <span class="na">node-version</span><span class="pi">:</span> <span class="m">20</span>

      <span class="pi">-</span> <span class="na">name</span><span class="pi">:</span> <span class="s">Install dependencies</span>
        <span class="na">run</span><span class="pi">:</span> <span class="s">npm install</span>

      <span class="pi">-</span> <span class="na">name</span><span class="pi">:</span> <span class="s">Run tests</span>
        <span class="na">run</span><span class="pi">:</span> <span class="s">npm test</span>
</code></pre></div></div>

<p>This workflow defines a <code class="language-plaintext highlighter-rouge">test</code> job on Ubuntu, checks out code, sets up Node.js, installs dependencies, and runs tests. You can replace these steps with commands specific to your stack.</p>

<h2 id="workflow-triggers">Workflow Triggers</h2>

<p>The <code class="language-plaintext highlighter-rouge">on</code> section controls when a workflow runs. In this example it triggers on:</p>

<ul>
  <li>pushes to <code class="language-plaintext highlighter-rouge">main</code></li>
  <li>pull requests targeting <code class="language-plaintext highlighter-rouge">main</code></li>
</ul>

<p>You can also trigger on schedules, tags, releases, and many other events.</p>

<h2 id="actions-marketplace">Actions Marketplace</h2>

<p>The GitHub Marketplace includes many reusable actions for common tasks such as deployments, notifications, linting, and security checks.</p>

<p>For example, you can deploy to GitHub Pages after tests complete:</p>

<div class="language-yaml highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="pi">-</span> <span class="na">name</span><span class="pi">:</span> <span class="s">Deploy to GitHub Pages</span>
  <span class="na">uses</span><span class="pi">:</span> <span class="s">JamesIves/[email protected]</span>
  <span class="na">with</span><span class="pi">:</span>
    <span class="na">branch</span><span class="pi">:</span> <span class="s">gh-pages</span>
    <span class="na">folder</span><span class="pi">:</span> <span class="s">build</span>
</code></pre></div></div>

<p>This action publishes the <code class="language-plaintext highlighter-rouge">build</code> directory to the <code class="language-plaintext highlighter-rouge">gh-pages</code> branch.</p>

<h2 id="monitoring-workflow-runs">Monitoring Workflow Runs</h2>

<p>After pushing changes or opening pull requests, view run history in the repository’s <strong>Actions</strong> tab. Each run includes per-step logs for debugging failed jobs.</p>

<h2 id="conclusion">Conclusion</h2>

<p>GitHub Actions can dramatically improve consistency and speed by automating repetitive work. Start with a small test workflow, then expand into build, release, and deployment pipelines as your process matures.</p>

<p>Once your first workflow is in place, you will have a reliable baseline you can iterate on with each project.</p>

<p><a href="https://www.pexels.com/photo/person-holding-a-black-and-white-paper-with-message-11035544/">Photo by RealToughCandy.com</a></p>

<p><em>This post was generated with the help of AI.</em></p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#github"
          aria-label="View all posts in category github"
          >github</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#development"
          aria-label="View all posts in category development"
          >development</a
        >
         
        <a
          class="chip"
          href="/tags/#github"
          aria-label="View all posts tagged github"
          >github</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2020/09/06/new-job-promotion.html">
        
        <img src="/assets/images/posts/david-auble-manager.jpg" alt="David Auble, Manager" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 06, 2020 · </span
          >
          <h3>David Auble, Manager</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
google<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Embedding Google Maps: 'X-Frame-Options' to 'sameorigin'
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Embedding Google Maps: ‘X-Frame-Options’ to ‘sameorigin’ | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Embedding Google Maps: ‘X-Frame-Options’ to ‘sameorigin’" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="This past week, I came across something odd. I was building a real-estate website for a client and the client requested a Google Maps embed of specific property. Simple, right? Not entirely. I was able to locate the address and embed an iframe dynamically by using the following code:" />
<meta property="og:description" content="This past week, I came across something odd. I was building a real-estate website for a client and the client requested a Google Maps embed of specific property. Simple, right? Not entirely. I was able to locate the address and embed an iframe dynamically by using the following code:" />
<link rel="canonical" href="https://davidauble.com/blog/2017/08/25/embedding-google-maps-x-frame-options-sameorigin.html" />
<meta property="og:url" content="https://davidauble.com/blog/2017/08/25/embedding-google-maps-x-frame-options-sameorigin.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/blog-map.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2017-08-25T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/blog-map.jpg" />
<meta property="twitter:title" content="Embedding Google Maps: ‘X-Frame-Options’ to ‘sameorigin’" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2017-08-25T00:00:00+00:00","datePublished":"2017-08-25T00:00:00+00:00","description":"This past week, I came across something odd. I was building a real-estate website for a client and the client requested a Google Maps embed of specific property. Simple, right? Not entirely. I was able to locate the address and embed an iframe dynamically by using the following code:","headline":"Embedding Google Maps: ‘X-Frame-Options’ to ‘sameorigin’","image":"https://davidauble.com/assets/images/posts/blog-map.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2017/08/25/embedding-google-maps-x-frame-options-sameorigin.html"},"url":"https://davidauble.com/blog/2017/08/25/embedding-google-maps-x-frame-options-sameorigin.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>google</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Aug 25, 2017</span
          >
        </div>
        <h1>Embedding Google Maps: 'X-Frame-Options' to 'sameorigin'</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 1 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/blog-map.jpg" alt="Embedding Google Maps: 'X-Frame-Options' to 'sameorigin'" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>This past week, I came across something odd. I was building a real-estate website for a client and the client requested a Google Maps embed of specific property. Simple, right? Not entirely. I was able to locate the address and embed an iframe dynamically by using the following code:</p>

<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>&lt;iframe width="100%" height="350" frameborder="0" style="border:0" src="http://maps.google.com/?q=&lt;?php echo $address; ?&gt;&amp;output=embed" allowfullscreen&gt;&lt;/iframe&gt;
</code></pre></div></div>

<p>However, when I’d refresh my browser, I kept getting two console errors:</p>

<pre>Refused to display 'https://www.google.com/maps?q=The+Address' in a frame because it set 'X-Frame-Options' to 'sameorigin'.</pre>

<p>and</p>
<pre>Failed to load resource: net::ERR_BLOCKED_BY_RESPONSE</pre>

<p>Hmm.. After some digging though, I found out all I had to do was append <code class="language-plaintext highlighter-rouge">&amp;output=embed</code> at the end of the address and it’d magically work. So, the final embed now looks like this:</p>

<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>&lt;iframe width="100%" height="350" frameborder="0" style="border:0" src="http://maps.google.com/?q=&lt;?php echo $address; ?&gt;&amp;output=embed" allowfullscreen&gt; &lt;/iframe&gt;
</code></pre></div></div>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#google"
          aria-label="View all posts in category google"
          >google</a
        >
         
        <a
          class="chip"
          href="/tags/#google"
          aria-label="View all posts tagged google"
          >google</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      The Panda Effect
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>The Panda Effect | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="The Panda Effect" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="By now, most businesses are implementing some form of basic SEO.  Whether it’s optimizing page titles and structure, or optimizing all pictures, content and folder structure, it’s important to build your site with SEO in mind." />
<meta property="og:description" content="By now, most businesses are implementing some form of basic SEO.  Whether it’s optimizing page titles and structure, or optimizing all pictures, content and folder structure, it’s important to build your site with SEO in mind." />
<link rel="canonical" href="https://davidauble.com/blog/2011/12/06/the-panda-effect.html" />
<meta property="og:url" content="https://davidauble.com/blog/2011/12/06/the-panda-effect.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/panda-1.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2011-12-06T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/panda-1.jpg" />
<meta property="twitter:title" content="The Panda Effect" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2011-12-06T00:00:00+00:00","datePublished":"2011-12-06T00:00:00+00:00","description":"By now, most businesses are implementing some form of basic SEO.  Whether it’s optimizing page titles and structure, or optimizing all pictures, content and folder structure, it’s important to build your site with SEO in mind.","headline":"The Panda Effect","image":"https://davidauble.com/assets/images/posts/panda-1.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2011/12/06/the-panda-effect.html"},"url":"https://davidauble.com/blog/2011/12/06/the-panda-effect.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>seo</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Dec 06, 2011</span
          >
        </div>
        <h1>The Panda Effect</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 3 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/panda-1.jpg" alt="The Panda Effect" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>By now, most businesses are implementing some form of basic SEO.  Whether it’s optimizing page titles and structure, or optimizing all pictures, content and folder structure, it’s important to build your site with SEO in mind.</p>

<p>Most people agree that Google is the leading search engine (by a significant margin).  By receiving over 65% of all search traffic, Google has been busy at work with trying to return the most relevant results as quickly as possible.</p>

<p>Recently, the search engine giant has released their latest version of their algorithm, Panda.  With the release of Panda came a series of changes and new factors that are taken into account when “grading” a website. The Panda release affects nearly 12% of all search results.</p>

<p>Let’s take a look at some of the new factors Panda takes into account when crawling a website.</p>

<ul>
  <li>
    <p><strong>Focus on the basics: UI/UX</strong>
It may sound scary, but Google’s web bots (the Googlebot) are becoming more human-like by “understanding” page layouts.  By taking factors such as bounce rate, time spent on each page and site, page response times and conversion rates, the Googlebot is able to determine if the page contains content that people are actually wanting to view.With this information, the Googlebot is able to make an educated guess as to how people are engaging with your website.</p>
  </li>
  <li>
    <p><strong>Content Quality, Including Spelling</strong>
Something our content writers always ask themselves is “How original is my content?”  It’s no secret that Google has virtually limitless space to store indexes of your content.  Because of this, it’s relatively easy for Google to determine the uniqueness of your content.  Pages with trustworthy and reliable content are favored more by the Googlebots, too.It seems trivial, but you would be surprised at the number of websites that have small spelling and grammar errors.  Googlebots recognize this and actually penalize sites with errors.  By looking through a website’s PageRank, or how reputable the website is, spelling and grammar affect this significantly.</p>
  </li>
  <li>
    <p><strong>Ad Spacing and Layout</strong>
If you’re like me, you probably despise ads.  Googlebots are no different.  If they deem your page to have too many ads, your website may become flagged as a link farm, or may be seen as a page that serves no purpose other than to advertise for other companies. Being flagged as a link farm will severely affect your rankings, as most link farm websites have no real value.</p>
  </li>
  <li>
    <p><strong>Cleanliness of Code</strong>
Any developer will agree that clean code is much easier to manage.  By writing clean code, it’s much easier to ensure your website renders the same way in any browser, regardless if it’s Internet Explorer or Chrome.  By validating your website against the W3C, this is your best ally in making sure everyone and Googlebots can view your website properly.</p>
  </li>
</ul>

<p>The Internet changes constantly. Google recognizes the inevitable changes and continually updates their algorithms.  Panda is the latest big change and certainly won’t be the last. By keeping these tips in mind, a website can please the “Google Gods” and improve its page rank.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#seo"
          aria-label="View all posts in category seo"
          >seo</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#google"
          aria-label="View all posts in category google"
          >google</a
        >
         
        <a
          class="chip"
          href="/tags/#google"
          aria-label="View all posts tagged google"
          >google</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
google analytics<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Increase Page Views with jQuery Tabs and Google Analytics
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Increase Page Views with jQuery Tabs and Google Analytics | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Increase Page Views with jQuery Tabs and Google Analytics" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="If you’re not in e-commerce, I’m sure most of you have seen a decrease in website traffic, due to the holidays.  By now, most web developers use Google Analytics to monitor traffic, keywords and other metrics.  With a combination of Analytics and Webmaster Tools, I’ve been able to increase my web traffic significantly." />
<meta property="og:description" content="If you’re not in e-commerce, I’m sure most of you have seen a decrease in website traffic, due to the holidays.  By now, most web developers use Google Analytics to monitor traffic, keywords and other metrics.  With a combination of Analytics and Webmaster Tools, I’ve been able to increase my web traffic significantly." />
<link rel="canonical" href="https://davidauble.com/blog/2010/12/12/increase-page-views-with-jquery-tabs-and-google-analytics.html" />
<meta property="og:url" content="https://davidauble.com/blog/2010/12/12/increase-page-views-with-jquery-tabs-and-google-analytics.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/computer.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2010-12-12T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/computer.jpg" />
<meta property="twitter:title" content="Increase Page Views with jQuery Tabs and Google Analytics" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2010-12-12T00:00:00+00:00","datePublished":"2010-12-12T00:00:00+00:00","description":"If you’re not in e-commerce, I’m sure most of you have seen a decrease in website traffic, due to the holidays.  By now, most web developers use Google Analytics to monitor traffic, keywords and other metrics.  With a combination of Analytics and Webmaster Tools, I’ve been able to increase my web traffic significantly.","headline":"Increase Page Views with jQuery Tabs and Google Analytics","image":"https://davidauble.com/assets/images/posts/computer.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2010/12/12/increase-page-views-with-jquery-tabs-and-google-analytics.html"},"url":"https://davidauble.com/blog/2010/12/12/increase-page-views-with-jquery-tabs-and-google-analytics.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>javascript</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Dec 12, 2010</span
          >
        </div>
        <h1>Increase Page Views with jQuery Tabs and Google Analytics</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 1 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/computer.jpg" alt="Increase Page Views with jQuery Tabs and Google Analytics" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>If you’re not in e-commerce, I’m sure most of you have seen a decrease in website traffic, due to the holidays.  By now, most web developers use <a href="http://www.google.com/analytics" target="_blank">Google Analytics</a> to monitor traffic, keywords and other metrics.  With a combination of Analytics and Webmaster Tools, I’ve been able to increase my web traffic significantly.</p>

<p>One thing I noticed however, was when I started implementing <a href="http://jqueryui.com/demos/tabs/" target="_blank">jQuery Tabs</a> into a website, I noticed that my overall traffic was decreasing slightly, and I began to wonder which pages were being viewed most.  Turns out, with the help of a coworker and <a href="http://code.google.com/apis/analytics/docs/tracking/asyncTracking.html">asynchronous code from Google</a>, we’ve been able to track “tab views”.</p>

<p>I present.. the code:</p>

<pre>
$(document).ready(function () {
  if ($("#tabs").length != 0){
    $("#tabs").bind("tabsselect",function(event,ui) {
      _gaq.push(['_trackPageview', window.location.pathname + '/' + ui.tab.innerHTML]);
    });
  }
});
</pre>

<p>With this code, it will check to see if you have tabs, and if you’ve selected a tab, it feeds another page view into Google.</p>

<p>The output you will see in Google will be similar to: www.yourpage.com/about, with individual records for each tab title on the current page.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#javascript"
          aria-label="View all posts in category javascript"
          >javascript</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#google-analytics"
          aria-label="View all posts in category google analytics"
          >google analytics</a
        >
         
        <a
          class="chip"
          href="/tags/#javascript"
          aria-label="View all posts tagged javascript"
          >javascript</a
        >
        
        <a
          class="chip"
          href="/tags/#google"
          aria-label="View all posts tagged google"
          >google</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
iis<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Edit Robots.txt with WordPress and Yoast
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Edit Robots.txt with WordPress and Yoast | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Edit Robots.txt with WordPress and Yoast" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="An interesting project came my way this week at work and took some digging to resolve. Each website utilizes a file called a robots.txt file that helps point search engine bots what areas of your site to crawl and which to ignore. This helps the bots crawl your site and help it appear on search engines and can impact your search rankings." />
<meta property="og:description" content="An interesting project came my way this week at work and took some digging to resolve. Each website utilizes a file called a robots.txt file that helps point search engine bots what areas of your site to crawl and which to ignore. This helps the bots crawl your site and help it appear on search engines and can impact your search rankings." />
<link rel="canonical" href="https://davidauble.com/blog/2020/04/14/edit-robots-txt-wordpress-yoast.html" />
<meta property="og:url" content="https://davidauble.com/blog/2020/04/14/edit-robots-txt-wordpress-yoast.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/robots.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2020-04-14T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/robots.jpg" />
<meta property="twitter:title" content="Edit Robots.txt with WordPress and Yoast" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2020-04-14T00:00:00+00:00","datePublished":"2020-04-14T00:00:00+00:00","description":"An interesting project came my way this week at work and took some digging to resolve. Each website utilizes a file called a robots.txt file that helps point search engine bots what areas of your site to crawl and which to ignore. This helps the bots crawl your site and help it appear on search engines and can impact your search rankings.","headline":"Edit Robots.txt with WordPress and Yoast","image":"https://davidauble.com/assets/images/posts/robots.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2020/04/14/edit-robots-txt-wordpress-yoast.html"},"url":"https://davidauble.com/blog/2020/04/14/edit-robots-txt-wordpress-yoast.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Apr 14, 2020</span
          >
        </div>
        <h1>Edit Robots.txt with WordPress and Yoast</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 2 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/robots.jpg" alt="Edit Robots.txt with WordPress and Yoast" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>An interesting project came my way this week at work and took some digging to resolve. Each website utilizes a file called a <code class="language-plaintext highlighter-rouge">robots.txt</code> file that helps point search engine bots what areas of your site to crawl and which to ignore. This helps the bots crawl your site and help it appear on search engines and can impact your search rankings.</p>

<p>We’ve been using Yoast SEO for our primary SEO plugin on all of our sites for quite some time and albeit it buggy and <a href="https://yoast.com/media-attachment-urls/" target="_blank">catastrophic at times</a>, however for the most part, it is the best SEO plugin available for WordPress.</p>

<p>Anyway, I was given the task to update the <code class="language-plaintext highlighter-rouge">robots.txt</code> file on each site to include a link to the sitemap.xml file, generated by Yoast. I immediately thought to check the site’s primary directory, but didn’t see a text file in that location. I then checked the built-in file editor in WordPress, but came up blank, as it only allowed me to edit template files. Hmm..</p>

<p>Oh, for some background, each of our websites is set up using the <a href="https://wordpress.org/support/article/glossary/#multisite" target="_blank">Multisite</a> feature in WordPress. Each site in the network has its own set of options with Yoast and has an area to update the <code class="language-plaintext highlighter-rouge">robots.txt</code>. However, that option has been removed and I wasn’t able to find which version of Yoast removed that option.</p>

<p>Finally, after digging much further, I was able to find that in the Network Admin area, another Yoast Options page exists. From here, you have the option to click <em>Edit Files</em>, which allows you to generate and modify the <code class="language-plaintext highlighter-rouge">robots.txt</code> file from within WordPress. Finally! Below are the steps I took to solve this problem.</p>

<ol>
  <li>Click on Network Admin -&gt; Dashboard<br />
<img src="/assets/images/posts/network-admin.jpg" alt="Clicking on Network Admin, followed by Dashboard link" /></li>
  <li>Hover over the Yoast SEO options and click Edit Files<br />
<img src="/assets/images/posts/seo-edit-files.jpg" alt="Click on Yoast SEO, Edit Files" /></li>
  <li>Edit robots.txt<br />
<img src="/assets/images/posts/edit-robots.jpg" alt="Edit robots.txt text input" /></li>
</ol>

<p><strong>Note</strong> If a robots.txt file does not exist, in the current verion of WordPress, 5.4, clicking the “Generate robots.txt” button will redirect you to a page that has HTML markup not being rendered. Simply click the browser’s back button and refresh the page. You will then see the edit text area as seen above.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#apache"
          aria-label="View all posts in category apache"
          >apache</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#iis"
          aria-label="View all posts in category iis"
          >iis</a
        >
         
        <a
          class="chip"
          href="/tags/#seo"
          aria-label="View all posts tagged seo"
          >seo</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
javascript<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Get Page URL via JavaScript
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Get Page URL via JavaScript | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Get Page URL via JavaScript" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="I come across this problem frequently and yet for some reason, can never remember how to get the URL of the current page via JavaScript." />
<meta property="og:description" content="I come across this problem frequently and yet for some reason, can never remember how to get the URL of the current page via JavaScript." />
<link rel="canonical" href="https://davidauble.com/blog/2017/10/20/get-page-url-via-javascript.html" />
<meta property="og:url" content="https://davidauble.com/blog/2017/10/20/get-page-url-via-javascript.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/new-code.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2017-10-20T14:37:04+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/new-code.jpg" />
<meta property="twitter:title" content="Get Page URL via JavaScript" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2017-10-20T14:37:04+00:00","datePublished":"2017-10-20T14:37:04+00:00","description":"I come across this problem frequently and yet for some reason, can never remember how to get the URL of the current page via JavaScript.","headline":"Get Page URL via JavaScript","image":"https://davidauble.com/assets/images/posts/new-code.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2017/10/20/get-page-url-via-javascript.html"},"url":"https://davidauble.com/blog/2017/10/20/get-page-url-via-javascript.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>javascript</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Oct 20, 2017</span
          >
        </div>
        <h1>Get Page URL via JavaScript</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 2 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/new-code.jpg" alt="Get Page URL via JavaScript" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>I come across this problem frequently and yet for some reason, can never remember how to get the URL of the current page via JavaScript.</p>

<p>At my job, we have several lead-generating sites that have opt-in forms to gather information. Each form has several hidden inputs that specify program names, information, thank you page URLs, etc. Sometimes, I have to change thank you URLs based on a selected value. I usually handle this in JavaScript, when I validate the form.</p>

<p>Since all of our sites are on HTTPS now and my local machine is not, I find it best to grab the protocol, domain and then follow with a trailing slash, that way I only have to specify the thank you page. I also don’t have to change the code from HTTP to HTTPS based on the local, dev and production environments.</p>

<p>First, let’s look at the location property of the window object:</p>
<pre>location = {
  host: "stackoverflow.com",
  hostname: "stackoverflow.com",
  href: "http://stackoverflow.com/questions/2300771/jquery-domain-get-url",
  pathname: "/questions/2300771/jquery-domain-get-url",
  port: "",
  protocol: "http:"
}</pre>

<p>We’ll want to grab the “protocol” and “host” for the current page:</p>
<pre>var $url = window.location.protocol + "//" + window.location.host + "/" + "thank-you/";
console.log("URL: " + $url);</pre>

<p>And voila! Thanks to <a href="https://stackoverflow.com/questions/2300771/jquery-domain-get-url" target="_blank">this Stackoverflow post</a> for helping with this solution.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#javascript"
          aria-label="View all posts in category javascript"
          >javascript</a
        >
         
        <a
          class="chip"
          href="/tags/#javascript"
          aria-label="View all posts tagged javascript"
          >javascript</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Increase Page Views with jQuery Tabs and Google Analytics
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Increase Page Views with jQuery Tabs and Google Analytics | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Increase Page Views with jQuery Tabs and Google Analytics" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="If you’re not in e-commerce, I’m sure most of you have seen a decrease in website traffic, due to the holidays.  By now, most web developers use Google Analytics to monitor traffic, keywords and other metrics.  With a combination of Analytics and Webmaster Tools, I’ve been able to increase my web traffic significantly." />
<meta property="og:description" content="If you’re not in e-commerce, I’m sure most of you have seen a decrease in website traffic, due to the holidays.  By now, most web developers use Google Analytics to monitor traffic, keywords and other metrics.  With a combination of Analytics and Webmaster Tools, I’ve been able to increase my web traffic significantly." />
<link rel="canonical" href="https://davidauble.com/blog/2010/12/12/increase-page-views-with-jquery-tabs-and-google-analytics.html" />
<meta property="og:url" content="https://davidauble.com/blog/2010/12/12/increase-page-views-with-jquery-tabs-and-google-analytics.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/computer.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2010-12-12T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/computer.jpg" />
<meta property="twitter:title" content="Increase Page Views with jQuery Tabs and Google Analytics" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2010-12-12T00:00:00+00:00","datePublished":"2010-12-12T00:00:00+00:00","description":"If you’re not in e-commerce, I’m sure most of you have seen a decrease in website traffic, due to the holidays.  By now, most web developers use Google Analytics to monitor traffic, keywords and other metrics.  With a combination of Analytics and Webmaster Tools, I’ve been able to increase my web traffic significantly.","headline":"Increase Page Views with jQuery Tabs and Google Analytics","image":"https://davidauble.com/assets/images/posts/computer.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2010/12/12/increase-page-views-with-jquery-tabs-and-google-analytics.html"},"url":"https://davidauble.com/blog/2010/12/12/increase-page-views-with-jquery-tabs-and-google-analytics.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>javascript</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Dec 12, 2010</span
          >
        </div>
        <h1>Increase Page Views with jQuery Tabs and Google Analytics</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 1 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/computer.jpg" alt="Increase Page Views with jQuery Tabs and Google Analytics" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>If you’re not in e-commerce, I’m sure most of you have seen a decrease in website traffic, due to the holidays.  By now, most web developers use <a href="http://www.google.com/analytics" target="_blank">Google Analytics</a> to monitor traffic, keywords and other metrics.  With a combination of Analytics and Webmaster Tools, I’ve been able to increase my web traffic significantly.</p>

<p>One thing I noticed however, was when I started implementing <a href="http://jqueryui.com/demos/tabs/" target="_blank">jQuery Tabs</a> into a website, I noticed that my overall traffic was decreasing slightly, and I began to wonder which pages were being viewed most.  Turns out, with the help of a coworker and <a href="http://code.google.com/apis/analytics/docs/tracking/asyncTracking.html">asynchronous code from Google</a>, we’ve been able to track “tab views”.</p>

<p>I present.. the code:</p>

<pre>
$(document).ready(function () {
  if ($("#tabs").length != 0){
    $("#tabs").bind("tabsselect",function(event,ui) {
      _gaq.push(['_trackPageview', window.location.pathname + '/' + ui.tab.innerHTML]);
    });
  }
});
</pre>

<p>With this code, it will check to see if you have tabs, and if you’ve selected a tab, it feeds another page view into Google.</p>

<p>The output you will see in Google will be similar to: www.yourpage.com/about, with individual records for each tab title on the current page.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#javascript"
          aria-label="View all posts in category javascript"
          >javascript</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#google-analytics"
          aria-label="View all posts in category google analytics"
          >google analytics</a
        >
         
        <a
          class="chip"
          href="/tags/#javascript"
          aria-label="View all posts tagged javascript"
          >javascript</a
        >
        
        <a
          class="chip"
          href="/tags/#google"
          aria-label="View all posts tagged google"
          >google</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
jekyll<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Getting Jekyll Running on Windows 10 x64
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Getting Jekyll Running on Windows 10 x64 | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Getting Jekyll Running on Windows 10 x64" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="I use a Mac and a PC equally and want to be able to work on projects regardless of development environment. As mentioned previously, I’ve converted my site over to Jekyll. It works well on both systems, but when I went to install it on my PC, I ran into the following issue:" />
<meta property="og:description" content="I use a Mac and a PC equally and want to be able to work on projects regardless of development environment. As mentioned previously, I’ve converted my site over to Jekyll. It works well on both systems, but when I went to install it on my PC, I ran into the following issue:" />
<link rel="canonical" href="https://davidauble.com/blog/2020/04/19/jekyll-on-windows.html" />
<meta property="og:url" content="https://davidauble.com/blog/2020/04/19/jekyll-on-windows.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/page-speed-insights.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2020-04-19T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/page-speed-insights.jpg" />
<meta property="twitter:title" content="Getting Jekyll Running on Windows 10 x64" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2020-04-19T00:00:00+00:00","datePublished":"2020-04-19T00:00:00+00:00","description":"I use a Mac and a PC equally and want to be able to work on projects regardless of development environment. As mentioned previously, I’ve converted my site over to Jekyll. It works well on both systems, but when I went to install it on my PC, I ran into the following issue:","headline":"Getting Jekyll Running on Windows 10 x64","image":"https://davidauble.com/assets/images/posts/page-speed-insights.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2020/04/19/jekyll-on-windows.html"},"url":"https://davidauble.com/blog/2020/04/19/jekyll-on-windows.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>jekyll</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Apr 19, 2020</span
          >
        </div>
        <h1>Getting Jekyll Running on Windows 10 x64</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 1 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/page-speed-insights.jpg" alt="Getting Jekyll Running on Windows 10 x64" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>I use a Mac and a PC equally and want to be able to work on projects regardless of development environment. As mentioned <a href="/2020/04/10/2020-blog-update.html">previously</a>, I’ve converted my site over to Jekyll. It works well on both systems, but when I went to install it on my PC, I ran into the following issue:</p>

<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>Unable to load the EventMachine C extension; To use the pure-ruby reactor, require 'em/pure_ruby'
</code></pre></div></div>

<p>Puzzled, I scoured Google and StackOverflow and came up empty. I thought <a href="https://stackoverflow.com/questions/30682575/unable-to-load-the-eventmachine-c-extension-to-use-the-pure-ruby-reactor" target="_blank">this post on StackOverflow</a> would help get me there, but I ended up back at the same spot.</p>

<p>After a while, I finally started looking into different flags I could use to run with these commands. I finally figured out a solution - force the uninstall of <code class="language-plaintext highlighter-rouge">eventmachine</code> and reinstall it using the Ruby platform. Voila! All set!</p>

<p>Here’s the final steps I used to fix this problem:</p>

<div class="language-shell highlighter-rouge"><div class="highlight"><pre class="highlight"><code>bundle
gem uninstall eventmachine <span class="nt">--force</span>
gem <span class="nb">install </span>eventmachine <span class="nt">--platform</span> ruby
</code></pre></div></div>



      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#jekyll"
          aria-label="View all posts in category jekyll"
          >jekyll</a
        >
         
        <a
          class="chip"
          href="/tags/#command-line"
          aria-label="View all posts tagged command line"
          >command line</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
modern web<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Three Reasons You Should Ditch Image Sliders
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Three Reasons You Should Ditch Image Sliders | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Three Reasons You Should Ditch Image Sliders" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Carousels, sliders and rotating banners – chances are you’ve heard one or more of these terms before. Image carousels can be found on nearly any news site, online store or informational site with one goal in mind: force-feed the user as much content as possible, as soon as they land on your site." />
<meta property="og:description" content="Carousels, sliders and rotating banners – chances are you’ve heard one or more of these terms before. Image carousels can be found on nearly any news site, online store or informational site with one goal in mind: force-feed the user as much content as possible, as soon as they land on your site." />
<link rel="canonical" href="https://davidauble.com/blog/2015/01/16/three-reasons-you-should-ditch-image-sliders.html" />
<meta property="og:url" content="https://davidauble.com/blog/2015/01/16/three-reasons-you-should-ditch-image-sliders.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/carousel.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2015-01-16T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/carousel.jpg" />
<meta property="twitter:title" content="Three Reasons You Should Ditch Image Sliders" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2015-01-16T00:00:00+00:00","datePublished":"2015-01-16T00:00:00+00:00","description":"Carousels, sliders and rotating banners – chances are you’ve heard one or more of these terms before. Image carousels can be found on nearly any news site, online store or informational site with one goal in mind: force-feed the user as much content as possible, as soon as they land on your site.","headline":"Three Reasons You Should Ditch Image Sliders","image":"https://davidauble.com/assets/images/posts/carousel.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2015/01/16/three-reasons-you-should-ditch-image-sliders.html"},"url":"https://davidauble.com/blog/2015/01/16/three-reasons-you-should-ditch-image-sliders.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>carousel</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jan 16, 2015</span
          >
        </div>
        <h1>Three Reasons You Should Ditch Image Sliders</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 3 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/carousel.jpg" alt="Three Reasons You Should Ditch Image Sliders" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p><a href="http://ux.stackexchange.com/questions/13951/what-is-the-difference-between-a-slider-a-gallery-and-a-carousel" target="_blank">Carousels, sliders and rotating banners</a> – chances are you’ve heard one or more of these terms before. Image carousels can be found on nearly any news site, online store or informational site with one goal in mind: force-feed the user as much content as possible, as soon as they land on your site.</p>

<p>The concept of image sliders dates back several years to when JavaScript started booming. Image sliders were a great way to show users multiple promotions or features while freeing up page space. Once they started gaining momentum, online retailers began using them to showcase their weekly promotions, similar to a weekly insert in the Sunday paper.</p>

<p>Now, image sliders are overused and oftentimes ignored by the consumer. Here are a few reasons why customers aren’t paying attention:</p>

<ul>
  <li><strong>Automatic rotation</strong> Most image sliders have multiple slides that automatically rotate when users land on the site. For example, <a href="http://www.ikea.com/us/en/">IKEA</a> currently has four promotions in their image slider, which includes an auto-rotate feature. A recent study conducted on the <a href="http://www.nngroup.com/articles/auto-forwarding/">usability</a> of image sliders by Neilson Norman group confirmed that auto-forwarding sliders annoy users and reduce visibility of your messages.</li>
  <li><strong>Increased site load time</strong> Typically, users will need to load jQuery (and a slider script) in order to display a carousel, which will increase your page loading time. Additionally, sites may have large, high-resolution banners, which also add to the page-load time. Carousels add <a href="http://chrislema.com/comparing-premium-sliders-for-wordpress-by-performance/">between .4  and five seconds</a> to your page-load time. Keep in mind, <a href="http://www.lauradhamilton.com/5-quick-and-easy-seo-tips">Google incorporates page speeds into search engine rankings</a>, so if your site is slow, you’re going to be punished.</li>
  <li><strong>Negative impacts on your SEO and conversion rates</strong> Basic SEO practices state that there should be only one h1 tag per page and it should appear before any other heading tag. The problem with using h1 or any heading tag in an image carousel is that every time the slide changes, the h1 tag changes. A page with five slides in the carousel will have five h1 tags, which greatly devalues keyword relevance.</li>
</ul>

<p>​A 2013 study at the University of Notre Dame was conducted on the <a href="http://weedygarden.net/2013/01/carousel-stats/" target="_blank">efficiency of image carousels</a> and revealed that only one percent of three million site visitors clicked on a carousel’s featured image.</p>

<p>Too many messages oftentimes equal no message to consumers. Sometimes, slides on image sliders are so fast that people are not able to finish reading them. Check out these sites below that allow the user to be in control of the content they are viewing:</p>

<ul>
  <li><a href="https://www.mint.com/" target="_blank">Mint</a> does a good job of breaking things down and hiding nothing.</li>
  <li><a href="http://www.bensherman.com/" target="_blank">Ben Sherman</a> has one promotion up front; that’s it.</li>
  <li><a href="http://www.nike.com/us/en_us/?ref=https%3A%2F%2Fwww.google.com%2F" target="_blank">Nike</a> does a good job of sticking to their upcoming events and focusing on one campaign at a time.</li>
</ul>

<p>Keep your website timely without becoming a promotion hoarder. You don’t need to hold onto everything you’ve ever promoted; every campaign has a shelf life. When considering alternatives to image sliders, here are a few points to keep in mind:</p>

<ul>
  <li>Maintain one message. Yes, it’s possible – focus!</li>
  <li>Organize key points in the layout on level of importance.</li>
  <li>Give the user more control by disabling auto rotate carousels.</li>
  <li>Limit or simplify the amount of sliders if you use a slideshow.</li>
</ul>

<p>Before you make a big decision on how to direct your users, consider your customer and the experience first, and do it right. Measure, adjust, rinse and repeat.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#carousel"
          aria-label="View all posts in category carousel"
          >carousel</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#seo"
          aria-label="View all posts in category seo"
          >seo</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#modern-web"
          aria-label="View all posts in category modern web"
          >modern web</a
        >
         
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Why It's Time to Update Your Browser
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Why It’s Time to Update Your Browser | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Why It’s Time to Update Your Browser" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="This is the excerpt" />
<meta property="og:description" content="This is the excerpt" />
<link rel="canonical" href="https://davidauble.com/blog/2012/04/23/why-its-time-to-update-your-browser.html" />
<meta property="og:url" content="https://davidauble.com/blog/2012/04/23/why-its-time-to-update-your-browser.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/update-browser.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2012-04-23T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/update-browser.jpg" />
<meta property="twitter:title" content="Why It’s Time to Update Your Browser" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2012-04-23T00:00:00+00:00","datePublished":"2012-04-23T00:00:00+00:00","description":"This is the excerpt","headline":"Why It’s Time to Update Your Browser","image":"https://davidauble.com/assets/images/posts/update-browser.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2012/04/23/why-its-time-to-update-your-browser.html"},"url":"https://davidauble.com/blog/2012/04/23/why-its-time-to-update-your-browser.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>rwd</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Apr 23, 2012</span
          >
        </div>
        <h1>Why It's Time to Update Your Browser</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 3 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/update-browser.jpg" alt="Why It's Time to Update Your Browser" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>Let me start with a little profanity: Internet Explorer.  Okay, so maybe it’s not the type of profanity you were initially thinking, but in the Internet world, Internet Explorer is one of the foulest, most cruel phrases anyone could say.  Why? Simple.  It’s terrible mainly due to its inability to follow simple web standards and user basics.</p>

<p>I will be fair though, with the release of IE 9, Microsoft has finally begun listening to consumers and web developers alike, by releasing software that follows web standards a bit more strictly. The only new problem we, web developers, face are people who don’t, or simply refuse to update.</p>

<p>Not using Internet Explorer? I’d like to give you a high five.  In case you’ve been living in Windows98 for the past several years, companies such as Apple, Google and Mozilla have made great strides in building better browsers to best Microsoft’s.</p>

<p>It wasn’t until IE9 that Internet Explorer finally supported HTML5.  Google Chrome, Mozilla Firefox and Apple’s Safari have been supporting it since 2009, whereas IE was two years behind.</p>

<p>HTML5 support isn’t the only reason to update your browser, though.  Recent improvements Apple, Google and Mozilla have been implementing are hardware acceleration, user preference and bookmark sync features, as well as faster rendering for the jQuery JavaScript library, which can be found on most websites.</p>

<p>Here are a few other reasons you should update your browser:\n</p>

<ul>
  <li>
    <p><strong>Security updates</strong> – Most releases usually have some form of security updates, whether it’s dealing with SSL, HTTPS or other small operating system related fixes</p>
  </li>
  <li>
    <p><strong>A better web experience</strong> – Take a look at <a href="&quot;http://www.dowebsitesneedtobeexperiencedexactlythesameineverybrowser.com/&quot;" target="_blank">http://dowebsitesneedtobeexperiencedexactlythesameineverybrowser.com/ </a>Crazy URL, but hover over the word you see. Do you see a black background with white text?  How about a blue and purple backgrounds?  Do the words appear differently?</p>
  </li>
  <li>
    <p><strong>Themes</strong> – Everyone likes a little personalization and customization, right?  Why not break away from the typical gray/sandy colors and jazz up your browser with a new theme?</p>
  </li>
  <li>
    <p><strong>HTML5/CSS3</strong> – Animations are no longer confined to Flash.  With CSS3, animations and transitions are fully supported, speeding up webpage load times.</p>
  </li>
  <li>
    <p><strong>I’m a happier person</strong> – Building a website to look aesthetically pleasing in a browser takes time.  Making it work in IE7 requires a lot more time.  In fact, it usually requires the use of its own stylesheet, just to make web pages appear correctly.</p>
  </li>
  <li>
    <p><strong>Beautiful interfaces</strong> – Currently, everywhere you look, advertisements and pictures are using color gradients to make products more visually appealing.  With modern browsers, creating beautiful websites is much, much easier and doesn’t require the use of hundreds of images.</p>
  </li>
</ul>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#rwd"
          aria-label="View all posts in category rwd"
          >rwd</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#modern-web"
          aria-label="View all posts in category modern web"
          >modern web</a
        >
         
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
mysql<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Run WordPress Multi-Site On localhost
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Run WordPress Multi-Site On localhost | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Run WordPress Multi-Site On localhost" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="This is something I have wanted to write about for quite some time. Part of my process involves three environments: local, staging, and production. Most of the sites I build are straightforward single-site setups with a few custom touches. At work, however, I manage several WordPress multisite networks." />
<meta property="og:description" content="This is something I have wanted to write about for quite some time. Part of my process involves three environments: local, staging, and production. Most of the sites I build are straightforward single-site setups with a few custom touches. At work, however, I manage several WordPress multisite networks." />
<link rel="canonical" href="https://davidauble.com/blog/2017/11/17/run-wordpress-multi-site-localhost.html" />
<meta property="og:url" content="https://davidauble.com/blog/2017/11/17/run-wordpress-multi-site-localhost.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/common-code.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2017-11-17T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/common-code.jpg" />
<meta property="twitter:title" content="Run WordPress Multi-Site On localhost" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2017-11-17T00:00:00+00:00","datePublished":"2017-11-17T00:00:00+00:00","description":"This is something I have wanted to write about for quite some time. Part of my process involves three environments: local, staging, and production. Most of the sites I build are straightforward single-site setups with a few custom touches. At work, however, I manage several WordPress multisite networks.","headline":"Run WordPress Multi-Site On localhost","image":"https://davidauble.com/assets/images/posts/common-code.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2017/11/17/run-wordpress-multi-site-localhost.html"},"url":"https://davidauble.com/blog/2017/11/17/run-wordpress-multi-site-localhost.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Nov 17, 2017</span
          >
        </div>
        <h1>Run WordPress Multi-Site On localhost</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 2 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/common-code.jpg" alt="Run WordPress Multi-Site On localhost" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>This is something I have wanted to write about for quite some time. Part of my process involves three environments: local, staging, and production. Most of the sites I build are straightforward single-site setups with a few custom touches. At work, however, I manage several WordPress multisite networks.</p>

<p>If you need a primer, start with the <a href="https://codex.wordpress.org/Create_A_Network" target="_blank">WordPress multisite documentation</a>. For this walkthrough, assume you are taking over an existing multisite with one main site and two subsites, and your local domain is <code class="language-plaintext highlighter-rouge">http://demo.local</code>.</p>

<h2 id="modifying-tables">Modifying Tables</h2>

<p>After importing your database locally, update values in these tables:</p>

<ul>
  <li><code class="language-plaintext highlighter-rouge">wp_[site-id]_options</code></li>
  <li><code class="language-plaintext highlighter-rouge">wp_blogs</code></li>
  <li><code class="language-plaintext highlighter-rouge">wp_options</code></li>
  <li><code class="language-plaintext highlighter-rouge">wp_site</code></li>
  <li><code class="language-plaintext highlighter-rouge">wp_sitemeta</code></li>
</ul>

<h3 id="wp_site-id_options">wp_[site-id]_options</h3>

<p>You will likely have several of these tables, one per site ID in the Network admin. Update the <code class="language-plaintext highlighter-rouge">siteurl</code> and <code class="language-plaintext highlighter-rouge">home</code> values to <code class="language-plaintext highlighter-rouge">http://demo.local</code>.</p>

<h3 id="wp_blogs">wp_blogs</h3>

<p>Change each row in the <code class="language-plaintext highlighter-rouge">domain</code> column to <code class="language-plaintext highlighter-rouge">demo.local</code>.</p>

<h3 id="wp_options">wp_options</h3>

<p>Like <code class="language-plaintext highlighter-rouge">wp_blogs</code>, update the <code class="language-plaintext highlighter-rouge">siteurl</code> and <code class="language-plaintext highlighter-rouge">home</code> values to <code class="language-plaintext highlighter-rouge">http://demo.local</code>.</p>

<h3 id="wp_site">wp_site</h3>

<p>Like <code class="language-plaintext highlighter-rouge">wp_blogs</code>, update each row in the <code class="language-plaintext highlighter-rouge">domain</code> column to <code class="language-plaintext highlighter-rouge">demo.local</code>.</p>

<h3 id="wp_sitemeta">wp_sitemeta</h3>

<p>Finally, there is one more value that can cause issues. In <code class="language-plaintext highlighter-rouge">wp_sitemeta</code>, find the <code class="language-plaintext highlighter-rouge">siteurl</code> entry and set it to <code class="language-plaintext highlighter-rouge">http://demo.local</code>.</p>

<p>That is it. Clear your local browser cache, then log in to the WordPress admin as usual.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#mysql"
          aria-label="View all posts in category mysql"
          >mysql</a
        >
         
        <a
          class="chip"
          href="/tags/#phpmyadmin"
          aria-label="View all posts tagged phpmyadmin"
          >phpmyadmin</a
        >
        
        <a
          class="chip"
          href="/tags/#wamp"
          aria-label="View all posts tagged wamp"
          >wamp</a
        >
        
        <a
          class="chip"
          href="/tags/#mamp"
          aria-label="View all posts tagged mamp"
          >mamp</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
pagination<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Custom Pagination in WordPress
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Custom Pagination in WordPress | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Custom Pagination in WordPress" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="A while ago I was having troubles with the built-in pagination in WordPress and started looking for alternative solutions. I didn’t want to use a plugin, since I wanted it to work across the board – work with blog posts, search results, taxonomies, etc. I stumbled upon this custom method from WPBeginner and gave it a shot. It worked brilliantly. After a few months though, I started noticing a problem – it wasn’t pulling the correct number of total pages, resulting in paged pages with zero results. I ended up looking into the code and have modified it for my needs. Feel free to use this – simply drop this into your functions.php file, then call it in your code with:" />
<meta property="og:description" content="A while ago I was having troubles with the built-in pagination in WordPress and started looking for alternative solutions. I didn’t want to use a plugin, since I wanted it to work across the board – work with blog posts, search results, taxonomies, etc. I stumbled upon this custom method from WPBeginner and gave it a shot. It worked brilliantly. After a few months though, I started noticing a problem – it wasn’t pulling the correct number of total pages, resulting in paged pages with zero results. I ended up looking into the code and have modified it for my needs. Feel free to use this – simply drop this into your functions.php file, then call it in your code with:" />
<link rel="canonical" href="https://davidauble.com/blog/2018/02/14/custom-pagination-wordpress.html" />
<meta property="og:url" content="https://davidauble.com/blog/2018/02/14/custom-pagination-wordpress.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/blog-banner-compressor.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2018-02-14T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/blog-banner-compressor.jpg" />
<meta property="twitter:title" content="Custom Pagination in WordPress" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2018-02-14T00:00:00+00:00","datePublished":"2018-02-14T00:00:00+00:00","description":"A while ago I was having troubles with the built-in pagination in WordPress and started looking for alternative solutions. I didn’t want to use a plugin, since I wanted it to work across the board – work with blog posts, search results, taxonomies, etc. I stumbled upon this custom method from WPBeginner and gave it a shot. It worked brilliantly. After a few months though, I started noticing a problem – it wasn’t pulling the correct number of total pages, resulting in paged pages with zero results. I ended up looking into the code and have modified it for my needs. Feel free to use this – simply drop this into your functions.php file, then call it in your code with:","headline":"Custom Pagination in WordPress","image":"https://davidauble.com/assets/images/posts/blog-banner-compressor.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2018/02/14/custom-pagination-wordpress.html"},"url":"https://davidauble.com/blog/2018/02/14/custom-pagination-wordpress.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Feb 14, 2018</span
          >
        </div>
        <h1>Custom Pagination in WordPress</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 2 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/blog-banner-compressor.jpg" alt="Custom Pagination in WordPress" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>A while ago I was having troubles with the built-in pagination in WordPress and started looking for alternative solutions. I didn’t want to use a plugin, since I wanted it to work across the board – work with blog posts, search results, taxonomies, etc. I stumbled upon this <a href="http://www.wpbeginner.com/wp-themes/how-to-add-numeric-pagination-in-your-wordpress-theme/" target="_blank">custom method from WPBeginner</a> and gave it a shot. It worked brilliantly. After a few months though, I started noticing a problem – it wasn’t pulling the correct number of total pages, resulting in paged pages with zero results. I ended up looking into the code and have modified it for my needs. Feel free to use this – simply drop this into your <strong>functions.php </strong>file, then call it in your code with:</p>

<p><code class="language-plaintext highlighter-rouge">&lt;?php wpbeginner_numeric_posts_nav(); ?&gt;</code></p>

<p>  Here’s the code:</p>

<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>function wpbeginner_numeric_posts_nav() {

    if( is_singular() )
        return;

    global $wp_query;

    if( $wp_query-&gt;max_num_pages &lt;= 1 )
        return;

    $paged = get_query_var( 'paged' ) ? absint( get_query_var( 'paged' ) ) : 1;
    $max   = intval( $wp_query-&gt;posts-&gt;max_num_pages );

    if ( $paged &gt;= 1 )
        $links[] = $paged;

    if ( $paged &gt;= 3 ) {
        $links[] = $paged - 1;
        $links[] = $paged - 2;
    }

    if ( ( $paged + 2 ) &lt;= $max ) {
        $links[] = $paged + 2;
        $links[] = $paged + 1;
    }

    echo '&lt;div class="navigation"&gt;&lt;ul&gt;' . "\n";

    if ( get_previous_posts_link() )
        printf( '&lt;li&gt;%s&lt;/li&gt;' . "\n", get_previous_posts_link('&amp;laquo; Previous Page', $max) );

    if ( ! in_array( 1, $links ) ) {
        $class = 1 == $paged ? ' class="active"' : '';

        printf( '&lt;li&gt;&lt;a href="%s"&gt;%s&lt;/a&gt;&lt;/li&gt;' . "\n", $class, esc_url( get_pagenum_link( 1 ) ), '1' );

        if ( ! in_array( 2, $links ) )
            echo '&lt;li&gt;…&lt;/li&gt;';
    }

    sort( $links );
    foreach ( (array) $links as $link ) {
        $class = $paged == $link ? ' class="active"' : '';
        printf( '&lt;li&gt;&lt;a href="%s"&gt;%s&lt;/a&gt;&lt;/li&gt;' . "\n", $class, esc_url( get_pagenum_link( $link ) ), $link );
    }

    if ( ! in_array( $max, $links ) ) {
        if ( ! in_array( $max - 1, $links ) )
            echo '&lt;li&gt;…&lt;/li&gt;' . "\n";

        $class = $paged == $max ? ' class="active"' : '';
        printf( '&lt;li&gt;&lt;a href="%s"&gt;%s&lt;/a&gt;&lt;/li&gt;' . "\n", $class, esc_url( get_pagenum_link( $max ) ), $max );
    }

    if ( get_next_posts_link() )
        printf( '&lt;li&gt;%s&lt;/li&gt;' . "\n", get_next_posts_link('Next Page &amp;raquo;', $max) );

    echo '&lt;/ul&gt;&lt;/div&gt;' . "\n";
  }
</code></pre></div></div>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#pagination"
          aria-label="View all posts in category pagination"
          >pagination</a
        >
         
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
php<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Using PHP to Determine Server Protocol
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Using PHP to Determine Server Protocol | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Using PHP to Determine Server Protocol" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="For various projects I build, I always have three environments: local, staging and production. On my staging and production environments, I have HTTPS enabled, but to keep things simple, I never set up HTTPS on my local environment. A lot of sites I build require forms that redirect the user to a thank you page, once the data is sent and processed to Salesforce. The redirect though requires an absolute path, so I cannot use something like “/contact/thank-you/”. To accomplish this, I use this simple line in PHP to display the appropriate protocol, regardless of dev environment." />
<meta property="og:description" content="For various projects I build, I always have three environments: local, staging and production. On my staging and production environments, I have HTTPS enabled, but to keep things simple, I never set up HTTPS on my local environment. A lot of sites I build require forms that redirect the user to a thank you page, once the data is sent and processed to Salesforce. The redirect though requires an absolute path, so I cannot use something like “/contact/thank-you/”. To accomplish this, I use this simple line in PHP to display the appropriate protocol, regardless of dev environment." />
<link rel="canonical" href="https://davidauble.com/blog/2018/11/05/using-php-to-determine-server-protocol.html" />
<meta property="og:url" content="https://davidauble.com/blog/2018/11/05/using-php-to-determine-server-protocol.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/new-code.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2018-11-05T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/new-code.jpg" />
<meta property="twitter:title" content="Using PHP to Determine Server Protocol" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2018-11-05T00:00:00+00:00","datePublished":"2018-11-05T00:00:00+00:00","description":"For various projects I build, I always have three environments: local, staging and production. On my staging and production environments, I have HTTPS enabled, but to keep things simple, I never set up HTTPS on my local environment. A lot of sites I build require forms that redirect the user to a thank you page, once the data is sent and processed to Salesforce. The redirect though requires an absolute path, so I cannot use something like “/contact/thank-you/”. To accomplish this, I use this simple line in PHP to display the appropriate protocol, regardless of dev environment.","headline":"Using PHP to Determine Server Protocol","image":"https://davidauble.com/assets/images/posts/new-code.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2018/11/05/using-php-to-determine-server-protocol.html"},"url":"https://davidauble.com/blog/2018/11/05/using-php-to-determine-server-protocol.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>php</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Nov 05, 2018</span
          >
        </div>
        <h1>Using PHP to Determine Server Protocol</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 1 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/new-code.jpg" alt="Using PHP to Determine Server Protocol" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>For various projects I build, I always have three environments: local, staging and production. On my staging and production environments, I have HTTPS enabled, but to keep things simple, I never set up HTTPS on my local environment. A lot of sites I build require forms that redirect the user to a thank you page, once the data is sent and processed to Salesforce. The redirect though requires an absolute path, so I cannot use something like “/contact/thank-you/”. To accomplish this, I use this simple line in PHP to display the appropriate protocol, regardless of dev environment.</p>

<pre>$protocol = (!empty($_SERVER['HTTPS']) &amp;&amp; $_SERVER['HTTPS'] !== 'off' || $_SERVER['SERVER_PORT'] == 443) ? "https://" : "http://";
                $page_url = $protocol . $_SERVER["SERVER_NAME"] . $_SERVER["REQUEST_URI"];</pre>

<p>Then, in the form’s retURL hidden input, I echo out the page URL:</p>

<p><code class="language-plaintext highlighter-rouge">&lt;input type="text" name="00NC00000067ygp" id="00NC00000067ygp" value="&lt;?php echo $page_url; ?&gt;"&gt;</code></p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#php"
          aria-label="View all posts in category php"
          >php</a
        >
         
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Displaying Dates as Strings with PHP's sqlsrv_connect()
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Displaying Dates as Strings with PHP’s sqlsrv_connect() | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Displaying Dates as Strings with PHP’s sqlsrv_connect()" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Over the last few weeks I’ve been working on a web application that allows me to track how website leads are performing at work. In building this app, I’m interacting with MySQL and SQL Server databases together and using PHP as my language of choice." />
<meta property="og:description" content="Over the last few weeks I’ve been working on a web application that allows me to track how website leads are performing at work. In building this app, I’m interacting with MySQL and SQL Server databases together and using PHP as my language of choice." />
<link rel="canonical" href="https://davidauble.com/blog/2018/01/16/displaying-dates-strings-phps-sqlsrv_connect.html" />
<meta property="og:url" content="https://davidauble.com/blog/2018/01/16/displaying-dates-strings-phps-sqlsrv_connect.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/sqlservconnect.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2018-01-16T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/sqlservconnect.jpg" />
<meta property="twitter:title" content="Displaying Dates as Strings with PHP’s sqlsrv_connect()" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2018-01-16T00:00:00+00:00","datePublished":"2018-01-16T00:00:00+00:00","description":"Over the last few weeks I’ve been working on a web application that allows me to track how website leads are performing at work. In building this app, I’m interacting with MySQL and SQL Server databases together and using PHP as my language of choice.","headline":"Displaying Dates as Strings with PHP’s sqlsrv_connect()","image":"https://davidauble.com/assets/images/posts/sqlservconnect.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2018/01/16/displaying-dates-strings-phps-sqlsrv_connect.html"},"url":"https://davidauble.com/blog/2018/01/16/displaying-dates-strings-phps-sqlsrv_connect.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>sql server</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jan 16, 2018</span
          >
        </div>
        <h1>Displaying Dates as Strings with PHP's sqlsrv_connect()</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 2 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/sqlservconnect.jpg" alt="Displaying Dates as Strings with PHP's sqlsrv_connect()" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>Over the last few weeks I’ve been working on a web application that allows me to track how website leads are performing at work. In building this app, I’m interacting with MySQL and SQL Server databases together and using PHP as my language of choice.</p>

<p>I’ve recently run into a problem with DateTime fields and how MySQL and SQL Server handle them differently. MySQL uses Epoch time, whereas SQL Server uses a more readable format, such as 1900-01-01 00:00:00. The problem I was running into was display a result set, saving it into an array and printing the array’s contents into a CSV file. I kept running into an error:</p>

<pre>Fatal error: Cannot use object of type DateTime as array</pre>

<p>When I printed out the array’s contents, I kept discovering my array looked like this:</p>

<pre>[0] =&gt; Value
                [1] =&gt; Value2
                [2] =&gt; Value3
                DateTime Object
                (
                    [date] =&gt; 2017-12-29 11:54:00.000000
                    [timezone_type] =&gt; 3
                    [timezone] =&gt; UTC
                )</pre>

<p>Puzzled, I was turning to Google, thinking I’d have to check each index of the array to determine if it’s a string or object. Neither was working.</p>

<p>I started looking at my SQL Server connection string and double checked the documentation for the sqlsrv_connect() method I am using, wondering if there were extra parameters I could use. Through who knows how many searches I finally landed on a <a href="https://docs.microsoft.com/en-us/sql/connect/php/how-to-retrieve-date-and-time-type-as-strings-using-the-sqlsrv-driver" target="_blank">Microsoft page which outlined the SQLSRV driver</a>. In the first example, I learned there IS an extra param I can use that will output all DateTime objects as strings!</p>

<p>To do so, simply add the following to your sqlsrv_connect() database parameters and SQL Server will start returning all DateTime fields as strings.</p>

<pre>'ReturnDatesAsStrings'=&gt;true</pre>

<p>Finally, here’s my new connection string:</p>

<pre>$this-&gt;conn = sqlsrv_connect($this-&gt;sql_server, array( "Database" =&gt; $this-&gt;sql_name, 'ReturnDatesAsStrings' =&gt; true));</pre>

<p>Good luck!</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#sql-server"
          aria-label="View all posts in category sql server"
          >sql server</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#php"
          aria-label="View all posts in category php"
          >php</a
        >
         
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Adding Related Posts in WordPress Without a Plugin
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Adding Related Posts in WordPress Without a Plugin | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Adding Related Posts in WordPress Without a Plugin" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="This past week I had yet another challenge: add related posts to a blog entry and make it match a design. It seemed straightforward, especially since all the blog posts are organized by category. As I dug deeper, I realized it wasn’t going to be as simple as I’d originally thought." />
<meta property="og:description" content="This past week I had yet another challenge: add related posts to a blog entry and make it match a design. It seemed straightforward, especially since all the blog posts are organized by category. As I dug deeper, I realized it wasn’t going to be as simple as I’d originally thought." />
<link rel="canonical" href="https://davidauble.com/blog/2017/10/27/adding-related-posts-wordpress-without-plugin.html" />
<meta property="og:url" content="https://davidauble.com/blog/2017/10/27/adding-related-posts-wordpress-without-plugin.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/related-posts.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2017-10-27T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/related-posts.jpg" />
<meta property="twitter:title" content="Adding Related Posts in WordPress Without a Plugin" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2017-10-27T00:00:00+00:00","datePublished":"2017-10-27T00:00:00+00:00","description":"This past week I had yet another challenge: add related posts to a blog entry and make it match a design. It seemed straightforward, especially since all the blog posts are organized by category. As I dug deeper, I realized it wasn’t going to be as simple as I’d originally thought.","headline":"Adding Related Posts in WordPress Without a Plugin","image":"https://davidauble.com/assets/images/posts/related-posts.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2017/10/27/adding-related-posts-wordpress-without-plugin.html"},"url":"https://davidauble.com/blog/2017/10/27/adding-related-posts-wordpress-without-plugin.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Oct 27, 2017</span
          >
        </div>
        <h1>Adding Related Posts in WordPress Without a Plugin</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 2 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/related-posts.jpg" alt="Adding Related Posts in WordPress Without a Plugin" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>This past week I had yet another challenge: add related posts to a blog entry and make it match a design. It seemed straightforward, especially since all the blog posts are organized by category. As I dug deeper, I realized it wasn’t going to be as simple as I’d originally thought.</p>

<p>Let me preface this post by saying <strong>I don’t like using unnecessary WordPress plugins. </strong>I’d much rather build something from scratch that doesn’t have limitations from a plugin. There are times when plugins are necessary, sure, but I’d much rather have something that doesn’t need to be updated constantly or be limited to a plugin’s design.</p>

<p>I should preface this with there are two ways of doing this: display related posts by <strong>tags </strong>and by <strong>categories</strong>. I’ll first demonstrate by displaying related posts by tags. I feel this is the better way to show related posts. <em>Let’s assume this will be going on your default single.php page.</em></p>

<h2 id="related-posts-by-tags">Related Posts by Tags</h2>
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>&lt;div class="related-posts"&gt;
  &lt;?php
    $tags = wp_get_post_tags($post-&gt;ID);

    if ($tags):
      $first_tag = $tags[0]-&gt;term_id;

      $args = array(
        'tag__in' =&gt; array($first_tag),
        'post__not_in' =&gt; array($post-&gt;ID),
        'posts_per_page' =&gt; 2,
        'caller_get_posts' =&gt; 1,
        'orderby' =&gt; 'rand'
      );

      $posts = new WP_Query($args);
  ?&gt;

      &lt;?php if($posts-&gt;have_posts()): while($posts-&gt;have_posts()): $posts-&gt;the_post(); ?&gt;

        &lt;div class="related-posts__post"&gt;
          &lt;a href="&lt;?php the_permalink(); ?&gt;"&gt;
            &lt;?php $image = wp_get_attachment_image_src(get_post_thumbnail_id($post-&gt;ID), 'medium'); ?&gt;
            &lt;img src="&lt;?php echo $image[0]; ?&gt;" alt="" class=""&gt;

            &lt;span class="related-posts__post--title"&gt;&lt;?php the_title(); ?&gt;&lt;/span&gt;
          &lt;/a&gt;
        &lt;/div&gt;

      &lt;?php endwhile; endif; wp_reset_query(); ?&gt;

  &lt;?php endif; ?&gt;
&lt;/div&gt;
</code></pre></div></div>

<h2 id="related-posts-by-categories">Related Posts by Categories</h2>
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>&lt;div class="related-posts"&gt;
  &lt;?php
    $tags = wp_get_post_categories($post-&gt;ID);

    if ($tags):
      $args = array(
        'current_category' =&gt; $tags,
        'orderby' =&gt; 'rand',
        'posts_per_page' =&gt; 2
      );

      $posts = new WP_Query($args);
      while ($posts-&gt;have_posts()): $posts-&gt;the_post();
  ?&gt;
      &lt;div class="related-posts__post"&gt;
        &lt;a href="&lt;?php the_permalink(); ?&gt;" class="related-posts__post--link"&gt;
          &lt;span class="related-posts__post--link--wrap"&gt;
            &lt;span class="related-posts__post--link--wrap__overlay"&gt;&lt;/span&gt;

            &lt;?php $image = wp_get_attachment_image_src(get_post_thumbnail_id($post-&gt;ID), 'blog_image'); ?&gt;
            &lt;img src="&lt;?php echo $image[0]; ?&gt;" alt="" class="related-posts__post--link--image"&gt;

            &lt;span class="btn btn-secondary"&gt;Read More&lt;/span&gt;
          &lt;/span&gt;
          &lt;h4&gt;&lt;?php the_title(); ?&gt;&lt;/h4&gt;
        &lt;/a&gt;
      &lt;/div&gt;
    &lt;?php endwhile; ?&gt;
  &lt;?php wp_reset_query(); endif; ?&gt;
&lt;/div&gt;
</code></pre></div></div>

<p>And voila! I hope this helps.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#categories"
          aria-label="View all posts in category categories"
          >categories</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#tags"
          aria-label="View all posts in category tags"
          >tags</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#php"
          aria-label="View all posts in category php"
          >php</a
        >
         
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Get WordPress Multisite Table Prefix
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Get WordPress Multisite Table Prefix | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Get WordPress Multisite Table Prefix" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="A while ago I wrote my first plugin for WordPress. It requires the creation of a table, encrypting some data, saving it to a WP table, then finally pushing clean data to Salesforce. Somewhat straightforward, but I learned a lot." />
<meta property="og:description" content="A while ago I wrote my first plugin for WordPress. It requires the creation of a table, encrypting some data, saving it to a WP table, then finally pushing clean data to Salesforce. Somewhat straightforward, but I learned a lot." />
<link rel="canonical" href="https://davidauble.com/blog/2017/08/09/get-wordpress-multisite-table-prefix.html" />
<meta property="og:url" content="https://davidauble.com/blog/2017/08/09/get-wordpress-multisite-table-prefix.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/blog-banner.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2017-08-09T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/blog-banner.jpg" />
<meta property="twitter:title" content="Get WordPress Multisite Table Prefix" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2017-08-09T00:00:00+00:00","datePublished":"2017-08-09T00:00:00+00:00","description":"A while ago I wrote my first plugin for WordPress. It requires the creation of a table, encrypting some data, saving it to a WP table, then finally pushing clean data to Salesforce. Somewhat straightforward, but I learned a lot.","headline":"Get WordPress Multisite Table Prefix","image":"https://davidauble.com/assets/images/posts/blog-banner.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2017/08/09/get-wordpress-multisite-table-prefix.html"},"url":"https://davidauble.com/blog/2017/08/09/get-wordpress-multisite-table-prefix.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Aug 09, 2017</span
          >
        </div>
        <h1>Get WordPress Multisite Table Prefix</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 1 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/blog-banner.jpg" alt="Get WordPress Multisite Table Prefix" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>A while ago I wrote my first plugin for WordPress. It requires the creation of a table, encrypting some data, saving it to a WP table, then finally pushing clean data to Salesforce. Somewhat straightforward, but I learned a lot.</p>

<p>In starting to integrate the plugin to all our sites, I noticed an issue: none of the data was being displayed in my admin panel. After making sure the data was being sent properly, I checked phpMyAdmin to see if the data was actually saved to the database. Sure enough, it was there. Hmm..</p>

<p>Then it dawned on me. When dealing with a single WordPress site, the database structure ALWAYS follows what you’ve set up in the wp-config.php file. With Multisite though, WordPress adds the site ID between the table prefix and the table name.</p>

<p>Since my plugin can be accessed from any of the microsites, it wasn’t important that each microsite had it’s own table. I then looked at the WordPress documentation and noticed this gem:</p>

<pre>$wpdb-&gt;base_prefix;</pre>

<p>This will grab the table prefix outlined in the wp-config.php file, not just the current site’s table prefix. Once I changed this, voila! My entries started appearing.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#php"
          aria-label="View all posts in category php"
          >php</a
        >
         
        <a
          class="chip"
          href="/tags/#mysql"
          aria-label="View all posts tagged mysql"
          >mysql</a
        >
        
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      How To: Remove Extra Tags from WordPress WYSIWYG Editor
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>How To: Remove Extra Tags from WordPress WYSIWYG Editor | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="How To: Remove Extra Tags from WordPress WYSIWYG Editor" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="From time to time, I find WordPress’ built-in WYSIWYG editor annoying. If you’ve dealt with it much, you know it adds formatting tags around every new line of text. Usually these don’t bother me, as I want my text to be wrapped in paragraph tags or similar. However, for the times I want to extract ONLY the content and not the tags, here’s an easy way to strip all tags from WordPress. Just a word of caution though, these will strip the tags from ALL of your templates." />
<meta property="og:description" content="From time to time, I find WordPress’ built-in WYSIWYG editor annoying. If you’ve dealt with it much, you know it adds formatting tags around every new line of text. Usually these don’t bother me, as I want my text to be wrapped in paragraph tags or similar. However, for the times I want to extract ONLY the content and not the tags, here’s an easy way to strip all tags from WordPress. Just a word of caution though, these will strip the tags from ALL of your templates." />
<link rel="canonical" href="https://davidauble.com/blog/2017/03/30/how-to-remove-extra-tags-from-wordpress-wysiwyg-editor.html" />
<meta property="og:url" content="https://davidauble.com/blog/2017/03/30/how-to-remove-extra-tags-from-wordpress-wysiwyg-editor.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/computer.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2017-03-30T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/computer.jpg" />
<meta property="twitter:title" content="How To: Remove Extra Tags from WordPress WYSIWYG Editor" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2017-03-30T00:00:00+00:00","datePublished":"2017-03-30T00:00:00+00:00","description":"From time to time, I find WordPress’ built-in WYSIWYG editor annoying. If you’ve dealt with it much, you know it adds formatting tags around every new line of text. Usually these don’t bother me, as I want my text to be wrapped in paragraph tags or similar. However, for the times I want to extract ONLY the content and not the tags, here’s an easy way to strip all tags from WordPress. Just a word of caution though, these will strip the tags from ALL of your templates.","headline":"How To: Remove Extra Tags from WordPress WYSIWYG Editor","image":"https://davidauble.com/assets/images/posts/computer.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2017/03/30/how-to-remove-extra-tags-from-wordpress-wysiwyg-editor.html"},"url":"https://davidauble.com/blog/2017/03/30/how-to-remove-extra-tags-from-wordpress-wysiwyg-editor.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Mar 30, 2017</span
          >
        </div>
        <h1>How To: Remove Extra Tags from WordPress WYSIWYG Editor</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 1 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/computer.jpg" alt="How To: Remove Extra Tags from WordPress WYSIWYG Editor" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>From time to time, I find WordPress’ built-in WYSIWYG editor annoying. If you’ve dealt with it much, you know it adds formatting tags around every new line of text. Usually these don’t bother me, as I want my text to be wrapped in paragraph tags or similar. However, for the times I want to extract ONLY the content and not the tags, here’s an easy way to strip all tags from WordPress. Just a word of caution though, these will strip the tags from ALL of your templates.</p>

<p>Add any of these lines to your <strong>functions.php</strong> file.</p>

<p>The Excerpt:</p>

<pre>remove_filter ('the_exceprt', 'wpautop');</pre>

<p>The Content:</p>

<pre>remove_filter ('the_content', 'wpautop');</pre>

<p>All Paragraph tags:</p>

<pre>remove_filter('term_description','wpautop');</pre>

<p>Or, my personal favorite, use functions native to WordPress anywhere in your templates: The Excerpt:</p>

<p><code class="language-plaintext highlighter-rouge">&lt;?php echo get_the_excerpt(); ?&gt;</code></p>

<p>The Content:</p>

<p><code class="language-plaintext highlighter-rouge">&lt;?php echo get_the_content(); ?&gt;</code></p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#php"
          aria-label="View all posts in category php"
          >php</a
        >
         
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
projects<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Parking Assistant: An Arduino-based Program to Help You Park
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Parking Assistant: An Arduino-based Program to Help You Park | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Parking Assistant: An Arduino-based Program to Help You Park" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="For Christmas this past year I finally got something I’ve been wanting for a little while: an Arduino controller and small electronics kit. I’ve had several ideas of little projects, but have never had the time or parts to start working on them. Over the last several weeks though, I’ve been playing with them and have come up with a few projects." />
<meta property="og:description" content="For Christmas this past year I finally got something I’ve been wanting for a little while: an Arduino controller and small electronics kit. I’ve had several ideas of little projects, but have never had the time or parts to start working on them. Over the last several weeks though, I’ve been playing with them and have come up with a few projects." />
<link rel="canonical" href="https://davidauble.com/blog/2018/02/23/parking-assistant-arduino-based-program-help-park.html" />
<meta property="og:url" content="https://davidauble.com/blog/2018/02/23/parking-assistant-arduino-based-program-help-park.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/parking-assistant.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2018-02-23T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/parking-assistant.jpg" />
<meta property="twitter:title" content="Parking Assistant: An Arduino-based Program to Help You Park" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2018-02-23T00:00:00+00:00","datePublished":"2018-02-23T00:00:00+00:00","description":"For Christmas this past year I finally got something I’ve been wanting for a little while: an Arduino controller and small electronics kit. I’ve had several ideas of little projects, but have never had the time or parts to start working on them. Over the last several weeks though, I’ve been playing with them and have come up with a few projects.","headline":"Parking Assistant: An Arduino-based Program to Help You Park","image":"https://davidauble.com/assets/images/posts/parking-assistant.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2018/02/23/parking-assistant-arduino-based-program-help-park.html"},"url":"https://davidauble.com/blog/2018/02/23/parking-assistant-arduino-based-program-help-park.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>arduino</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Feb 23, 2018</span
          >
        </div>
        <h1>Parking Assistant: An Arduino-based Program to Help You Park</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 2 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/parking-assistant.jpg" alt="Parking Assistant: An Arduino-based Program to Help You Park" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>For Christmas this past year I finally got something I’ve been wanting for a little while: an Arduino controller and small electronics kit. I’ve had several ideas of little projects, but have never had the time or parts to start working on them. Over the last several weeks though, I’ve been playing with them and have come up with a few projects.</p>

<p>My first project was a simple thermometer and humidity gauge. It worked well and was accurate (within reason) and it ignited a spark for other projects. I got to thinking about what else I could build, then it hit me: how about a parking assistant?</p>

<p>We’re looking at getting another car and instead of using a 2”x4” block of wood, why not use my technical skills and make something cool. Something to annoy my wife. Enter Parking Assistant.</p>

<p><a href="http://www.youtube.com/watch?v=WnKiokYo1i4" title="Video Title" target="_blank"><img src="http://img.youtube.com/vi/WnKiokYo1i4/0.jpg" alt="IMAGE ALT TEXT" /></a></p>

<p>This is just a simple project that uses an ultrasonic sensor to determine the range from an object and then display the appropriate color on the matrix. If you get too close though, it displays a flashing red “X” on the matrix.</p>

<p>The next steps will be to work on power consumption so I can use it in the garage and run it off either standard electricity or just keep it battery powered for now. We’ll see.</p>

<p>If you want to play around with it, be sure to check it the <a href="https://github.com/dauble/Parking-Assistant" target="_blank">Parking Assistant GitHub project</a>. Feel free to use it and change it how you want.</p>

<p><strong>Update (3/18/2018): </strong>
I started noticing that the ultrasonic sensors were receiving input a little too frequently, so updated the code to get the average of five distances, then display that as the distance. This allows it to be more accurate, as it was sending additional triggers before it was receiving the echos, causing invalid ranges.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#arduino"
          aria-label="View all posts in category arduino"
          >arduino</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#projects"
          aria-label="View all posts in category projects"
          >projects</a
        >
         
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
relevanssi<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Improving WordPress Search Results with Relevanssi
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Improving WordPress Search Results with Relevanssi | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Improving WordPress Search Results with Relevanssi" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="I’ve been managing 17 WordPress sites for the past few years and one thing I’ve noticed is the default search built into WordPress isn’t flexible and doesn’t always return the most accurate results. I use Advanced Custom Fields heavily for each of the sites and have noticed the default search doesn’t search into these fields; it only searches titles and what’s in the page’s main content box. Since most of the pages on our sites don’t use those, I needed to find a better option." />
<meta property="og:description" content="I’ve been managing 17 WordPress sites for the past few years and one thing I’ve noticed is the default search built into WordPress isn’t flexible and doesn’t always return the most accurate results. I use Advanced Custom Fields heavily for each of the sites and have noticed the default search doesn’t search into these fields; it only searches titles and what’s in the page’s main content box. Since most of the pages on our sites don’t use those, I needed to find a better option." />
<link rel="canonical" href="https://davidauble.com/blog/2019/03/05/improving-wordpress-search-results-with-relevanssi.html" />
<meta property="og:url" content="https://davidauble.com/blog/2019/03/05/improving-wordpress-search-results-with-relevanssi.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/relevanssi-search.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2019-03-05T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/relevanssi-search.jpg" />
<meta property="twitter:title" content="Improving WordPress Search Results with Relevanssi" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2019-03-05T00:00:00+00:00","datePublished":"2019-03-05T00:00:00+00:00","description":"I’ve been managing 17 WordPress sites for the past few years and one thing I’ve noticed is the default search built into WordPress isn’t flexible and doesn’t always return the most accurate results. I use Advanced Custom Fields heavily for each of the sites and have noticed the default search doesn’t search into these fields; it only searches titles and what’s in the page’s main content box. Since most of the pages on our sites don’t use those, I needed to find a better option.","headline":"Improving WordPress Search Results with Relevanssi","image":"https://davidauble.com/assets/images/posts/relevanssi-search.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2019/03/05/improving-wordpress-search-results-with-relevanssi.html"},"url":"https://davidauble.com/blog/2019/03/05/improving-wordpress-search-results-with-relevanssi.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Mar 05, 2019</span
          >
        </div>
        <h1>Improving WordPress Search Results with Relevanssi</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 3 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/relevanssi-search.jpg" alt="Improving WordPress Search Results with Relevanssi" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>I’ve been managing 17 WordPress sites for the past few years and one thing I’ve noticed is the default search built into WordPress isn’t flexible and doesn’t always return the most accurate results. I use Advanced Custom Fields heavily for each of the sites and have noticed the default search doesn’t search into these fields; it only searches titles and what’s in the page’s main content box. Since most of the pages on our sites don’t use those, I needed to find a better option.</p>

<p>I looked into managed search solutions such as Algolia and Elasticsearch, but for my needs, those went above and beyond, not to mention were costly. I looked at other WordPress plugins, but since I use the Multisite feature on each site, almost none of the plugins were able to search across the WordPress network. Then I came across <a href="https://www.relevanssi.com/" target="_blank">Relevanssi</a>. Relevanssi offers two versions, free and paid, and promises to look into ACF fields and give more flexibility on searches. It allows me to add custom weights to titles, body fields, custom post types, add synonyms for related words, offers “Did you mean ___?” functionality and best of all, searches across a WordPress network.</p>

<p>After playing around with several settings, I was able to get the search results displaying nearly how I wanted. My two criteria were to have Pages appear above Posts, and to only display Posts newer than the previous two years. To do this though, I had to add some additional customization to my functions.php file. Luckily, the Relevanssi documentation is extremely helpful and detailed, plus the plugin author replies to each comment on support document pages.</p>

<p>Here’s what I ended up with in my functions.php file to display Pages above Posts, then return results newer than two years:</p>

<pre>
add_filter('relevanssi_hits_filter', 'products_first');
  function products_first($hits) {
    $types = array();

    $types['page'] = array();
    $types['post'] = array();

    // Split the post types in array $types
    if (!empty($hits)) {
      foreach ($hits[0] as $hit) {

        $date_cutoff = date('Y-m-d h:i:s', strtotime('-2 years'));
        if($hit-&gt;post_date &gt; $date_cutoff &amp;&amp; $hit-&gt;post_type == 'post') {
          array_push($types[$hit-&gt;post_type], $hit);
        }

        if($hit-&gt;post_type == 'page') {
          array_push($types[$hit-&gt;post_type], $hit);
        }
      }
    }

    // Merge back to $hits in the desired order
    $hits[0] = array_merge($types['page'], $types['post']);
    return $hits;
  }
</pre>

<p>I also noticed that sometimes, plural versions of words weren’t displaying properly either. Sometimes searching for “car” would return different results than “cars.” To get around this, I added a bit more code, found directly from the <a href="https://www.relevanssi.com/knowledge-base/simple-french-plurals/">documentation</a>:</p>

<pre>add_filter( 'relevanssi_stemmer', 'relevanssi_french_plural_stemmer' );
    function relevanssi_french_plural_stemmer( $term ) {
      $len  = strlen( $term );
      $end1 = substr( $term, -1, 1 );

      if ( 's' === $end1 &amp;&amp; $len &gt; 3 ) {
        $term = substr( $term, 0, -1 );
      } elseif ( 'x' === $end1 &amp;&amp; $len &gt; 3 ) {
        $term = substr( $term, 0, -1 );
      }

      return $term;
    }</pre>

<p>I couldn’t be happier with this plugin and hope it solves any problems you might have.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#relevanssi"
          aria-label="View all posts in category relevanssi"
          >relevanssi</a
        >
         
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
rwd<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Why Click Events Don't Work in Safari
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Why Click Events Don’t Work in Safari | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Why Click Events Don’t Work in Safari" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Over the last few months I’ve been working on a weather dashboard with the goal of developing it into my first mobile app." />
<meta property="og:description" content="Over the last few months I’ve been working on a weather dashboard with the goal of developing it into my first mobile app." />
<link rel="canonical" href="https://davidauble.com/blog/2018/01/29/why-click-events-dont-work-in-safari.html" />
<meta property="og:url" content="https://davidauble.com/blog/2018/01/29/why-click-events-dont-work-in-safari.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/cup-of-coffee-laptop-office-macbook-89786.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2018-01-29T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/cup-of-coffee-laptop-office-macbook-89786.jpg" />
<meta property="twitter:title" content="Why Click Events Don’t Work in Safari" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2018-01-29T00:00:00+00:00","datePublished":"2018-01-29T00:00:00+00:00","description":"Over the last few months I’ve been working on a weather dashboard with the goal of developing it into my first mobile app.","headline":"Why Click Events Don’t Work in Safari","image":"https://davidauble.com/assets/images/posts/cup-of-coffee-laptop-office-macbook-89786.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2018/01/29/why-click-events-dont-work-in-safari.html"},"url":"https://davidauble.com/blog/2018/01/29/why-click-events-dont-work-in-safari.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>css</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jan 29, 2018</span
          >
        </div>
        <h1>Why Click Events Don't Work in Safari</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 1 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/cup-of-coffee-laptop-office-macbook-89786.jpg" alt="Why Click Events Don't Work in Safari" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>Over the last few months I’ve been working on a weather dashboard with the goal of developing it into my first mobile app.</p>

<p>One of the features I’ve added has been a pull-out menu, which displays additional information that won’t fit on the primary screen. It’s been working in all the browsers except Safari mobile. I’m pulling a lot of data asynchronously, so several items don’t appear in the DOM when the page is loaded. Because of this, I was having to target click events in the following way:</p>

<pre>$(document).on('click', '.js-menu-cog', function() {
                   $('.js-menu').fadeIn('fast').addClass('active');
                });</pre>

<p>It was working in all browsers yet again, Safari was being problematic. Finally, I remember reading an article years ago about Safari not reading elements as buttons unless they had the cursor: pointer CSS property applied.</p>

<p>Once I added the cursor: pointer style to my button, it started working!</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#css"
          aria-label="View all posts in category css"
          >css</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#safari"
          aria-label="View all posts in category safari"
          >safari</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#rwd"
          aria-label="View all posts in category rwd"
          >rwd</a
        >
         
        <a
          class="chip"
          href="/tags/#browsers"
          aria-label="View all posts tagged browsers"
          >browsers</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Why It's Time to Update Your Browser
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Why It’s Time to Update Your Browser | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Why It’s Time to Update Your Browser" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="This is the excerpt" />
<meta property="og:description" content="This is the excerpt" />
<link rel="canonical" href="https://davidauble.com/blog/2012/04/23/why-its-time-to-update-your-browser.html" />
<meta property="og:url" content="https://davidauble.com/blog/2012/04/23/why-its-time-to-update-your-browser.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/update-browser.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2012-04-23T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/update-browser.jpg" />
<meta property="twitter:title" content="Why It’s Time to Update Your Browser" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2012-04-23T00:00:00+00:00","datePublished":"2012-04-23T00:00:00+00:00","description":"This is the excerpt","headline":"Why It’s Time to Update Your Browser","image":"https://davidauble.com/assets/images/posts/update-browser.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2012/04/23/why-its-time-to-update-your-browser.html"},"url":"https://davidauble.com/blog/2012/04/23/why-its-time-to-update-your-browser.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>rwd</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Apr 23, 2012</span
          >
        </div>
        <h1>Why It's Time to Update Your Browser</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 3 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/update-browser.jpg" alt="Why It's Time to Update Your Browser" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>Let me start with a little profanity: Internet Explorer.  Okay, so maybe it’s not the type of profanity you were initially thinking, but in the Internet world, Internet Explorer is one of the foulest, most cruel phrases anyone could say.  Why? Simple.  It’s terrible mainly due to its inability to follow simple web standards and user basics.</p>

<p>I will be fair though, with the release of IE 9, Microsoft has finally begun listening to consumers and web developers alike, by releasing software that follows web standards a bit more strictly. The only new problem we, web developers, face are people who don’t, or simply refuse to update.</p>

<p>Not using Internet Explorer? I’d like to give you a high five.  In case you’ve been living in Windows98 for the past several years, companies such as Apple, Google and Mozilla have made great strides in building better browsers to best Microsoft’s.</p>

<p>It wasn’t until IE9 that Internet Explorer finally supported HTML5.  Google Chrome, Mozilla Firefox and Apple’s Safari have been supporting it since 2009, whereas IE was two years behind.</p>

<p>HTML5 support isn’t the only reason to update your browser, though.  Recent improvements Apple, Google and Mozilla have been implementing are hardware acceleration, user preference and bookmark sync features, as well as faster rendering for the jQuery JavaScript library, which can be found on most websites.</p>

<p>Here are a few other reasons you should update your browser:\n</p>

<ul>
  <li>
    <p><strong>Security updates</strong> – Most releases usually have some form of security updates, whether it’s dealing with SSL, HTTPS or other small operating system related fixes</p>
  </li>
  <li>
    <p><strong>A better web experience</strong> – Take a look at <a href="&quot;http://www.dowebsitesneedtobeexperiencedexactlythesameineverybrowser.com/&quot;" target="_blank">http://dowebsitesneedtobeexperiencedexactlythesameineverybrowser.com/ </a>Crazy URL, but hover over the word you see. Do you see a black background with white text?  How about a blue and purple backgrounds?  Do the words appear differently?</p>
  </li>
  <li>
    <p><strong>Themes</strong> – Everyone likes a little personalization and customization, right?  Why not break away from the typical gray/sandy colors and jazz up your browser with a new theme?</p>
  </li>
  <li>
    <p><strong>HTML5/CSS3</strong> – Animations are no longer confined to Flash.  With CSS3, animations and transitions are fully supported, speeding up webpage load times.</p>
  </li>
  <li>
    <p><strong>I’m a happier person</strong> – Building a website to look aesthetically pleasing in a browser takes time.  Making it work in IE7 requires a lot more time.  In fact, it usually requires the use of its own stylesheet, just to make web pages appear correctly.</p>
  </li>
  <li>
    <p><strong>Beautiful interfaces</strong> – Currently, everywhere you look, advertisements and pictures are using color gradients to make products more visually appealing.  With modern browsers, creating beautiful websites is much, much easier and doesn’t require the use of hundreds of images.</p>
  </li>
</ul>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#rwd"
          aria-label="View all posts in category rwd"
          >rwd</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#modern-web"
          aria-label="View all posts in category modern web"
          >modern web</a
        >
         
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
safari<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Why Click Events Don't Work in Safari
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Why Click Events Don’t Work in Safari | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Why Click Events Don’t Work in Safari" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Over the last few months I’ve been working on a weather dashboard with the goal of developing it into my first mobile app." />
<meta property="og:description" content="Over the last few months I’ve been working on a weather dashboard with the goal of developing it into my first mobile app." />
<link rel="canonical" href="https://davidauble.com/blog/2018/01/29/why-click-events-dont-work-in-safari.html" />
<meta property="og:url" content="https://davidauble.com/blog/2018/01/29/why-click-events-dont-work-in-safari.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/cup-of-coffee-laptop-office-macbook-89786.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2018-01-29T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/cup-of-coffee-laptop-office-macbook-89786.jpg" />
<meta property="twitter:title" content="Why Click Events Don’t Work in Safari" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2018-01-29T00:00:00+00:00","datePublished":"2018-01-29T00:00:00+00:00","description":"Over the last few months I’ve been working on a weather dashboard with the goal of developing it into my first mobile app.","headline":"Why Click Events Don’t Work in Safari","image":"https://davidauble.com/assets/images/posts/cup-of-coffee-laptop-office-macbook-89786.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2018/01/29/why-click-events-dont-work-in-safari.html"},"url":"https://davidauble.com/blog/2018/01/29/why-click-events-dont-work-in-safari.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>css</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jan 29, 2018</span
          >
        </div>
        <h1>Why Click Events Don't Work in Safari</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 1 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/cup-of-coffee-laptop-office-macbook-89786.jpg" alt="Why Click Events Don't Work in Safari" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>Over the last few months I’ve been working on a weather dashboard with the goal of developing it into my first mobile app.</p>

<p>One of the features I’ve added has been a pull-out menu, which displays additional information that won’t fit on the primary screen. It’s been working in all the browsers except Safari mobile. I’m pulling a lot of data asynchronously, so several items don’t appear in the DOM when the page is loaded. Because of this, I was having to target click events in the following way:</p>

<pre>$(document).on('click', '.js-menu-cog', function() {
                   $('.js-menu').fadeIn('fast').addClass('active');
                });</pre>

<p>It was working in all browsers yet again, Safari was being problematic. Finally, I remember reading an article years ago about Safari not reading elements as buttons unless they had the cursor: pointer CSS property applied.</p>

<p>Once I added the cursor: pointer style to my button, it started working!</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#css"
          aria-label="View all posts in category css"
          >css</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#safari"
          aria-label="View all posts in category safari"
          >safari</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#rwd"
          aria-label="View all posts in category rwd"
          >rwd</a
        >
         
        <a
          class="chip"
          href="/tags/#browsers"
          aria-label="View all posts tagged browsers"
          >browsers</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
seo<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Three Reasons You Should Ditch Image Sliders
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Three Reasons You Should Ditch Image Sliders | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Three Reasons You Should Ditch Image Sliders" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Carousels, sliders and rotating banners – chances are you’ve heard one or more of these terms before. Image carousels can be found on nearly any news site, online store or informational site with one goal in mind: force-feed the user as much content as possible, as soon as they land on your site." />
<meta property="og:description" content="Carousels, sliders and rotating banners – chances are you’ve heard one or more of these terms before. Image carousels can be found on nearly any news site, online store or informational site with one goal in mind: force-feed the user as much content as possible, as soon as they land on your site." />
<link rel="canonical" href="https://davidauble.com/blog/2015/01/16/three-reasons-you-should-ditch-image-sliders.html" />
<meta property="og:url" content="https://davidauble.com/blog/2015/01/16/three-reasons-you-should-ditch-image-sliders.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/carousel.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2015-01-16T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/carousel.jpg" />
<meta property="twitter:title" content="Three Reasons You Should Ditch Image Sliders" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2015-01-16T00:00:00+00:00","datePublished":"2015-01-16T00:00:00+00:00","description":"Carousels, sliders and rotating banners – chances are you’ve heard one or more of these terms before. Image carousels can be found on nearly any news site, online store or informational site with one goal in mind: force-feed the user as much content as possible, as soon as they land on your site.","headline":"Three Reasons You Should Ditch Image Sliders","image":"https://davidauble.com/assets/images/posts/carousel.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2015/01/16/three-reasons-you-should-ditch-image-sliders.html"},"url":"https://davidauble.com/blog/2015/01/16/three-reasons-you-should-ditch-image-sliders.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>carousel</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jan 16, 2015</span
          >
        </div>
        <h1>Three Reasons You Should Ditch Image Sliders</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 3 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/carousel.jpg" alt="Three Reasons You Should Ditch Image Sliders" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p><a href="http://ux.stackexchange.com/questions/13951/what-is-the-difference-between-a-slider-a-gallery-and-a-carousel" target="_blank">Carousels, sliders and rotating banners</a> – chances are you’ve heard one or more of these terms before. Image carousels can be found on nearly any news site, online store or informational site with one goal in mind: force-feed the user as much content as possible, as soon as they land on your site.</p>

<p>The concept of image sliders dates back several years to when JavaScript started booming. Image sliders were a great way to show users multiple promotions or features while freeing up page space. Once they started gaining momentum, online retailers began using them to showcase their weekly promotions, similar to a weekly insert in the Sunday paper.</p>

<p>Now, image sliders are overused and oftentimes ignored by the consumer. Here are a few reasons why customers aren’t paying attention:</p>

<ul>
  <li><strong>Automatic rotation</strong> Most image sliders have multiple slides that automatically rotate when users land on the site. For example, <a href="http://www.ikea.com/us/en/">IKEA</a> currently has four promotions in their image slider, which includes an auto-rotate feature. A recent study conducted on the <a href="http://www.nngroup.com/articles/auto-forwarding/">usability</a> of image sliders by Neilson Norman group confirmed that auto-forwarding sliders annoy users and reduce visibility of your messages.</li>
  <li><strong>Increased site load time</strong> Typically, users will need to load jQuery (and a slider script) in order to display a carousel, which will increase your page loading time. Additionally, sites may have large, high-resolution banners, which also add to the page-load time. Carousels add <a href="http://chrislema.com/comparing-premium-sliders-for-wordpress-by-performance/">between .4  and five seconds</a> to your page-load time. Keep in mind, <a href="http://www.lauradhamilton.com/5-quick-and-easy-seo-tips">Google incorporates page speeds into search engine rankings</a>, so if your site is slow, you’re going to be punished.</li>
  <li><strong>Negative impacts on your SEO and conversion rates</strong> Basic SEO practices state that there should be only one h1 tag per page and it should appear before any other heading tag. The problem with using h1 or any heading tag in an image carousel is that every time the slide changes, the h1 tag changes. A page with five slides in the carousel will have five h1 tags, which greatly devalues keyword relevance.</li>
</ul>

<p>​A 2013 study at the University of Notre Dame was conducted on the <a href="http://weedygarden.net/2013/01/carousel-stats/" target="_blank">efficiency of image carousels</a> and revealed that only one percent of three million site visitors clicked on a carousel’s featured image.</p>

<p>Too many messages oftentimes equal no message to consumers. Sometimes, slides on image sliders are so fast that people are not able to finish reading them. Check out these sites below that allow the user to be in control of the content they are viewing:</p>

<ul>
  <li><a href="https://www.mint.com/" target="_blank">Mint</a> does a good job of breaking things down and hiding nothing.</li>
  <li><a href="http://www.bensherman.com/" target="_blank">Ben Sherman</a> has one promotion up front; that’s it.</li>
  <li><a href="http://www.nike.com/us/en_us/?ref=https%3A%2F%2Fwww.google.com%2F" target="_blank">Nike</a> does a good job of sticking to their upcoming events and focusing on one campaign at a time.</li>
</ul>

<p>Keep your website timely without becoming a promotion hoarder. You don’t need to hold onto everything you’ve ever promoted; every campaign has a shelf life. When considering alternatives to image sliders, here are a few points to keep in mind:</p>

<ul>
  <li>Maintain one message. Yes, it’s possible – focus!</li>
  <li>Organize key points in the layout on level of importance.</li>
  <li>Give the user more control by disabling auto rotate carousels.</li>
  <li>Limit or simplify the amount of sliders if you use a slideshow.</li>
</ul>

<p>Before you make a big decision on how to direct your users, consider your customer and the experience first, and do it right. Measure, adjust, rinse and repeat.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#carousel"
          aria-label="View all posts in category carousel"
          >carousel</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#seo"
          aria-label="View all posts in category seo"
          >seo</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#modern-web"
          aria-label="View all posts in category modern web"
          >modern web</a
        >
         
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      The Panda Effect
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>The Panda Effect | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="The Panda Effect" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="By now, most businesses are implementing some form of basic SEO.  Whether it’s optimizing page titles and structure, or optimizing all pictures, content and folder structure, it’s important to build your site with SEO in mind." />
<meta property="og:description" content="By now, most businesses are implementing some form of basic SEO.  Whether it’s optimizing page titles and structure, or optimizing all pictures, content and folder structure, it’s important to build your site with SEO in mind." />
<link rel="canonical" href="https://davidauble.com/blog/2011/12/06/the-panda-effect.html" />
<meta property="og:url" content="https://davidauble.com/blog/2011/12/06/the-panda-effect.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/panda-1.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2011-12-06T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/panda-1.jpg" />
<meta property="twitter:title" content="The Panda Effect" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2011-12-06T00:00:00+00:00","datePublished":"2011-12-06T00:00:00+00:00","description":"By now, most businesses are implementing some form of basic SEO.  Whether it’s optimizing page titles and structure, or optimizing all pictures, content and folder structure, it’s important to build your site with SEO in mind.","headline":"The Panda Effect","image":"https://davidauble.com/assets/images/posts/panda-1.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2011/12/06/the-panda-effect.html"},"url":"https://davidauble.com/blog/2011/12/06/the-panda-effect.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>seo</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Dec 06, 2011</span
          >
        </div>
        <h1>The Panda Effect</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 3 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/panda-1.jpg" alt="The Panda Effect" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>By now, most businesses are implementing some form of basic SEO.  Whether it’s optimizing page titles and structure, or optimizing all pictures, content and folder structure, it’s important to build your site with SEO in mind.</p>

<p>Most people agree that Google is the leading search engine (by a significant margin).  By receiving over 65% of all search traffic, Google has been busy at work with trying to return the most relevant results as quickly as possible.</p>

<p>Recently, the search engine giant has released their latest version of their algorithm, Panda.  With the release of Panda came a series of changes and new factors that are taken into account when “grading” a website. The Panda release affects nearly 12% of all search results.</p>

<p>Let’s take a look at some of the new factors Panda takes into account when crawling a website.</p>

<ul>
  <li>
    <p><strong>Focus on the basics: UI/UX</strong>
It may sound scary, but Google’s web bots (the Googlebot) are becoming more human-like by “understanding” page layouts.  By taking factors such as bounce rate, time spent on each page and site, page response times and conversion rates, the Googlebot is able to determine if the page contains content that people are actually wanting to view.With this information, the Googlebot is able to make an educated guess as to how people are engaging with your website.</p>
  </li>
  <li>
    <p><strong>Content Quality, Including Spelling</strong>
Something our content writers always ask themselves is “How original is my content?”  It’s no secret that Google has virtually limitless space to store indexes of your content.  Because of this, it’s relatively easy for Google to determine the uniqueness of your content.  Pages with trustworthy and reliable content are favored more by the Googlebots, too.It seems trivial, but you would be surprised at the number of websites that have small spelling and grammar errors.  Googlebots recognize this and actually penalize sites with errors.  By looking through a website’s PageRank, or how reputable the website is, spelling and grammar affect this significantly.</p>
  </li>
  <li>
    <p><strong>Ad Spacing and Layout</strong>
If you’re like me, you probably despise ads.  Googlebots are no different.  If they deem your page to have too many ads, your website may become flagged as a link farm, or may be seen as a page that serves no purpose other than to advertise for other companies. Being flagged as a link farm will severely affect your rankings, as most link farm websites have no real value.</p>
  </li>
  <li>
    <p><strong>Cleanliness of Code</strong>
Any developer will agree that clean code is much easier to manage.  By writing clean code, it’s much easier to ensure your website renders the same way in any browser, regardless if it’s Internet Explorer or Chrome.  By validating your website against the W3C, this is your best ally in making sure everyone and Googlebots can view your website properly.</p>
  </li>
</ul>

<p>The Internet changes constantly. Google recognizes the inevitable changes and continually updates their algorithms.  Panda is the latest big change and certainly won’t be the last. By keeping these tips in mind, a website can please the “Google Gods” and improve its page rank.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#seo"
          aria-label="View all posts in category seo"
          >seo</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#google"
          aria-label="View all posts in category google"
          >google</a
        >
         
        <a
          class="chip"
          href="/tags/#google"
          aria-label="View all posts tagged google"
          >google</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
sql server<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Displaying Dates as Strings with PHP's sqlsrv_connect()
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Displaying Dates as Strings with PHP’s sqlsrv_connect() | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Displaying Dates as Strings with PHP’s sqlsrv_connect()" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Over the last few weeks I’ve been working on a web application that allows me to track how website leads are performing at work. In building this app, I’m interacting with MySQL and SQL Server databases together and using PHP as my language of choice." />
<meta property="og:description" content="Over the last few weeks I’ve been working on a web application that allows me to track how website leads are performing at work. In building this app, I’m interacting with MySQL and SQL Server databases together and using PHP as my language of choice." />
<link rel="canonical" href="https://davidauble.com/blog/2018/01/16/displaying-dates-strings-phps-sqlsrv_connect.html" />
<meta property="og:url" content="https://davidauble.com/blog/2018/01/16/displaying-dates-strings-phps-sqlsrv_connect.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/sqlservconnect.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2018-01-16T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/sqlservconnect.jpg" />
<meta property="twitter:title" content="Displaying Dates as Strings with PHP’s sqlsrv_connect()" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2018-01-16T00:00:00+00:00","datePublished":"2018-01-16T00:00:00+00:00","description":"Over the last few weeks I’ve been working on a web application that allows me to track how website leads are performing at work. In building this app, I’m interacting with MySQL and SQL Server databases together and using PHP as my language of choice.","headline":"Displaying Dates as Strings with PHP’s sqlsrv_connect()","image":"https://davidauble.com/assets/images/posts/sqlservconnect.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2018/01/16/displaying-dates-strings-phps-sqlsrv_connect.html"},"url":"https://davidauble.com/blog/2018/01/16/displaying-dates-strings-phps-sqlsrv_connect.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>sql server</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jan 16, 2018</span
          >
        </div>
        <h1>Displaying Dates as Strings with PHP's sqlsrv_connect()</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 2 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/sqlservconnect.jpg" alt="Displaying Dates as Strings with PHP's sqlsrv_connect()" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>Over the last few weeks I’ve been working on a web application that allows me to track how website leads are performing at work. In building this app, I’m interacting with MySQL and SQL Server databases together and using PHP as my language of choice.</p>

<p>I’ve recently run into a problem with DateTime fields and how MySQL and SQL Server handle them differently. MySQL uses Epoch time, whereas SQL Server uses a more readable format, such as 1900-01-01 00:00:00. The problem I was running into was display a result set, saving it into an array and printing the array’s contents into a CSV file. I kept running into an error:</p>

<pre>Fatal error: Cannot use object of type DateTime as array</pre>

<p>When I printed out the array’s contents, I kept discovering my array looked like this:</p>

<pre>[0] =&gt; Value
                [1] =&gt; Value2
                [2] =&gt; Value3
                DateTime Object
                (
                    [date] =&gt; 2017-12-29 11:54:00.000000
                    [timezone_type] =&gt; 3
                    [timezone] =&gt; UTC
                )</pre>

<p>Puzzled, I was turning to Google, thinking I’d have to check each index of the array to determine if it’s a string or object. Neither was working.</p>

<p>I started looking at my SQL Server connection string and double checked the documentation for the sqlsrv_connect() method I am using, wondering if there were extra parameters I could use. Through who knows how many searches I finally landed on a <a href="https://docs.microsoft.com/en-us/sql/connect/php/how-to-retrieve-date-and-time-type-as-strings-using-the-sqlsrv-driver" target="_blank">Microsoft page which outlined the SQLSRV driver</a>. In the first example, I learned there IS an extra param I can use that will output all DateTime objects as strings!</p>

<p>To do so, simply add the following to your sqlsrv_connect() database parameters and SQL Server will start returning all DateTime fields as strings.</p>

<pre>'ReturnDatesAsStrings'=&gt;true</pre>

<p>Finally, here’s my new connection string:</p>

<pre>$this-&gt;conn = sqlsrv_connect($this-&gt;sql_server, array( "Database" =&gt; $this-&gt;sql_name, 'ReturnDatesAsStrings' =&gt; true));</pre>

<p>Good luck!</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#sql-server"
          aria-label="View all posts in category sql server"
          >sql server</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#php"
          aria-label="View all posts in category php"
          >php</a
        >
         
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
tags<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Adding Related Posts in WordPress Without a Plugin
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Adding Related Posts in WordPress Without a Plugin | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Adding Related Posts in WordPress Without a Plugin" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="This past week I had yet another challenge: add related posts to a blog entry and make it match a design. It seemed straightforward, especially since all the blog posts are organized by category. As I dug deeper, I realized it wasn’t going to be as simple as I’d originally thought." />
<meta property="og:description" content="This past week I had yet another challenge: add related posts to a blog entry and make it match a design. It seemed straightforward, especially since all the blog posts are organized by category. As I dug deeper, I realized it wasn’t going to be as simple as I’d originally thought." />
<link rel="canonical" href="https://davidauble.com/blog/2017/10/27/adding-related-posts-wordpress-without-plugin.html" />
<meta property="og:url" content="https://davidauble.com/blog/2017/10/27/adding-related-posts-wordpress-without-plugin.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/related-posts.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2017-10-27T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/related-posts.jpg" />
<meta property="twitter:title" content="Adding Related Posts in WordPress Without a Plugin" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2017-10-27T00:00:00+00:00","datePublished":"2017-10-27T00:00:00+00:00","description":"This past week I had yet another challenge: add related posts to a blog entry and make it match a design. It seemed straightforward, especially since all the blog posts are organized by category. As I dug deeper, I realized it wasn’t going to be as simple as I’d originally thought.","headline":"Adding Related Posts in WordPress Without a Plugin","image":"https://davidauble.com/assets/images/posts/related-posts.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2017/10/27/adding-related-posts-wordpress-without-plugin.html"},"url":"https://davidauble.com/blog/2017/10/27/adding-related-posts-wordpress-without-plugin.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Oct 27, 2017</span
          >
        </div>
        <h1>Adding Related Posts in WordPress Without a Plugin</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 2 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/related-posts.jpg" alt="Adding Related Posts in WordPress Without a Plugin" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>This past week I had yet another challenge: add related posts to a blog entry and make it match a design. It seemed straightforward, especially since all the blog posts are organized by category. As I dug deeper, I realized it wasn’t going to be as simple as I’d originally thought.</p>

<p>Let me preface this post by saying <strong>I don’t like using unnecessary WordPress plugins. </strong>I’d much rather build something from scratch that doesn’t have limitations from a plugin. There are times when plugins are necessary, sure, but I’d much rather have something that doesn’t need to be updated constantly or be limited to a plugin’s design.</p>

<p>I should preface this with there are two ways of doing this: display related posts by <strong>tags </strong>and by <strong>categories</strong>. I’ll first demonstrate by displaying related posts by tags. I feel this is the better way to show related posts. <em>Let’s assume this will be going on your default single.php page.</em></p>

<h2 id="related-posts-by-tags">Related Posts by Tags</h2>
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>&lt;div class="related-posts"&gt;
  &lt;?php
    $tags = wp_get_post_tags($post-&gt;ID);

    if ($tags):
      $first_tag = $tags[0]-&gt;term_id;

      $args = array(
        'tag__in' =&gt; array($first_tag),
        'post__not_in' =&gt; array($post-&gt;ID),
        'posts_per_page' =&gt; 2,
        'caller_get_posts' =&gt; 1,
        'orderby' =&gt; 'rand'
      );

      $posts = new WP_Query($args);
  ?&gt;

      &lt;?php if($posts-&gt;have_posts()): while($posts-&gt;have_posts()): $posts-&gt;the_post(); ?&gt;

        &lt;div class="related-posts__post"&gt;
          &lt;a href="&lt;?php the_permalink(); ?&gt;"&gt;
            &lt;?php $image = wp_get_attachment_image_src(get_post_thumbnail_id($post-&gt;ID), 'medium'); ?&gt;
            &lt;img src="&lt;?php echo $image[0]; ?&gt;" alt="" class=""&gt;

            &lt;span class="related-posts__post--title"&gt;&lt;?php the_title(); ?&gt;&lt;/span&gt;
          &lt;/a&gt;
        &lt;/div&gt;

      &lt;?php endwhile; endif; wp_reset_query(); ?&gt;

  &lt;?php endif; ?&gt;
&lt;/div&gt;
</code></pre></div></div>

<h2 id="related-posts-by-categories">Related Posts by Categories</h2>
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>&lt;div class="related-posts"&gt;
  &lt;?php
    $tags = wp_get_post_categories($post-&gt;ID);

    if ($tags):
      $args = array(
        'current_category' =&gt; $tags,
        'orderby' =&gt; 'rand',
        'posts_per_page' =&gt; 2
      );

      $posts = new WP_Query($args);
      while ($posts-&gt;have_posts()): $posts-&gt;the_post();
  ?&gt;
      &lt;div class="related-posts__post"&gt;
        &lt;a href="&lt;?php the_permalink(); ?&gt;" class="related-posts__post--link"&gt;
          &lt;span class="related-posts__post--link--wrap"&gt;
            &lt;span class="related-posts__post--link--wrap__overlay"&gt;&lt;/span&gt;

            &lt;?php $image = wp_get_attachment_image_src(get_post_thumbnail_id($post-&gt;ID), 'blog_image'); ?&gt;
            &lt;img src="&lt;?php echo $image[0]; ?&gt;" alt="" class="related-posts__post--link--image"&gt;

            &lt;span class="btn btn-secondary"&gt;Read More&lt;/span&gt;
          &lt;/span&gt;
          &lt;h4&gt;&lt;?php the_title(); ?&gt;&lt;/h4&gt;
        &lt;/a&gt;
      &lt;/div&gt;
    &lt;?php endwhile; ?&gt;
  &lt;?php wp_reset_query(); endif; ?&gt;
&lt;/div&gt;
</code></pre></div></div>

<p>And voila! I hope this helps.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#categories"
          aria-label="View all posts in category categories"
          >categories</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#tags"
          aria-label="View all posts in category tags"
          >tags</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#php"
          aria-label="View all posts in category php"
          >php</a
        >
         
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
wordpress<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Common Misconceptions About WordPress
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Common Misconceptions About WordPress | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Common Misconceptions About WordPress" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="WordPress is undoubtedly one of the most popular content management systems (CMS) on the internet today. With its user-friendly interface and vast plugin ecosystem, it has empowered millions of users to create websites without extensive coding knowledge. However, there are several common misconceptions about WordPress that need to be addressed. In this article, we’ll debunk some of these myths." />
<meta property="og:description" content="WordPress is undoubtedly one of the most popular content management systems (CMS) on the internet today. With its user-friendly interface and vast plugin ecosystem, it has empowered millions of users to create websites without extensive coding knowledge. However, there are several common misconceptions about WordPress that need to be addressed. In this article, we’ll debunk some of these myths." />
<link rel="canonical" href="https://davidauble.com/blog/2023/09/01/common-misconceptions-in-wordpress.html" />
<meta property="og:url" content="https://davidauble.com/blog/2023/09/01/common-misconceptions-in-wordpress.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/wordpress-misconceptions.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2023-09-01T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/wordpress-misconceptions.jpg" />
<meta property="twitter:title" content="Common Misconceptions About WordPress" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2023-09-01T00:00:00+00:00","datePublished":"2023-09-01T00:00:00+00:00","description":"WordPress is undoubtedly one of the most popular content management systems (CMS) on the internet today. With its user-friendly interface and vast plugin ecosystem, it has empowered millions of users to create websites without extensive coding knowledge. However, there are several common misconceptions about WordPress that need to be addressed. In this article, we’ll debunk some of these myths.","headline":"Common Misconceptions About WordPress","image":"https://davidauble.com/assets/images/posts/wordpress-misconceptions.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2023/09/01/common-misconceptions-in-wordpress.html"},"url":"https://davidauble.com/blog/2023/09/01/common-misconceptions-in-wordpress.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Sep 01, 2023</span
          >
        </div>
        <h1>Common Misconceptions About WordPress</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 3 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>WordPress is undoubtedly one of the most popular content management systems (CMS) on the internet today. With its user-friendly interface and vast plugin ecosystem, it has empowered millions of users to create websites without extensive coding knowledge. However, there are several common misconceptions about WordPress that need to be addressed. In this article, we’ll debunk some of these myths.</p>

<h2 id="myth-1-wordpress-is-just-for-blogs">Myth 1: WordPress is Just for Blogs</h2>

<p>One of the most persistent misconceptions is that WordPress is primarily a platform for bloggers. While WordPress initially gained popularity as a blogging platform, it has evolved into a versatile CMS that can power a wide range of websites, including e-commerce stores, business websites, forums, and more. Its flexibility allows developers to build almost any type of website.</p>

<h2 id="myth-2-wordpress-is-not-secure">Myth 2: WordPress is Not Secure</h2>

<p>Security concerns often arise when discussing WordPress. Some believe that it’s inherently insecure and prone to hacking. In reality, WordPress takes security seriously. The core development team regularly releases updates to patch vulnerabilities, and there is a robust community of security experts and plugins dedicated to enhancing WordPress security. The key to a secure WordPress site is keeping it updated and following best security practices.</p>

<h2 id="myth-3-all-wordpress-sites-look-the-same">Myth 3: All WordPress Sites Look the Same</h2>

<p>Another misconception is that all WordPress websites look generic and similar. While it’s true that some beginners might use default themes, WordPress offers thousands of free and premium themes, allowing you to create a unique and customized design for your site. With the help of custom themes and CSS, you can make your WordPress site stand out from the crowd.</p>

<h2 id="myth-4-wordpress-is-slow">Myth 4: WordPress is Slow</h2>

<p>WordPress performance largely depends on how it’s configured and optimized. While it’s true that poorly coded themes and excessive plugins can slow down your site, a well-optimized WordPress site can be incredibly fast. Utilize caching, image optimization, and choose a reliable hosting provider to ensure your WordPress site loads quickly.</p>

<h2 id="myth-5-wordpress-cant-handle-large-websites">Myth 5: WordPress Can’t Handle Large Websites</h2>

<p>Some believe that WordPress is not suitable for large websites with a high volume of content. This misconception arises from the idea that WordPress is only for small blogs. However, many high-traffic and enterprise-level websites are built on WordPress, thanks to its scalability and the ability to handle large amounts of content with ease.</p>

<h2 id="myth-6-you-need-to-know-code-to-use-wordpress">Myth 6: You Need to Know Code to Use WordPress</h2>

<p>While coding skills can be beneficial for advanced customization, they are not a requirement to use WordPress. The platform offers a user-friendly interface, a visual editor, and a plethora of plugins that allow users to create and manage content without writing code. Anyone can start using WordPress, and the learning curve is not as steep as some might think.</p>

<p>In conclusion, WordPress is a powerful and versatile CMS that can be used for a wide range of websites, is secure when properly managed, allows for unique design customization, can be optimized for speed, handles large websites effectively, and is user-friendly for both beginners and experienced developers. Dispelling these common misconceptions will help you make the most out of WordPress and harness its full potential.</p>

<p><a href="https://www.pexels.com/photo/white-printer-paper-on-a-vintage-typewriter-4152505/">Photo by Markus Winkler</a></p>

<p><em>This post was generated with the help of AI.</em></p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#development"
          aria-label="View all posts in category development"
          >development</a
        >
         
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2020/09/06/new-job-promotion.html">
        
        <img src="/assets/images/posts/david-auble-manager.jpg" alt="David Auble, Manager" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 06, 2020 · </span
          >
          <h3>David Auble, Manager</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Common WordPress Helper Functions
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Common WordPress Helper Functions | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Common WordPress Helper Functions" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="I’ve used WordPress almost daily for the past six years and thought it’d be time to share some of my more commonly used functions WordPress has built in to the framework. Below is a list of the functions I use frequently on most of the sites I build." />
<meta property="og:description" content="I’ve used WordPress almost daily for the past six years and thought it’d be time to share some of my more commonly used functions WordPress has built in to the framework. Below is a list of the functions I use frequently on most of the sites I build." />
<link rel="canonical" href="https://davidauble.com/blog/2020/04/29/common-wordpress-helper-functions.html" />
<meta property="og:url" content="https://davidauble.com/blog/2020/04/29/common-wordpress-helper-functions.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/common-wordpress-functions.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2020-04-29T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/common-wordpress-functions.jpg" />
<meta property="twitter:title" content="Common WordPress Helper Functions" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2020-04-29T00:00:00+00:00","datePublished":"2020-04-29T00:00:00+00:00","description":"I’ve used WordPress almost daily for the past six years and thought it’d be time to share some of my more commonly used functions WordPress has built in to the framework. Below is a list of the functions I use frequently on most of the sites I build.","headline":"Common WordPress Helper Functions","image":"https://davidauble.com/assets/images/posts/common-wordpress-functions.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2020/04/29/common-wordpress-helper-functions.html"},"url":"https://davidauble.com/blog/2020/04/29/common-wordpress-helper-functions.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Apr 29, 2020</span
          >
        </div>
        <h1>Common WordPress Helper Functions</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 2 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/common-wordpress-functions.jpg" alt="Common WordPress Helper Functions" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>I’ve used WordPress almost daily for the past six years and thought it’d be time to share some of my more commonly used functions WordPress has built in to the framework. Below is a list of the functions I use frequently on most of the sites I build.</p>

<h2 id="wp_is_mobile">wp_is_mobile()</h2>
<div class="language-php highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nf">wp_is_mobile</span><span class="p">()</span>
</code></pre></div></div>

<p>This function detects if someone is using a mobile device or not. Extremely handy for when you want certain features (such as tracking scripts, chat applications, etc) to not appear when users are using mobile devices.</p>

<h2 id="is_user_logged_in">is_user_logged_in()</h2>
<div class="language-php highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nf">is_user_logged_in</span><span class="p">()</span>
</code></pre></div></div>

<p>As it sounds, this checks to see if the current user is logged in or not. Handy little script for turning off tracking scripts or other non-essential parts when users are logged in. This can also be used to protect content areas that require membership roles to view.</p>

<h2 id="is_page_template">is_page_template()</h2>
<div class="language-php highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nf">is_page_template</span><span class="p">(</span><span class="s1">'template-sample.php'</span><span class="p">)</span>
</code></pre></div></div>

<h2 id="is_front_page">is_front_page()</h2>
<div class="language-php highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nf">is_front_page</span><span class="p">()</span>
</code></pre></div></div>

<p>This function simply checks to see if the current page is set as the Front Page in WordPress. This page is set under Settings -&gt; Reading.</p>

<h2 id="is_home">is_home()</h2>
<div class="language-php highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nf">is_home</span><span class="p">()</span>
</code></pre></div></div>

<p>This function simply checks to see if the current page is set as the Posts Page in WordPress. This page is set under Settings -&gt; Reading.</p>

<h2 id="wp_reset_postdata">wp_reset_postdata()</h2>
<div class="language-php highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nf">wp_reset_postdata</span><span class="p">()</span>
</code></pre></div></div>

<p>When using custom loops, this resets the Posts loop so the rest of the page will render properly.</p>

<h2 id="restore_current_blog">restore_current_blog()</h2>
<div class="language-php highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nf">restore_current_blog</span><span class="p">(</span><span class="mi">1</span><span class="p">)</span>
</code></pre></div></div>

<p>When working with a multisite setup, this allows you to change which blog to grab content. Pass in the Site ID as an arugment to load that site’s content.</p>

<h2 id="get_template_part">get_template_part()</h2>
<div class="language-php highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nf">get_template_part</span><span class="p">(</span><span class="s1">'included-template.php'</span><span class="p">)</span>
</code></pre></div></div>

<p>This functions like an include for WordPress. Simple pass in the PHP template filename as an argument.</p>

<h2 id="bloginfo">bloginfo()</h2>
<div class="language-php highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nf">bloginfo</span><span class="p">(</span><span class="s1">'url'</span><span class="p">)</span>
</code></pre></div></div>

<p>One of the more useful functions, this enables you to grab various info about the WordPress site. Some arguments I use frequently are <code class="language-plaintext highlighter-rouge">url</code> and <code class="language-plaintext highlighter-rouge">template_directory</code>. These return the site’s URL and theme path.</p>

<p>For more information on these functions and more, visit the <a href="https://developer.wordpress.org/reference/functions/" target="_blank">WordPress Developer reference</a>.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
         
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Edit Robots.txt with WordPress and Yoast
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Edit Robots.txt with WordPress and Yoast | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Edit Robots.txt with WordPress and Yoast" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="An interesting project came my way this week at work and took some digging to resolve. Each website utilizes a file called a robots.txt file that helps point search engine bots what areas of your site to crawl and which to ignore. This helps the bots crawl your site and help it appear on search engines and can impact your search rankings." />
<meta property="og:description" content="An interesting project came my way this week at work and took some digging to resolve. Each website utilizes a file called a robots.txt file that helps point search engine bots what areas of your site to crawl and which to ignore. This helps the bots crawl your site and help it appear on search engines and can impact your search rankings." />
<link rel="canonical" href="https://davidauble.com/blog/2020/04/14/edit-robots-txt-wordpress-yoast.html" />
<meta property="og:url" content="https://davidauble.com/blog/2020/04/14/edit-robots-txt-wordpress-yoast.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/robots.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2020-04-14T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/robots.jpg" />
<meta property="twitter:title" content="Edit Robots.txt with WordPress and Yoast" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2020-04-14T00:00:00+00:00","datePublished":"2020-04-14T00:00:00+00:00","description":"An interesting project came my way this week at work and took some digging to resolve. Each website utilizes a file called a robots.txt file that helps point search engine bots what areas of your site to crawl and which to ignore. This helps the bots crawl your site and help it appear on search engines and can impact your search rankings.","headline":"Edit Robots.txt with WordPress and Yoast","image":"https://davidauble.com/assets/images/posts/robots.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2020/04/14/edit-robots-txt-wordpress-yoast.html"},"url":"https://davidauble.com/blog/2020/04/14/edit-robots-txt-wordpress-yoast.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Apr 14, 2020</span
          >
        </div>
        <h1>Edit Robots.txt with WordPress and Yoast</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 2 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/robots.jpg" alt="Edit Robots.txt with WordPress and Yoast" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>An interesting project came my way this week at work and took some digging to resolve. Each website utilizes a file called a <code class="language-plaintext highlighter-rouge">robots.txt</code> file that helps point search engine bots what areas of your site to crawl and which to ignore. This helps the bots crawl your site and help it appear on search engines and can impact your search rankings.</p>

<p>We’ve been using Yoast SEO for our primary SEO plugin on all of our sites for quite some time and albeit it buggy and <a href="https://yoast.com/media-attachment-urls/" target="_blank">catastrophic at times</a>, however for the most part, it is the best SEO plugin available for WordPress.</p>

<p>Anyway, I was given the task to update the <code class="language-plaintext highlighter-rouge">robots.txt</code> file on each site to include a link to the sitemap.xml file, generated by Yoast. I immediately thought to check the site’s primary directory, but didn’t see a text file in that location. I then checked the built-in file editor in WordPress, but came up blank, as it only allowed me to edit template files. Hmm..</p>

<p>Oh, for some background, each of our websites is set up using the <a href="https://wordpress.org/support/article/glossary/#multisite" target="_blank">Multisite</a> feature in WordPress. Each site in the network has its own set of options with Yoast and has an area to update the <code class="language-plaintext highlighter-rouge">robots.txt</code>. However, that option has been removed and I wasn’t able to find which version of Yoast removed that option.</p>

<p>Finally, after digging much further, I was able to find that in the Network Admin area, another Yoast Options page exists. From here, you have the option to click <em>Edit Files</em>, which allows you to generate and modify the <code class="language-plaintext highlighter-rouge">robots.txt</code> file from within WordPress. Finally! Below are the steps I took to solve this problem.</p>

<ol>
  <li>Click on Network Admin -&gt; Dashboard<br />
<img src="/assets/images/posts/network-admin.jpg" alt="Clicking on Network Admin, followed by Dashboard link" /></li>
  <li>Hover over the Yoast SEO options and click Edit Files<br />
<img src="/assets/images/posts/seo-edit-files.jpg" alt="Click on Yoast SEO, Edit Files" /></li>
  <li>Edit robots.txt<br />
<img src="/assets/images/posts/edit-robots.jpg" alt="Edit robots.txt text input" /></li>
</ol>

<p><strong>Note</strong> If a robots.txt file does not exist, in the current verion of WordPress, 5.4, clicking the “Generate robots.txt” button will redirect you to a page that has HTML markup not being rendered. Simply click the browser’s back button and refresh the page. You will then see the edit text area as seen above.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#apache"
          aria-label="View all posts in category apache"
          >apache</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#iis"
          aria-label="View all posts in category iis"
          >iis</a
        >
         
        <a
          class="chip"
          href="/tags/#seo"
          aria-label="View all posts tagged seo"
          >seo</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Improving WordPress Search Results with Relevanssi
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Improving WordPress Search Results with Relevanssi | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Improving WordPress Search Results with Relevanssi" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="I’ve been managing 17 WordPress sites for the past few years and one thing I’ve noticed is the default search built into WordPress isn’t flexible and doesn’t always return the most accurate results. I use Advanced Custom Fields heavily for each of the sites and have noticed the default search doesn’t search into these fields; it only searches titles and what’s in the page’s main content box. Since most of the pages on our sites don’t use those, I needed to find a better option." />
<meta property="og:description" content="I’ve been managing 17 WordPress sites for the past few years and one thing I’ve noticed is the default search built into WordPress isn’t flexible and doesn’t always return the most accurate results. I use Advanced Custom Fields heavily for each of the sites and have noticed the default search doesn’t search into these fields; it only searches titles and what’s in the page’s main content box. Since most of the pages on our sites don’t use those, I needed to find a better option." />
<link rel="canonical" href="https://davidauble.com/blog/2019/03/05/improving-wordpress-search-results-with-relevanssi.html" />
<meta property="og:url" content="https://davidauble.com/blog/2019/03/05/improving-wordpress-search-results-with-relevanssi.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/relevanssi-search.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2019-03-05T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/relevanssi-search.jpg" />
<meta property="twitter:title" content="Improving WordPress Search Results with Relevanssi" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2019-03-05T00:00:00+00:00","datePublished":"2019-03-05T00:00:00+00:00","description":"I’ve been managing 17 WordPress sites for the past few years and one thing I’ve noticed is the default search built into WordPress isn’t flexible and doesn’t always return the most accurate results. I use Advanced Custom Fields heavily for each of the sites and have noticed the default search doesn’t search into these fields; it only searches titles and what’s in the page’s main content box. Since most of the pages on our sites don’t use those, I needed to find a better option.","headline":"Improving WordPress Search Results with Relevanssi","image":"https://davidauble.com/assets/images/posts/relevanssi-search.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2019/03/05/improving-wordpress-search-results-with-relevanssi.html"},"url":"https://davidauble.com/blog/2019/03/05/improving-wordpress-search-results-with-relevanssi.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Mar 05, 2019</span
          >
        </div>
        <h1>Improving WordPress Search Results with Relevanssi</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 3 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/relevanssi-search.jpg" alt="Improving WordPress Search Results with Relevanssi" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>I’ve been managing 17 WordPress sites for the past few years and one thing I’ve noticed is the default search built into WordPress isn’t flexible and doesn’t always return the most accurate results. I use Advanced Custom Fields heavily for each of the sites and have noticed the default search doesn’t search into these fields; it only searches titles and what’s in the page’s main content box. Since most of the pages on our sites don’t use those, I needed to find a better option.</p>

<p>I looked into managed search solutions such as Algolia and Elasticsearch, but for my needs, those went above and beyond, not to mention were costly. I looked at other WordPress plugins, but since I use the Multisite feature on each site, almost none of the plugins were able to search across the WordPress network. Then I came across <a href="https://www.relevanssi.com/" target="_blank">Relevanssi</a>. Relevanssi offers two versions, free and paid, and promises to look into ACF fields and give more flexibility on searches. It allows me to add custom weights to titles, body fields, custom post types, add synonyms for related words, offers “Did you mean ___?” functionality and best of all, searches across a WordPress network.</p>

<p>After playing around with several settings, I was able to get the search results displaying nearly how I wanted. My two criteria were to have Pages appear above Posts, and to only display Posts newer than the previous two years. To do this though, I had to add some additional customization to my functions.php file. Luckily, the Relevanssi documentation is extremely helpful and detailed, plus the plugin author replies to each comment on support document pages.</p>

<p>Here’s what I ended up with in my functions.php file to display Pages above Posts, then return results newer than two years:</p>

<pre>
add_filter('relevanssi_hits_filter', 'products_first');
  function products_first($hits) {
    $types = array();

    $types['page'] = array();
    $types['post'] = array();

    // Split the post types in array $types
    if (!empty($hits)) {
      foreach ($hits[0] as $hit) {

        $date_cutoff = date('Y-m-d h:i:s', strtotime('-2 years'));
        if($hit-&gt;post_date &gt; $date_cutoff &amp;&amp; $hit-&gt;post_type == 'post') {
          array_push($types[$hit-&gt;post_type], $hit);
        }

        if($hit-&gt;post_type == 'page') {
          array_push($types[$hit-&gt;post_type], $hit);
        }
      }
    }

    // Merge back to $hits in the desired order
    $hits[0] = array_merge($types['page'], $types['post']);
    return $hits;
  }
</pre>

<p>I also noticed that sometimes, plural versions of words weren’t displaying properly either. Sometimes searching for “car” would return different results than “cars.” To get around this, I added a bit more code, found directly from the <a href="https://www.relevanssi.com/knowledge-base/simple-french-plurals/">documentation</a>:</p>

<pre>add_filter( 'relevanssi_stemmer', 'relevanssi_french_plural_stemmer' );
    function relevanssi_french_plural_stemmer( $term ) {
      $len  = strlen( $term );
      $end1 = substr( $term, -1, 1 );

      if ( 's' === $end1 &amp;&amp; $len &gt; 3 ) {
        $term = substr( $term, 0, -1 );
      } elseif ( 'x' === $end1 &amp;&amp; $len &gt; 3 ) {
        $term = substr( $term, 0, -1 );
      }

      return $term;
    }</pre>

<p>I couldn’t be happier with this plugin and hope it solves any problems you might have.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#relevanssi"
          aria-label="View all posts in category relevanssi"
          >relevanssi</a
        >
         
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      How to Change the WordPress Admin Login Logo
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>How to Change the WordPress Admin Login Logo | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="How to Change the WordPress Admin Login Logo" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Over the years I’ve had to search for tons of small snippets for WordPress to do simple tasks. This is another one of those little snippets. One of the final little touches I like to do before launching a website over to a client is to override the default WordPress logo with their logo on the WordPress login splash screen. It’s a simple trick and can be done with the code below." />
<meta property="og:description" content="Over the years I’ve had to search for tons of small snippets for WordPress to do simple tasks. This is another one of those little snippets. One of the final little touches I like to do before launching a website over to a client is to override the default WordPress logo with their logo on the WordPress login splash screen. It’s a simple trick and can be done with the code below." />
<link rel="canonical" href="https://davidauble.com/blog/2019/01/24/how-to-change-the-wordpress-admin-login-logo.html" />
<meta property="og:url" content="https://davidauble.com/blog/2019/01/24/how-to-change-the-wordpress-admin-login-logo.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/wp-walker.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2019-01-24T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/wp-walker.jpg" />
<meta property="twitter:title" content="How to Change the WordPress Admin Login Logo" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2019-01-24T00:00:00+00:00","datePublished":"2019-01-24T00:00:00+00:00","description":"Over the years I’ve had to search for tons of small snippets for WordPress to do simple tasks. This is another one of those little snippets. One of the final little touches I like to do before launching a website over to a client is to override the default WordPress logo with their logo on the WordPress login splash screen. It’s a simple trick and can be done with the code below.","headline":"How to Change the WordPress Admin Login Logo","image":"https://davidauble.com/assets/images/posts/wp-walker.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2019/01/24/how-to-change-the-wordpress-admin-login-logo.html"},"url":"https://davidauble.com/blog/2019/01/24/how-to-change-the-wordpress-admin-login-logo.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jan 24, 2019</span
          >
        </div>
        <h1>How to Change the WordPress Admin Login Logo</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 1 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/wp-walker.jpg" alt="How to Change the WordPress Admin Login Logo" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>Over the years I’ve had to search for tons of small snippets for WordPress to do simple tasks. This is another one of those little snippets. One of the final little touches I like to do before launching a website over to a client is to override the default WordPress logo with their logo on the WordPress login splash screen. It’s a simple trick and can be done with the code below.</p>

<pre>// load in admin styles
                function admin_style() {
                  wp_enqueue_style('admin-styles', get_template_directory_uri().'/admin.css');
                }
                add_action('admin_enqueue_scripts', 'admin_style');</pre>

<p>Next, you’ll need to simply overwrite the default WordPress styling:</p>

<pre>body .login h1 a {
                  background-image: url('path/to/the-logo.png');
                }</pre>

<p>I hope this helps!</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
         
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Stop WordPress from adding 10px padding to Images
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Stop WordPress from adding 10px padding to Images | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Stop WordPress from adding 10px padding to Images" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="For quite some time now I’ve been struggling with WordPress adding an additional 10px of padding to images that are uploaded via the content editor. After a small amount of digging, I’ve discovered the following override:" />
<meta property="og:description" content="For quite some time now I’ve been struggling with WordPress adding an additional 10px of padding to images that are uploaded via the content editor. After a small amount of digging, I’ve discovered the following override:" />
<link rel="canonical" href="https://davidauble.com/blog/2018/09/11/stop-wordpress-from-adding-10px-padding-to-images.html" />
<meta property="og:url" content="https://davidauble.com/blog/2018/09/11/stop-wordpress-from-adding-10px-padding-to-images.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/new-code.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2018-09-11T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/new-code.jpg" />
<meta property="twitter:title" content="Stop WordPress from adding 10px padding to Images" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2018-09-11T00:00:00+00:00","datePublished":"2018-09-11T00:00:00+00:00","description":"For quite some time now I’ve been struggling with WordPress adding an additional 10px of padding to images that are uploaded via the content editor. After a small amount of digging, I’ve discovered the following override:","headline":"Stop WordPress from adding 10px padding to Images","image":"https://davidauble.com/assets/images/posts/new-code.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2018/09/11/stop-wordpress-from-adding-10px-padding-to-images.html"},"url":"https://davidauble.com/blog/2018/09/11/stop-wordpress-from-adding-10px-padding-to-images.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Sep 11, 2018</span
          >
        </div>
        <h1>Stop WordPress from adding 10px padding to Images</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 1 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/new-code.jpg" alt="Stop WordPress from adding 10px padding to Images" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>For quite some time now I’ve been struggling with WordPress adding an additional 10px of padding to images that are uploaded via the content editor. After a small amount of digging, I’ve discovered the following override:</p>

<pre>function remove_caption_padding( $width ) {
                  return $width - 10;
                }
                add_filter( 'img_caption_shortcode_width', 'remove_caption_padding' );</pre>

<p>Add this to your functions.php file and instantly remove the 10px padding.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
         
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Custom Pagination in WordPress
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Custom Pagination in WordPress | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Custom Pagination in WordPress" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="A while ago I was having troubles with the built-in pagination in WordPress and started looking for alternative solutions. I didn’t want to use a plugin, since I wanted it to work across the board – work with blog posts, search results, taxonomies, etc. I stumbled upon this custom method from WPBeginner and gave it a shot. It worked brilliantly. After a few months though, I started noticing a problem – it wasn’t pulling the correct number of total pages, resulting in paged pages with zero results. I ended up looking into the code and have modified it for my needs. Feel free to use this – simply drop this into your functions.php file, then call it in your code with:" />
<meta property="og:description" content="A while ago I was having troubles with the built-in pagination in WordPress and started looking for alternative solutions. I didn’t want to use a plugin, since I wanted it to work across the board – work with blog posts, search results, taxonomies, etc. I stumbled upon this custom method from WPBeginner and gave it a shot. It worked brilliantly. After a few months though, I started noticing a problem – it wasn’t pulling the correct number of total pages, resulting in paged pages with zero results. I ended up looking into the code and have modified it for my needs. Feel free to use this – simply drop this into your functions.php file, then call it in your code with:" />
<link rel="canonical" href="https://davidauble.com/blog/2018/02/14/custom-pagination-wordpress.html" />
<meta property="og:url" content="https://davidauble.com/blog/2018/02/14/custom-pagination-wordpress.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/blog-banner-compressor.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2018-02-14T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/blog-banner-compressor.jpg" />
<meta property="twitter:title" content="Custom Pagination in WordPress" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2018-02-14T00:00:00+00:00","datePublished":"2018-02-14T00:00:00+00:00","description":"A while ago I was having troubles with the built-in pagination in WordPress and started looking for alternative solutions. I didn’t want to use a plugin, since I wanted it to work across the board – work with blog posts, search results, taxonomies, etc. I stumbled upon this custom method from WPBeginner and gave it a shot. It worked brilliantly. After a few months though, I started noticing a problem – it wasn’t pulling the correct number of total pages, resulting in paged pages with zero results. I ended up looking into the code and have modified it for my needs. Feel free to use this – simply drop this into your functions.php file, then call it in your code with:","headline":"Custom Pagination in WordPress","image":"https://davidauble.com/assets/images/posts/blog-banner-compressor.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2018/02/14/custom-pagination-wordpress.html"},"url":"https://davidauble.com/blog/2018/02/14/custom-pagination-wordpress.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Feb 14, 2018</span
          >
        </div>
        <h1>Custom Pagination in WordPress</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 2 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/blog-banner-compressor.jpg" alt="Custom Pagination in WordPress" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>A while ago I was having troubles with the built-in pagination in WordPress and started looking for alternative solutions. I didn’t want to use a plugin, since I wanted it to work across the board – work with blog posts, search results, taxonomies, etc. I stumbled upon this <a href="http://www.wpbeginner.com/wp-themes/how-to-add-numeric-pagination-in-your-wordpress-theme/" target="_blank">custom method from WPBeginner</a> and gave it a shot. It worked brilliantly. After a few months though, I started noticing a problem – it wasn’t pulling the correct number of total pages, resulting in paged pages with zero results. I ended up looking into the code and have modified it for my needs. Feel free to use this – simply drop this into your <strong>functions.php </strong>file, then call it in your code with:</p>

<p><code class="language-plaintext highlighter-rouge">&lt;?php wpbeginner_numeric_posts_nav(); ?&gt;</code></p>

<p>  Here’s the code:</p>

<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>function wpbeginner_numeric_posts_nav() {

    if( is_singular() )
        return;

    global $wp_query;

    if( $wp_query-&gt;max_num_pages &lt;= 1 )
        return;

    $paged = get_query_var( 'paged' ) ? absint( get_query_var( 'paged' ) ) : 1;
    $max   = intval( $wp_query-&gt;posts-&gt;max_num_pages );

    if ( $paged &gt;= 1 )
        $links[] = $paged;

    if ( $paged &gt;= 3 ) {
        $links[] = $paged - 1;
        $links[] = $paged - 2;
    }

    if ( ( $paged + 2 ) &lt;= $max ) {
        $links[] = $paged + 2;
        $links[] = $paged + 1;
    }

    echo '&lt;div class="navigation"&gt;&lt;ul&gt;' . "\n";

    if ( get_previous_posts_link() )
        printf( '&lt;li&gt;%s&lt;/li&gt;' . "\n", get_previous_posts_link('&amp;laquo; Previous Page', $max) );

    if ( ! in_array( 1, $links ) ) {
        $class = 1 == $paged ? ' class="active"' : '';

        printf( '&lt;li&gt;&lt;a href="%s"&gt;%s&lt;/a&gt;&lt;/li&gt;' . "\n", $class, esc_url( get_pagenum_link( 1 ) ), '1' );

        if ( ! in_array( 2, $links ) )
            echo '&lt;li&gt;…&lt;/li&gt;';
    }

    sort( $links );
    foreach ( (array) $links as $link ) {
        $class = $paged == $link ? ' class="active"' : '';
        printf( '&lt;li&gt;&lt;a href="%s"&gt;%s&lt;/a&gt;&lt;/li&gt;' . "\n", $class, esc_url( get_pagenum_link( $link ) ), $link );
    }

    if ( ! in_array( $max, $links ) ) {
        if ( ! in_array( $max - 1, $links ) )
            echo '&lt;li&gt;…&lt;/li&gt;' . "\n";

        $class = $paged == $max ? ' class="active"' : '';
        printf( '&lt;li&gt;&lt;a href="%s"&gt;%s&lt;/a&gt;&lt;/li&gt;' . "\n", $class, esc_url( get_pagenum_link( $max ) ), $max );
    }

    if ( get_next_posts_link() )
        printf( '&lt;li&gt;%s&lt;/li&gt;' . "\n", get_next_posts_link('Next Page &amp;raquo;', $max) );

    echo '&lt;/ul&gt;&lt;/div&gt;' . "\n";
  }
</code></pre></div></div>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#pagination"
          aria-label="View all posts in category pagination"
          >pagination</a
        >
         
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Run WordPress Multi-Site On localhost
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Run WordPress Multi-Site On localhost | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Run WordPress Multi-Site On localhost" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="This is something I have wanted to write about for quite some time. Part of my process involves three environments: local, staging, and production. Most of the sites I build are straightforward single-site setups with a few custom touches. At work, however, I manage several WordPress multisite networks." />
<meta property="og:description" content="This is something I have wanted to write about for quite some time. Part of my process involves three environments: local, staging, and production. Most of the sites I build are straightforward single-site setups with a few custom touches. At work, however, I manage several WordPress multisite networks." />
<link rel="canonical" href="https://davidauble.com/blog/2017/11/17/run-wordpress-multi-site-localhost.html" />
<meta property="og:url" content="https://davidauble.com/blog/2017/11/17/run-wordpress-multi-site-localhost.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/common-code.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2017-11-17T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/common-code.jpg" />
<meta property="twitter:title" content="Run WordPress Multi-Site On localhost" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2017-11-17T00:00:00+00:00","datePublished":"2017-11-17T00:00:00+00:00","description":"This is something I have wanted to write about for quite some time. Part of my process involves three environments: local, staging, and production. Most of the sites I build are straightforward single-site setups with a few custom touches. At work, however, I manage several WordPress multisite networks.","headline":"Run WordPress Multi-Site On localhost","image":"https://davidauble.com/assets/images/posts/common-code.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2017/11/17/run-wordpress-multi-site-localhost.html"},"url":"https://davidauble.com/blog/2017/11/17/run-wordpress-multi-site-localhost.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Nov 17, 2017</span
          >
        </div>
        <h1>Run WordPress Multi-Site On localhost</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 2 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/common-code.jpg" alt="Run WordPress Multi-Site On localhost" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>This is something I have wanted to write about for quite some time. Part of my process involves three environments: local, staging, and production. Most of the sites I build are straightforward single-site setups with a few custom touches. At work, however, I manage several WordPress multisite networks.</p>

<p>If you need a primer, start with the <a href="https://codex.wordpress.org/Create_A_Network" target="_blank">WordPress multisite documentation</a>. For this walkthrough, assume you are taking over an existing multisite with one main site and two subsites, and your local domain is <code class="language-plaintext highlighter-rouge">http://demo.local</code>.</p>

<h2 id="modifying-tables">Modifying Tables</h2>

<p>After importing your database locally, update values in these tables:</p>

<ul>
  <li><code class="language-plaintext highlighter-rouge">wp_[site-id]_options</code></li>
  <li><code class="language-plaintext highlighter-rouge">wp_blogs</code></li>
  <li><code class="language-plaintext highlighter-rouge">wp_options</code></li>
  <li><code class="language-plaintext highlighter-rouge">wp_site</code></li>
  <li><code class="language-plaintext highlighter-rouge">wp_sitemeta</code></li>
</ul>

<h3 id="wp_site-id_options">wp_[site-id]_options</h3>

<p>You will likely have several of these tables, one per site ID in the Network admin. Update the <code class="language-plaintext highlighter-rouge">siteurl</code> and <code class="language-plaintext highlighter-rouge">home</code> values to <code class="language-plaintext highlighter-rouge">http://demo.local</code>.</p>

<h3 id="wp_blogs">wp_blogs</h3>

<p>Change each row in the <code class="language-plaintext highlighter-rouge">domain</code> column to <code class="language-plaintext highlighter-rouge">demo.local</code>.</p>

<h3 id="wp_options">wp_options</h3>

<p>Like <code class="language-plaintext highlighter-rouge">wp_blogs</code>, update the <code class="language-plaintext highlighter-rouge">siteurl</code> and <code class="language-plaintext highlighter-rouge">home</code> values to <code class="language-plaintext highlighter-rouge">http://demo.local</code>.</p>

<h3 id="wp_site">wp_site</h3>

<p>Like <code class="language-plaintext highlighter-rouge">wp_blogs</code>, update each row in the <code class="language-plaintext highlighter-rouge">domain</code> column to <code class="language-plaintext highlighter-rouge">demo.local</code>.</p>

<h3 id="wp_sitemeta">wp_sitemeta</h3>

<p>Finally, there is one more value that can cause issues. In <code class="language-plaintext highlighter-rouge">wp_sitemeta</code>, find the <code class="language-plaintext highlighter-rouge">siteurl</code> entry and set it to <code class="language-plaintext highlighter-rouge">http://demo.local</code>.</p>

<p>That is it. Clear your local browser cache, then log in to the WordPress admin as usual.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#mysql"
          aria-label="View all posts in category mysql"
          >mysql</a
        >
         
        <a
          class="chip"
          href="/tags/#phpmyadmin"
          aria-label="View all posts tagged phpmyadmin"
          >phpmyadmin</a
        >
        
        <a
          class="chip"
          href="/tags/#wamp"
          aria-label="View all posts tagged wamp"
          >wamp</a
        >
        
        <a
          class="chip"
          href="/tags/#mamp"
          aria-label="View all posts tagged mamp"
          >mamp</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Adding Related Posts in WordPress Without a Plugin
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Adding Related Posts in WordPress Without a Plugin | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Adding Related Posts in WordPress Without a Plugin" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="This past week I had yet another challenge: add related posts to a blog entry and make it match a design. It seemed straightforward, especially since all the blog posts are organized by category. As I dug deeper, I realized it wasn’t going to be as simple as I’d originally thought." />
<meta property="og:description" content="This past week I had yet another challenge: add related posts to a blog entry and make it match a design. It seemed straightforward, especially since all the blog posts are organized by category. As I dug deeper, I realized it wasn’t going to be as simple as I’d originally thought." />
<link rel="canonical" href="https://davidauble.com/blog/2017/10/27/adding-related-posts-wordpress-without-plugin.html" />
<meta property="og:url" content="https://davidauble.com/blog/2017/10/27/adding-related-posts-wordpress-without-plugin.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/related-posts.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2017-10-27T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/related-posts.jpg" />
<meta property="twitter:title" content="Adding Related Posts in WordPress Without a Plugin" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2017-10-27T00:00:00+00:00","datePublished":"2017-10-27T00:00:00+00:00","description":"This past week I had yet another challenge: add related posts to a blog entry and make it match a design. It seemed straightforward, especially since all the blog posts are organized by category. As I dug deeper, I realized it wasn’t going to be as simple as I’d originally thought.","headline":"Adding Related Posts in WordPress Without a Plugin","image":"https://davidauble.com/assets/images/posts/related-posts.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2017/10/27/adding-related-posts-wordpress-without-plugin.html"},"url":"https://davidauble.com/blog/2017/10/27/adding-related-posts-wordpress-without-plugin.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Oct 27, 2017</span
          >
        </div>
        <h1>Adding Related Posts in WordPress Without a Plugin</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 2 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/related-posts.jpg" alt="Adding Related Posts in WordPress Without a Plugin" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>This past week I had yet another challenge: add related posts to a blog entry and make it match a design. It seemed straightforward, especially since all the blog posts are organized by category. As I dug deeper, I realized it wasn’t going to be as simple as I’d originally thought.</p>

<p>Let me preface this post by saying <strong>I don’t like using unnecessary WordPress plugins. </strong>I’d much rather build something from scratch that doesn’t have limitations from a plugin. There are times when plugins are necessary, sure, but I’d much rather have something that doesn’t need to be updated constantly or be limited to a plugin’s design.</p>

<p>I should preface this with there are two ways of doing this: display related posts by <strong>tags </strong>and by <strong>categories</strong>. I’ll first demonstrate by displaying related posts by tags. I feel this is the better way to show related posts. <em>Let’s assume this will be going on your default single.php page.</em></p>

<h2 id="related-posts-by-tags">Related Posts by Tags</h2>
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>&lt;div class="related-posts"&gt;
  &lt;?php
    $tags = wp_get_post_tags($post-&gt;ID);

    if ($tags):
      $first_tag = $tags[0]-&gt;term_id;

      $args = array(
        'tag__in' =&gt; array($first_tag),
        'post__not_in' =&gt; array($post-&gt;ID),
        'posts_per_page' =&gt; 2,
        'caller_get_posts' =&gt; 1,
        'orderby' =&gt; 'rand'
      );

      $posts = new WP_Query($args);
  ?&gt;

      &lt;?php if($posts-&gt;have_posts()): while($posts-&gt;have_posts()): $posts-&gt;the_post(); ?&gt;

        &lt;div class="related-posts__post"&gt;
          &lt;a href="&lt;?php the_permalink(); ?&gt;"&gt;
            &lt;?php $image = wp_get_attachment_image_src(get_post_thumbnail_id($post-&gt;ID), 'medium'); ?&gt;
            &lt;img src="&lt;?php echo $image[0]; ?&gt;" alt="" class=""&gt;

            &lt;span class="related-posts__post--title"&gt;&lt;?php the_title(); ?&gt;&lt;/span&gt;
          &lt;/a&gt;
        &lt;/div&gt;

      &lt;?php endwhile; endif; wp_reset_query(); ?&gt;

  &lt;?php endif; ?&gt;
&lt;/div&gt;
</code></pre></div></div>

<h2 id="related-posts-by-categories">Related Posts by Categories</h2>
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>&lt;div class="related-posts"&gt;
  &lt;?php
    $tags = wp_get_post_categories($post-&gt;ID);

    if ($tags):
      $args = array(
        'current_category' =&gt; $tags,
        'orderby' =&gt; 'rand',
        'posts_per_page' =&gt; 2
      );

      $posts = new WP_Query($args);
      while ($posts-&gt;have_posts()): $posts-&gt;the_post();
  ?&gt;
      &lt;div class="related-posts__post"&gt;
        &lt;a href="&lt;?php the_permalink(); ?&gt;" class="related-posts__post--link"&gt;
          &lt;span class="related-posts__post--link--wrap"&gt;
            &lt;span class="related-posts__post--link--wrap__overlay"&gt;&lt;/span&gt;

            &lt;?php $image = wp_get_attachment_image_src(get_post_thumbnail_id($post-&gt;ID), 'blog_image'); ?&gt;
            &lt;img src="&lt;?php echo $image[0]; ?&gt;" alt="" class="related-posts__post--link--image"&gt;

            &lt;span class="btn btn-secondary"&gt;Read More&lt;/span&gt;
          &lt;/span&gt;
          &lt;h4&gt;&lt;?php the_title(); ?&gt;&lt;/h4&gt;
        &lt;/a&gt;
      &lt;/div&gt;
    &lt;?php endwhile; ?&gt;
  &lt;?php wp_reset_query(); endif; ?&gt;
&lt;/div&gt;
</code></pre></div></div>

<p>And voila! I hope this helps.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#categories"
          aria-label="View all posts in category categories"
          >categories</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#tags"
          aria-label="View all posts in category tags"
          >tags</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#php"
          aria-label="View all posts in category php"
          >php</a
        >
         
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      How to Fix Common WordPress Errors
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>How to Fix Common WordPress Errors | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="How to Fix Common WordPress Errors" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="WordPress sites are usually straight-forward and not too complicated to build. However, when you start building your own themes and really digging into the core, you’re bound to run into a few issues. The most common issues are oftentimes the easiest to troubleshoot. This list should help you solve the most common WordPress errors." />
<meta property="og:description" content="WordPress sites are usually straight-forward and not too complicated to build. However, when you start building your own themes and really digging into the core, you’re bound to run into a few issues. The most common issues are oftentimes the easiest to troubleshoot. This list should help you solve the most common WordPress errors." />
<link rel="canonical" href="https://davidauble.com/blog/2017/08/16/fix-common-wordpress-errors.html" />
<meta property="og:url" content="https://davidauble.com/blog/2017/08/16/fix-common-wordpress-errors.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/stop.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2017-08-16T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/stop.jpg" />
<meta property="twitter:title" content="How to Fix Common WordPress Errors" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2017-08-16T00:00:00+00:00","datePublished":"2017-08-16T00:00:00+00:00","description":"WordPress sites are usually straight-forward and not too complicated to build. However, when you start building your own themes and really digging into the core, you’re bound to run into a few issues. The most common issues are oftentimes the easiest to troubleshoot. This list should help you solve the most common WordPress errors.","headline":"How to Fix Common WordPress Errors","image":"https://davidauble.com/assets/images/posts/stop.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2017/08/16/fix-common-wordpress-errors.html"},"url":"https://davidauble.com/blog/2017/08/16/fix-common-wordpress-errors.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Aug 16, 2017</span
          >
        </div>
        <h1>How to Fix Common WordPress Errors</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 2 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/stop.jpg" alt="How to Fix Common WordPress Errors" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>WordPress sites are usually straight-forward and not too complicated to build. However, when you start building your own themes and really digging into the core, you’re bound to run into a few issues. The most common issues are oftentimes the easiest to troubleshoot. This list should help you solve the most common WordPress errors.</p>

<p>1.<strong>WP_DEBUG</strong>
By enabling WP_DEBUG in your wp-config.php file, you’re able to see what WordPress is doing behind the scenes. This is my go-to solution for most issues I encounter. Is the footer suddenly missing? Maybe you’ve forgotten to close a loop. Part of an included template missing? Maybe there’s an error in the embedded template causing it to not display. To call this function, simply:</p>

<p><code class="language-plaintext highlighter-rouge">&lt;?php define('WP_DEBUG', true'); ?&gt;</code></p>

<p>2.<strong>PHP memory</strong>
Sometimes I get an error when parsing through large amounts of records, or when trying to upload larger files through a post, page or custom post type. Generally, increasing the memory WordPress is allowed to use solves this problem. Add this to your wp-config.php file.</p>

<p><code class="language-plaintext highlighter-rouge">&lt;?php define( 'WP_MEMORY_LIMIT', '64M' ); ?&gt;</code></p>

<p>3.<strong>Permalinks</strong>
Sometimes a simple change affects how WordPress handles pages. Did you create a new custom post type that’s not displaying? What about changing a category? Sometimes, setting up a new environment or deploying to Staging/Production will break a site. In these situations, it’s best to reset the permalinks. To do so, in the WordPress admin area, click on <strong>Settings</strong> -&gt; <strong>Permalinks</strong>. Then, choose your URL structure and click Save Changes.</p>

<p>4.<strong>error_reporting();</strong>
Maybe your problem is a little more complicated and using plain PHP. If <strong>WP_DEBUG</strong> isn’t helpful enough, then it’s time to use native error handling, built in to PHP. You have a few options. By setting <strong>error_reporting(0)</strong>, you’re disabling all errors. Setting it to <strong>E_ALL</strong>, you’ll notice you’ll see all errors and warnings. There are other options, but these are the ones I use most often. Check out <a href="http://php.net/manual/en/function.error-reporting.php">PHP’s documentation</a> for more options.</p>

<p>5.<strong>Plugins</strong>
The most basic and simplest step, disabling all plugins. It’s trivial determining which plugin is causing your site to break, however sometimes a plugin isn’t compatible with your version of WordPress or another plugin. By enabling them one-by-one, you’ll be able to determine which plugin is the culprit.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
         
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
        <a
          class="chip"
          href="/tags/#plugins"
          aria-label="View all posts tagged plugins"
          >plugins</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Get WordPress Multisite Table Prefix
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Get WordPress Multisite Table Prefix | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Get WordPress Multisite Table Prefix" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="A while ago I wrote my first plugin for WordPress. It requires the creation of a table, encrypting some data, saving it to a WP table, then finally pushing clean data to Salesforce. Somewhat straightforward, but I learned a lot." />
<meta property="og:description" content="A while ago I wrote my first plugin for WordPress. It requires the creation of a table, encrypting some data, saving it to a WP table, then finally pushing clean data to Salesforce. Somewhat straightforward, but I learned a lot." />
<link rel="canonical" href="https://davidauble.com/blog/2017/08/09/get-wordpress-multisite-table-prefix.html" />
<meta property="og:url" content="https://davidauble.com/blog/2017/08/09/get-wordpress-multisite-table-prefix.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/blog-banner.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2017-08-09T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/blog-banner.jpg" />
<meta property="twitter:title" content="Get WordPress Multisite Table Prefix" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2017-08-09T00:00:00+00:00","datePublished":"2017-08-09T00:00:00+00:00","description":"A while ago I wrote my first plugin for WordPress. It requires the creation of a table, encrypting some data, saving it to a WP table, then finally pushing clean data to Salesforce. Somewhat straightforward, but I learned a lot.","headline":"Get WordPress Multisite Table Prefix","image":"https://davidauble.com/assets/images/posts/blog-banner.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2017/08/09/get-wordpress-multisite-table-prefix.html"},"url":"https://davidauble.com/blog/2017/08/09/get-wordpress-multisite-table-prefix.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Aug 09, 2017</span
          >
        </div>
        <h1>Get WordPress Multisite Table Prefix</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 1 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/blog-banner.jpg" alt="Get WordPress Multisite Table Prefix" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>A while ago I wrote my first plugin for WordPress. It requires the creation of a table, encrypting some data, saving it to a WP table, then finally pushing clean data to Salesforce. Somewhat straightforward, but I learned a lot.</p>

<p>In starting to integrate the plugin to all our sites, I noticed an issue: none of the data was being displayed in my admin panel. After making sure the data was being sent properly, I checked phpMyAdmin to see if the data was actually saved to the database. Sure enough, it was there. Hmm..</p>

<p>Then it dawned on me. When dealing with a single WordPress site, the database structure ALWAYS follows what you’ve set up in the wp-config.php file. With Multisite though, WordPress adds the site ID between the table prefix and the table name.</p>

<p>Since my plugin can be accessed from any of the microsites, it wasn’t important that each microsite had it’s own table. I then looked at the WordPress documentation and noticed this gem:</p>

<pre>$wpdb-&gt;base_prefix;</pre>

<p>This will grab the table prefix outlined in the wp-config.php file, not just the current site’s table prefix. Once I changed this, voila! My entries started appearing.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#php"
          aria-label="View all posts in category php"
          >php</a
        >
         
        <a
          class="chip"
          href="/tags/#mysql"
          aria-label="View all posts tagged mysql"
          >mysql</a
        >
        
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Reference WordPress Dashicons in CSS
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Reference WordPress Dashicons in CSS | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Reference WordPress Dashicons in CSS" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Recently I had an issue where I needed to remove a mega menu plugin in order to improve a site’s PageSpeed score. In breaking it down, I realized the plugin was referencing the WordPress Dashicons, something I would need to add in when rebuilding the navigation menu." />
<meta property="og:description" content="Recently I had an issue where I needed to remove a mega menu plugin in order to improve a site’s PageSpeed score. In breaking it down, I realized the plugin was referencing the WordPress Dashicons, something I would need to add in when rebuilding the navigation menu." />
<link rel="canonical" href="https://davidauble.com/blog/2017/07/20/reference-wordpress-dashicons-css.html" />
<meta property="og:url" content="https://davidauble.com/blog/2017/07/20/reference-wordpress-dashicons-css.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/bg-tools.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2017-07-20T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/bg-tools.jpg" />
<meta property="twitter:title" content="Reference WordPress Dashicons in CSS" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2017-07-20T00:00:00+00:00","datePublished":"2017-07-20T00:00:00+00:00","description":"Recently I had an issue where I needed to remove a mega menu plugin in order to improve a site’s PageSpeed score. In breaking it down, I realized the plugin was referencing the WordPress Dashicons, something I would need to add in when rebuilding the navigation menu.","headline":"Reference WordPress Dashicons in CSS","image":"https://davidauble.com/assets/images/bg-tools.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2017/07/20/reference-wordpress-dashicons-css.html"},"url":"https://davidauble.com/blog/2017/07/20/reference-wordpress-dashicons-css.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Jul 20, 2017</span
          >
        </div>
        <h1>Reference WordPress Dashicons in CSS</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 1 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/bg-tools.jpg" alt="Reference WordPress Dashicons in CSS" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>Recently I had an issue where I needed to remove a mega menu plugin in order to improve a site’s PageSpeed score. In breaking it down, I realized the plugin was referencing the WordPress Dashicons, something I would need to add in when rebuilding the navigation menu.</p>

<p>I looked online and finally found the solution: load the dashicons from the functions.php file.</p>

<pre>
add_action( 'wp_enqueue_scripts', 'load_dashicons_front_end' );

function load_dashicons_front_end() {
  wp_enqueue_style( 'dashicons' );
}
</pre>

<p>Then, in your CSS, simply reference them as a new font:</p>

<pre>.item { content: '\f140'; display: inline-block; font-family: dashicons; }</pre>

<p>I found this snippet from <a href="https://wpsites.net/web-design/adding-dashicons-in-wordpress/" target="_blank">WP Sites</a>. For the complete Dashicon library, look at the <a href="https://developer.wordpress.org/resource/dashicons/" target="_blank">WordPress Dashicon Developer Resource</a>.</p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#dashicons"
          aria-label="View all posts in category dashicons"
          >dashicons</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#css"
          aria-label="View all posts in category css"
          >css</a
        >
         
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
        <a
          class="chip"
          href="/tags/#css"
          aria-label="View all posts tagged css"
          >css</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      How To: Remove Extra Tags from WordPress WYSIWYG Editor
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>How To: Remove Extra Tags from WordPress WYSIWYG Editor | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="How To: Remove Extra Tags from WordPress WYSIWYG Editor" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="From time to time, I find WordPress’ built-in WYSIWYG editor annoying. If you’ve dealt with it much, you know it adds formatting tags around every new line of text. Usually these don’t bother me, as I want my text to be wrapped in paragraph tags or similar. However, for the times I want to extract ONLY the content and not the tags, here’s an easy way to strip all tags from WordPress. Just a word of caution though, these will strip the tags from ALL of your templates." />
<meta property="og:description" content="From time to time, I find WordPress’ built-in WYSIWYG editor annoying. If you’ve dealt with it much, you know it adds formatting tags around every new line of text. Usually these don’t bother me, as I want my text to be wrapped in paragraph tags or similar. However, for the times I want to extract ONLY the content and not the tags, here’s an easy way to strip all tags from WordPress. Just a word of caution though, these will strip the tags from ALL of your templates." />
<link rel="canonical" href="https://davidauble.com/blog/2017/03/30/how-to-remove-extra-tags-from-wordpress-wysiwyg-editor.html" />
<meta property="og:url" content="https://davidauble.com/blog/2017/03/30/how-to-remove-extra-tags-from-wordpress-wysiwyg-editor.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/computer.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2017-03-30T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/computer.jpg" />
<meta property="twitter:title" content="How To: Remove Extra Tags from WordPress WYSIWYG Editor" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2017-03-30T00:00:00+00:00","datePublished":"2017-03-30T00:00:00+00:00","description":"From time to time, I find WordPress’ built-in WYSIWYG editor annoying. If you’ve dealt with it much, you know it adds formatting tags around every new line of text. Usually these don’t bother me, as I want my text to be wrapped in paragraph tags or similar. However, for the times I want to extract ONLY the content and not the tags, here’s an easy way to strip all tags from WordPress. Just a word of caution though, these will strip the tags from ALL of your templates.","headline":"How To: Remove Extra Tags from WordPress WYSIWYG Editor","image":"https://davidauble.com/assets/images/posts/computer.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2017/03/30/how-to-remove-extra-tags-from-wordpress-wysiwyg-editor.html"},"url":"https://davidauble.com/blog/2017/03/30/how-to-remove-extra-tags-from-wordpress-wysiwyg-editor.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Mar 30, 2017</span
          >
        </div>
        <h1>How To: Remove Extra Tags from WordPress WYSIWYG Editor</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 1 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/computer.jpg" alt="How To: Remove Extra Tags from WordPress WYSIWYG Editor" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>From time to time, I find WordPress’ built-in WYSIWYG editor annoying. If you’ve dealt with it much, you know it adds formatting tags around every new line of text. Usually these don’t bother me, as I want my text to be wrapped in paragraph tags or similar. However, for the times I want to extract ONLY the content and not the tags, here’s an easy way to strip all tags from WordPress. Just a word of caution though, these will strip the tags from ALL of your templates.</p>

<p>Add any of these lines to your <strong>functions.php</strong> file.</p>

<p>The Excerpt:</p>

<pre>remove_filter ('the_exceprt', 'wpautop');</pre>

<p>The Content:</p>

<pre>remove_filter ('the_content', 'wpautop');</pre>

<p>All Paragraph tags:</p>

<pre>remove_filter('term_description','wpautop');</pre>

<p>Or, my personal favorite, use functions native to WordPress anywhere in your templates: The Excerpt:</p>

<p><code class="language-plaintext highlighter-rouge">&lt;?php echo get_the_excerpt(); ?&gt;</code></p>

<p>The Content:</p>

<p><code class="language-plaintext highlighter-rouge">&lt;?php echo get_the_content(); ?&gt;</code></p>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
        
        <a
          class="chip chip--lime"
          href="/categories/#php"
          aria-label="View all posts in category php"
          >php</a
        >
         
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script>
      document.documentElement.classList.add("js");
    </script>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="google-site-verification"
      content="mSvQDj528SrivJO3707MQV4uw5aUBxBXMfO9FTZz_sI"
    />
    <meta name="msvalidate.01" content="581C4BBEDA8127FA57A7F2B93320F97F" />

    <link rel="icon" type="image/svg+xml" href="/assets/images/favicon.svg" />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/assets/images/favicon-32.png"
    />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link
      rel="apple-touch-icon-precomposed"
      href="/apple-touch-icon-precomposed.png"
    />
    <meta name="theme-color" content="#000d18" />

    <title>
      Solution: wp_nav_menu Not Appearing on Category Template
    </title>

    <!-- Preconnect to Google Fonts for faster loading -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />

<!-- Load Google Fonts with optimized display strategy -->
<link
  href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
  rel="stylesheet"
  media="print"
  onload="this.media='all'"
/>
<noscript>
  <link
    href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Manrope:wght@400;600&family=JetBrains+Mono:wght@500&display=swap"
    rel="stylesheet"
  />
</noscript>


    <link
      rel="stylesheet"
      href="/assets/css/styles.css?1784631683879932402"
    />

    <link type="application/atom+xml" rel="alternate" href="https://davidauble.com/feed.xml" title="Indianapolis Web Developer" /> <!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Solution: wp_nav_menu Not Appearing on Category Template | Indianapolis Web Developer</title>
<meta name="generator" content="Jekyll v3.10.0" />
<meta property="og:title" content="Solution: wp_nav_menu Not Appearing on Category Template" />
<meta name="author" content="dauble" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Today while working on a site I came across a problem that seemed weird to me. The wp_nav_menu() was working fine on all the pages except for my category page. When I took a detailed look, I found that it was caused by conflict of custom post type.  So how did I fix it?" />
<meta property="og:description" content="Today while working on a site I came across a problem that seemed weird to me. The wp_nav_menu() was working fine on all the pages except for my category page. When I took a detailed look, I found that it was caused by conflict of custom post type.  So how did I fix it?" />
<link rel="canonical" href="https://davidauble.com/blog/2017/03/08/wp_nav_menu-category-fix.html" />
<meta property="og:url" content="https://davidauble.com/blog/2017/03/08/wp_nav_menu-category-fix.html" />
<meta property="og:site_name" content="Indianapolis Web Developer" />
<meta property="og:image" content="https://davidauble.com/assets/images/posts/new-code.jpg" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2017-03-08T00:00:00+00:00" />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:image" content="https://davidauble.com/assets/images/posts/new-code.jpg" />
<meta property="twitter:title" content="Solution: wp_nav_menu Not Appearing on Category Template" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"dauble"},"dateModified":"2017-03-08T00:00:00+00:00","datePublished":"2017-03-08T00:00:00+00:00","description":"Today while working on a site I came across a problem that seemed weird to me. The wp_nav_menu() was working fine on all the pages except for my category page. When I took a detailed look, I found that it was caused by conflict of custom post type.  So how did I fix it?","headline":"Solution: wp_nav_menu Not Appearing on Category Template","image":"https://davidauble.com/assets/images/posts/new-code.jpg","mainEntityOfPage":{"@type":"WebPage","@id":"https://davidauble.com/blog/2017/03/08/wp_nav_menu-category-fix.html"},"url":"https://davidauble.com/blog/2017/03/08/wp_nav_menu-category-fix.html"}</script>
<!-- End Jekyll SEO tag -->


    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=G-N3ZEK1EKQH"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag("js", new Date());
      gtag("config", "G-N3ZEK1EKQH");
    </script>
  </head>
  <body>
    
    <div class="page-field"></div>
    
    <div class="page-grain"></div>
    
    <div class="progress" data-progress aria-hidden="true"></div>
    
    <a href="#main" class="skip-link">Skip to content</a>

    <header class="nav" data-nav>
  <div class="container">
    <div class="nav__inner glass">
      <a href="/" class="brand"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
      <nav aria-label="Primary">
        <ul class="nav__links">
          <li><a href="/#about">About</a></li>
          <li><a href="/#services">Services</a></li>
          <li><a href="/blog.html" aria-current="page">Blog</a></li>
          <li><a href="/#work">Work</a></li>
        </ul>
      </nav>
      <a href="/#contact" class="btn btn-primary nav__cta desktop">Let's talk
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
      </a>
      <button class="nav__toggle" data-nav-toggle aria-expanded="false" aria-controls="navdrawer" aria-label="Open menu">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg>
      </button>
    </div>
    <div id="navdrawer" class="nav__drawer glass" data-nav-drawer hidden style="margin-top:10px;border-radius:var(--r-lg);padding:16px;">
      <ul style="list-style:none;margin:0;padding:0;display:grid;gap:6px;">
        <li><a href="/#about" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">About</a></li>
        <li><a href="/#services" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Services</a></li>
        <li><a href="/blog.html" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Blog</a></li>
        <li><a href="/#work" style="display:block;padding:12px 14px;color:var(--ink-2);border-radius:12px;">Work</a></li>
        <li><a href="/#contact" class="btn btn-primary" style="margin-top:6px;justify-content:center;">Let's talk</a></li>
      </ul>
    </div>
  </div>
</header>


    <main id="main"><article>
  <header class="artHead">
    <div class="container">
      <div class="artHead__wrap">
        <a
          href="/blog.html"
          class="link-arrow"
          style="margin-bottom: 22px; font-size: 0.92rem"
        >
          <svg
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2.4"
            stroke-linecap="round"
            stroke-linejoin="round"
            style="transform: rotate(180deg)"
          >
            <path d="M5 12h14M13 6l6 6-6 6" />
          </svg>
          All articles
        </a>
        <div class="kicker">
          <span>wordpress</span>
          <span style="color: var(--ink-4)">·</span>
          <span style="color: var(--ink-4)"
            >Mar 08, 2017</span
          >
        </div>
        <h1>Solution: wp_nav_menu Not Appearing on Category Template</h1>
        <div class="byline">
          <span class="byline__av">DA</span>
          <div>
            <div class="byline__name">David M. Auble</div>
            <div class="byline__meta">
              Solution Architect · 1 min read
            </div>
          </div>
        </div>
      </div>
    </div>
    
    <div class="container artHero">
      <img src="/assets/images/posts/new-code.jpg" alt="Solution: wp_nav_menu Not Appearing on Category Template" />
    </div>
    
  </header>

  <div class="container artBody">
    <div class="prose">
      <p>Today while working on a site I came across a problem that seemed weird to me. The <strong>wp_nav_menu()</strong> was working fine on all the pages except for my category page. When I took a detailed look, I found that it was caused by conflict of custom post type.  So how did I fix it?</p>

<p>Here is a quick fix. Copy and paste the following code right above the place where you have called the <strong>wp_nav_menu()</strong> function.</p>

<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>&lt;?php
  if(is_category()) {
    $wp_query = NULL;
    $wp_query = new WP_Query(array('post_type' =&gt; 'post','page'));

    wp_nav_menu(array(
      'menu'=&gt;'your_nav_menu',
      'fallback_cb' =&gt; 'false')
    );

    wp_reset_query();
  }
?&gt;
</code></pre></div></div>


      <hr />
      <div class="tagrow">
        
        <a
          class="chip chip--lime"
          href="/categories/#wordpress"
          aria-label="View all posts in category wordpress"
          >wordpress</a
        >
         
        <a
          class="chip"
          href="/tags/#php"
          aria-label="View all posts tagged php"
          >php</a
        >
        
      </div>

      <div class="bio glass">
        <span class="bio__av">DA</span>
        <div>
          <h4>David M. Auble</h4>
          <p>
            Indianapolis-based solution architect. I build, secure, and rescue
            web applications — and write about the tools that make it easier.
            <a href="/#contact">Get in touch →</a>
          </p>
        </div>
      </div>
    </div>

    <aside class="toc" aria-label="On this page">
      <h4>On this page</h4>
      <ul>
        <!-- auto-populated by site.js -->
      </ul>
    </aside>
  </div>
</article>

<!-- RELATED POSTS -->
<section class="section">
  <div class="container">
    <div class="feed-head">
      <h2 class="h3">Keep reading</h2>
      <a href="/blog.html" class="link-arrow"
        >All articles
        <svg
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          stroke-width="2.4"
          stroke-linecap="round"
          stroke-linejoin="round"
        >
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>
      </a>
    </div>
    <div class="related">
       
      <a class="rcard glass card--hover" href="/blog/2026/07/21/communication-skills-separate-senior-devs-from-architects.html">
        
        <img src="/assets/images/posts/communication-skills-architecture.jpg" alt="The Communication Skills That Separate Senior Developers from Architects" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 21, 2026 · Career</span
          >
          <h3>The Communication Skills That Separate Senior Developers from Architects</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/14/three-horizons-model-shipping-today-designing-for-three-years.html">
        
        <img src="/assets/images/posts/three-horizons-model.jpg" alt="The Three Horizons Model: Shipping Today While Designing for Three Years Out" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 14, 2026 · Enterprise Architecture</span
          >
          <h3>The Three Horizons Model: Shipping Today While Designing for Three Years Out</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/07/07/adobe-experience-manager-modern-dxp-stack.html">
        
        <img src="/assets/images/posts/adobe-dxp-stack.jpg" alt="Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jul 07, 2026 · Industry News</span
          >
          <h3>Adobe Experience Manager and the Modern DXP Stack: What Enterprise Architects Need to Know</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/30/what-junior-developers-should-learn-first.html">
        
        <img src="/assets/images/posts/junior-developer-learning-paths.jpg" alt="What Junior Developers Should Learn First: Design, Ops, or Security?" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 30, 2026 · Career</span
          >
          <h3>What Junior Developers Should Learn First: Design, Ops, or Security?</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/23/how-to-think-in-systems-not-tickets.html">
        
        <img src="/assets/images/posts/systems-thinking.jpg" alt="How to Think in Systems, Not Tickets" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 23, 2026 · Enterprise Architecture</span
          >
          <h3>How to Think in Systems, Not Tickets</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/16/developer-to-architect-24-month-skill-roadmap.html">
        
        <img src="/assets/images/posts/developer-to-architect-roadmap.jpg" alt="Developer to Architect: A 24-Month Skill Roadmap" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 16, 2026 · Career</span
          >
          <h3>Developer to Architect: A 24-Month Skill Roadmap</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2026/06/09/enterprise-architecture-for-developers-what-it-is.html">
        
        <img src="/assets/images/posts/ea-what-it-is.jpg" alt="Enterprise Architecture for Developers: What It Is and What It Is Not" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Jun 09, 2026 · Enterprise Architecture</span
          >
          <h3>Enterprise Architecture for Developers: What It Is and What It Is Not</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2024/02/28/getting-started-github-actions.html">
        
        <img src="/assets/images/posts/pexels-realtoughcandycom-11035544.jpg" alt="Getting Started with GitHub Actions" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Feb 28, 2024 · github</span
          >
          <h3>Getting Started with GitHub Actions</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2023/09/01/common-misconceptions-in-wordpress.html">
        
        <img src="/assets/images/posts/wordpress-misconceptions.jpg" alt="Common Misconceptions About WordPress" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Sep 01, 2023 · wordpress</span
          >
          <h3>Common Misconceptions About WordPress</h3>
        </div>
      </a>
      
      <a class="rcard glass card--hover" href="/blog/2022/11/26/private-git-email.html">
        
        <img src="/assets/images/posts/git-1.jpg" alt="Private Email Address via Git Config" />
        
        <div class="rcard__b">
          <span class="rcard__d"
            >Nov 26, 2022 · git</span
          >
          <h3>Private Email Address via Git Config</h3>
        </div>
      </a>
      
    </div>
  </div>
</section>
</main>

    <footer class="footer">
  <div class="container">
    <div class="footer__grid">
      <div>
        <a href="/" class="brand" style="margin-bottom:16px;display:inline-flex;"><span class="brand__mark">DA</span> David&nbsp;M.&nbsp;Auble</a>
        <p class="text-muted" style="max-width:300px;font-size:0.95rem;">Indianapolis-based solution architect. Helping keep the Internet fast, secure, and beautiful.</p>
        <div class="socials" style="margin-top:18px;">
          <a href="https://www.linkedin.com/in/dauble" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.4c0-1.3 0-3-1.8-3s-2.08 1.4-2.08 2.9V21H9z"/></svg>
          </a>
          <a href="https://github.com/dauble" aria-label="GitHub">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2a10 10 0 00-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.1-1.47-1.1-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.89 1.52 2.34 1.08 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.5 9.5 0 015 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0012 2z"/></svg>
          </a>
          <a href="mailto:[email protected]" aria-label="Email">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 7l9 6 9-6"/><rect x="3" y="5" width="18" height="14" rx="2"/></svg>
          </a>
        </div>
      </div>
      <div class="footer__cols" style="grid-column: span 2;">
        <div>
          <h4>Explore</h4>
          <ul>
            <li><a href="/#about">About</a></li>
            <li><a href="/#services">Services</a></li>
            <li><a href="/blog.html">Blog</a></li>
            <li><a href="/#work">Work</a></li>
          </ul>
        </div>
        <div>
          <h4>Connect</h4>
          <ul>
            <li><a href="mailto:[email protected]">[email protected]</a></li>
            <li><a href="https://www.linkedin.com/in/dauble">LinkedIn</a></li>
            <li><a href="https://github.com/dauble">GitHub</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="footer__bottom">
      <span>© <span data-year>2026</span> David M. Auble · Made with ♥ in Indianapolis</span>
      <span style="font-family:var(--font-mono);">davidauble.com</span>
    </div>
  </div>
</footer>


    <script src="/assets/js/site.js"></script>
  </body>
</html>

  <!-- Don't forget to close! -->