title: How to generate a QR Code for Google Authenticator that correctly shows Issuer displayed above the OTP?
body: <blockquote>
    <p><strong>Warning:</strong>  sharing your TOTP seed with third-parties breaks the very basic assumption of multi-factor authentication that the TOTP
    seed is <em>secret</em>.</p>
  </blockquote>
  
  <p>So, I'm aware of the documentation on this, found here: <a href="https://github.com/google/google-authenticator/wiki/Key-Uri-Format" rel="noreferrer">Google Authenticator Key URI Format</a></p>
  
  <p>When I follow this example from that page:</p>
  
  <pre><code>otpauth://totp/Example:alice@google.com?secret=JBSWY3DPEHPK3PXP&amp;issuer=Example
  </code></pre>
  
  <p>And I 'splice' it into a Google Charts URL, thus:</p>
  
  <pre><code>https://www.google.com/chart?chs=200x200&amp;chld=M|0&amp;cht=qr&amp;chl=otpauth://totp/Example:alice@google.com?secret=JBSWY3DPEHPK3PXP&amp;issuer=Example
  </code></pre>
  
  <p>It will display a valid QR code, and if I scan it with my Google Authenticator app on my phone, it will begin to generate valid OTPs.</p>
  
  <p>However, in the display on the phone, for the entry created by the QR code, I get the OTP, and under it, I get 'Example:alice@google.com'.  What I want, is to have 'Example' displayed <em>above</em> the OTP, and 'alice@google.com' displayed <em>below</em> the OTP.  I can't help but notice that's the way all the professionally produced apps do it.  For example, Google, Wordpress, Amazon, etc.  The company name is <em>above</em> the OTP, and the username is displayed <em>below</em> the OTP.  Yes, this is purely a cosmetic issue, but I want to get it right.</p>
  
  <p>Can anyone offer me a clue?</p>