Purpose of this document

Developing a project with Mobify doesn't require any changes to your site, but in order to publish any of your optimizations you'll need to add the Mobify tag to your site's source code. The purpose of this document is to explain how to install the Mobify tag on a variety of different document types.


  • Text Editor – if your site uses a back end framework, like PHP, Rails, or Django, you'll need a text editor to make changes to the templates. If you use a CMS like Wordpress or Drupal, you may be able to get away with making template changes in your site's administration instead.

  • Server Access – If you're not using a CMS, it's likely you'll need to make changes to templates directly on the server. You might be able to access these templates with an FTP program, but larger sites with multiple contributors may require you to make changes within your site's version control. If you're not sure how to proceed, talk to your site's administrator for help.

1) Copy the Mobify tag to your clipboard

Each project has its own unique Mobify tag generated for it, so make sure to log into cloud.mobify.com and grab the tag for your project. For Studio projects, you can find the tag by clicking on the Mobify Tag item in the sidebar:

Get tag

2) Install the Mobify tag

This step will depend on your site's back end. We have guides for Wordpress and Drupal, but if you're using another CMS or a back end framework like Django or Rails you may need to consult your documentation to find out where your templates are located.

The goal is to find any HTML templates that control the header of your site. These may be multiple templates or it might be a single template.

Installing in HTML templates

In at least one of your site's templates you ought to see see a <head> tag:

HTML document without Mobify tag

When you've located this tag, place the Mobify tag immediately after it in any template where it occurs:

HTML document with properly installed Mobify tag

Don't worry if <head> has more attributes, simply insert a new line after the closing > character for that tag, wherever you might find it:

HTML document with properly installed Mobify tag

Installing in PHP templates

PHP templates will likely mix PHP code in with HTML, but aside from possibly more code to sift through, the process of placing the Mobify tag ought to be the same as with HTML templates.

PHP template without Mobify tag

Find any occurrences of the <head> tag in your site's templates and add the Mobify tag immediately after:

PHP template with properly installed Mobify tag

Installing in Django/Rails/other templates

With a typical back end framework you are likely to see template tags beyond just HTML. For example, a Django project's header template might look something like this:

Django template without Mobify tag

In most cases you should be able to find the occurrence of <head> and place the Mobify tag immediately after:

Django template with properly installed Mobify tag

Installing in Drupal templates

Ensure html.tpl.php exists in your theme

Starting from the root of the Drupal directory on your server, locate the following path:


{yourSiteTheme} is a named directory that includes your site's theme; if you're not sure which theme your site uses, log in to the Drupal admin and click the Appearance tab - the current theme's name will display (default theme) after its name.

Check to see if a file called _html.tpl.php exists in this path. If so, skip to the next step.

If the file isn't there, you'll need to make a copy of the master file from this directory:


How you accomplish this depends on how you access your site. If you're using an FTP program, download a copy of this file to your local computer, navigate to the second path and upload it there. If you're instead working on a local copy of your site that's checked into a version control system, use Windows Explorer or your Mac's Finder to make a copy of the file and drag it to the second path.


Once you've done it correctly, the full path to this file will be:


Paste the tag

Load this file in your favourite text editor. You'll likely need to scroll down to locate the <head> tag within the template.

html.tpl.php without the Mobify tag

Find it, then paste the Mobify tag immediately afterwards. Chances are <head> will have more attributes as shown in the example below, but don't worry about those. Simply insert a new line after the closing > character for that tag, wherever you might find it, and drop the Mobify tag in that space.

html.tpl.php with a properly installed Mobify tag

Save your changes, and if necessary publish this file to your server.

Clear your cache

It's necessary to clear your Drupal cache at this point to ensure the updated template is applied to your site. Log in to the Drupal admin and click the Configuration tab, then click the Performance option. Near the top you'll see a button labelled Clear all caches - click this, then refresh your site.

Clear cache button

Installing in Wordpress templates

Locate your site's header template

Log into Wordpress, and click on the Appearance item in the sidebar to expand it, then click the Editor item.

Wordpress appearance menu

In the template menu on the right, find the template that contains the <head> tag. In most cases, this will be header.php, but heavily-customized themes may place it elsewhere (and possibly in multiple templates).

Wordpress template

Paste the tag

Locate the <head> tag within the template and paste the Mobify tag immediately afterwards. Don't worry if <head> has more attributes than the example below, simply insert a new line after the closing > character for that tag, wherever you might find it.

Inserted Mobify tag

White space doesn't matter, so if it helps readability you can insert blank lines above and below the tag to help call it out. This is another example of valid tag placement:

Inserted Mobify tag

Click the Update File button to save your changes

Upload File button

If you don't see the Update File button, you may need to adjust permissions on the template you're trying to edit. See the Wordpress Codex for more on file permissions if this applies to you.

Permissions Error

3) Checking placement

Once the tag is in place, save the template. Navigate to the URL you're attempting to validate in your browser, view source and search for MOBIFY. You should see the Mobify tag where you placed it in the rendered template, immediately after the <head> tag.

If you don't, your CMS or framework may require cache flushing or page rebuilding at this point. Consult your documentation for instructions.

4) Validate tag placement

Return to cloud.mobify.com to validate your tag placement. Go to the same tag page where you copied your Mobify tag from, then click the Verify Tag button:

Mobify tag

After following these instructions you should see a success message. Congratulations, you're ready to publish your optimizations! (Note that installing the tag does not cause your optimizations to go live immediately, you'll still need to manually publish through cloud.mobify.com.)


If you come across an error during validation, there are a few things you can try:

Make sure your site is publicly accessible

If you're working off a private development server or any site not publicly accessible, we won't be able to automatically validate. In this case you can still check to ensure you've inserted the tag properly - browse to your site and view source, copy the contents of the HTML and paste into the Verify by HTML field:

Mobify tag

Also make sure to edit your Project's Settings and change the URL of the project to your development server if it isn’t already. You can always change this back to the live site later.

Make sure the tag is there

Check whether the Mobify tag is actually in the template used by the page you're trying to verify. Your CMS or back end framework might use multiple templates, so it's possible the URL you're validating doesn't actually render with the template you added the Mobify tag in. The easiest way to verify is by viewing source of the URL you're attempting to validate and search for MOBIFY. You should see the Mobify tag immediately after the <head> tag.

Ensure the Mobify tag comes directly after the <head> tag

Check your rendered HTML to make sure the Mobify tag comes directly after the <head> tag. That might require bumping existing <meta>, <script> and <style> tags down a bit.

Flush any caches

If you have caching enabled on your server, you may not see the tag show up where expected due to an outdated cache. If this occurs, consult your CMS or framework documentation for instructions on flushing or deleting the cache.

Flushing the Wordpress Cache

If you have a caching plugin like WP Super Cache, you may not see the tag show up where expected. If this occurs you may need to flush your cache.

Last Edited