Viewport Tag

Hello Peeps,

I’ve got a quick tip for any web designer on any platform. It’s called (drumroll), the viewport meta tag. This line of HTML ensures that your website will show up at the correct zoom level for mobile. Now, sometimes without this tag, when you visit a website, you have to zoom out to see the whole page. But when you add this tag, it automatically zooms to the correct level according to the device you’re on.

Now, actually using this tag is simple. Find your header file. For WordPress this file will be called header.php. Then insert these two lines of code:

<meta name=”viewport” content=”initial-scale=1″>

<meta name=”viewport” content=”width=device-width”>

There are other ways to do accomplish the same thing, but the way I described is my personal favorite.

NOTE: In some themes, this may be built in. Just check your header and functions file for the word viewport, and if it has it, remove it, and use the one I told you too. Believe me, it works better.

That’s all for now folks,

Jake Dohm

How to Add Firebug to Safari for iOS

Hey Y’all,

I would like to give credit to Hongkiat.com for showing me the idea of how to do this, and now I’d like to share it with you.

Here is the seven step process of how to install Firebug in iOS Safari browser.

  1. After opening safari, head over to Google (www.google.com)
  2. iPad and iPhone/iPod methods
      1. On iPhone, click the share button Screen Shot 2013-12-17 at 1.20.52 PM in the middle of the bar on the bottom of your screen.
      2. On iPad click the share buttonScreen Shot 2013-12-17 at 1.20.52 PM on the top left of your screen.
  3. Now change the name of the bookmark to FireBug.
  4. iPad and iPhone/iPod methods
    1. On iPhone, click the bookmarks button on the bottom right of your screen.
    2. On iPad, click the bookmarks button on the top of your screen beside the URL bar.
  5. In the bookmarks window, click edit. Then select the bookmark “FireBug” to edit.
  6. Inside the bookmark, change the link url to the following code:

javascript:(function(F,i,r,e,b,u,g,L,I,T,E){if(F.getElementById(b))return;E=F[i+’NS’]&&F.documentElement.namespaceURI;E=E?F[i+’NS’](E,’script’):F[i](‘script’);E[r](‘id’,b);E[r](‘src’,I+g+T);E[r](b,u);(F[e](‘head’)[0]||F[e](‘body’)[0]).appendChild(E);E=new%20Image;E[r](‘src’,I+L);})(document,’createElement’,’setAttribute’,’getElementsByTagName’,’FirebugLite’,’4′,’firebug-lite.js’,’releases/lite/latest/skin/xp/sprite.png’,’https://getfirebug.com/’,’#startOpened’);

7. Now save that bookmark and your done.

Now to use firebug, click on your bookmarks, and then click FireBug. Then the FireBug window should open up at the bottom of Safari.