How to Add Google Analytics to Your Joomla Site in a Future Proof Way!


If you are a website owner then I need not explain the importance of integrating Google Analytics in a website. I would go to the extent of saying that if there is a website, it has to include Google Analytics tracking code because that’s the best analytics tool ever and is available to everyone free of cost.

Adding the tracking code is easy, you just need to copy paste a few lines of Javascript in your web pages. And if you use Joomla then you would find a lot of extensions which gives you an easy way to add the tracking code to your Joomla site. Another way is to copy paste the tracking code in your Joomla website’s active template (frontend) but this approach has a downside. When, and if, you upgrade the template in future, your tracking code will be lost and you would need to add it again.

In the two approaches mentioned above, adding the tracking code via extensions is clearly better since you need not worry if upgrading template might result in loss/overwriting of your tracking code. But even with this approach, there are few issues mentioned below.

  1. A good many number of (specially free) Joomla extensions are one-off efforts by individual developers where they create it, make it available for anyone to use and then forget about it. Such extensions are rarely, if at all, upgraded to keep up with Joomla upgrades. At some point, such extensions fail to work because they no longer support the latest Joomla version which results in Google Analytics not working on your website.
  2. Most of the Joomla extensions for Google Analytics integration typically require your tracking ID only and hardcode rest of the tracking code within their extension. Now if Google makes any changes to their tracking code then the extension would stop working unless,
    • extension developer updates the extension,
    • you uninstall the old version and install the latest version.

    Google doesn’t update such things very often but they did that when they replaced the (now legacy) ga.js tracking code with analytics.js. In short, it’s always a possibility and you would want to be on the safer side.

  3. As mentioned in previous point, such extensions generally require only tracking ID, which looks something like UA-1234567-89, and hardcode rest of the tracking code in their extension using default tracking code. tracking idThough most of the webmasters would be happy with default tracking settings/code, Google Analytics allows you to customize your tracking settings. For example, you can track the activities of individual users by including user identifier in their tracking code and such changes may require additional code which is most likely missing in these extensions. And if you would like to benefit from such capabilities of Google Analytics then you might find yourself in trouble if you rely on such Joomla extensions.

One possible option could be to use a commercial extension which provides you all the features and customization flexibility for Google Analytics integration with good support and roadmap for upgrades/updates. But when Google Analytics itself is free (not talking about the Enterprise version folks), why would you want to pay for an extension to just integrate it in your website?

So what’s the cleanest and future-proof way to integrate Google Analytics in your Joomla website which also doesn’t cost anything?

Here is what I do if I need to integrate Google Analytics in a Joomla site.

  1. Download Sourcerer (free version) from here and install on your Joomla site. Sourcerer allows Joomla administrators to insert code (Javascript, CSS and even PHP) within the editor wherever they want, e.g. inside an article or in a module. It’s a very handy extension and can be used under a variety of situations. You can also use any other extension which provides this capability but I would choose this one over others any day.
  2. Make sure that Sourcerer plugin is enabled.sourcerer plugin
  3. Now go to Module Manager and create a new Custom type module.custom module
  4. From your Google Analytics account, copy the whole tracking code and paste it in the module’s editor. Now surround the pasted code within {source} and {/source} tags as shown below. These tags lets Sourcerer know that editor shouldn’t strips the Javascript code while code
  5. Give any name to the module you like, select Hide option for “Show Title” and “Position” as debug as shown in the image above.
  6. Change to Menu Assignment tab and select “On all pages” as shown on all pages
  7. Save the module and you’re done. Open your website in any browser and view the page source to verify that analytics code that you added is present. If you aren’t sure how to do that, you can just wait for sometime and check your Google Analytics data for same day. It should show at least one visit (you) assuming you visit the website at least once after making all the changes.

Let me quickly try to explain what we did above. Most of the Joomla templates have a debug position which isn’t visible on the website and can be used for a variety of things. Using it for Google Analytics tracking code is a classic example of how you can use it. Using the debug position and ability of Sourcerer to add Javascript code in editor, we added the tracking code in a custom module and published it on all pages. Since the module is enabled on debug position, it’s not visible to end users but code is added to the HTML rendered by Joomla template.

With this approach you’re in full control of the Google Analytics code and it doesn’t require any more efforts than any of the two approaches (adding tracking code in template or using an extension). Further, it’s future proof from Joomla upgrades and template upgrades since custom module type is a native Joomla module. If you ever make any customization to your tracking code or if Google asks you to upgrade your tracking code, all you need to do it copy and replace the tracking code in the module that we created.

The only dependency that we have here is on Sourcerer but I have known that extension since I know Joomla (more than 7 years) and it has been free since then. I don’t see any reason why it would be made paid or discontinued if that hasn’t happened so far.

So now you know the best way to add Google Analytics tracking code to your Joomla website 🙂

And yes, if you ever need website development services for Joomla, e.g. new Joomla website, custom Joomla component development etc, then you can use our Joomla web design services.

[How to] Global progress indicator for ajax requests in jQuery


Showing a loading icon (like the one below) when an ajax request is running is a common practise to ensure end-user is aware that page/information is being updated in background.

ajax loader icon

While developing large scale web applications where one might have numerous ajax requests in the code, it might result in duplication of code to show and hide the loader for each and every ajax request individually.

Instead of writing the code to display and hide the loader for every ajax request, you can add the code below to your layout (common file included in all pages, e.g. footer). But if you do not have a common layout then the code above won’t help you since you’ll end up copy pasting the same code in all files individually which would result in same issue (code duplication) that we are trying to overcome here 🙂

Assuming “loader” is the ID of icon/image (or parent element), you can use the code below.

This would not only save some amount of time which could be utilised for other productive things, it would also help in avoiding unnecessary code duplication. You can use these handlers for anything other than showing/hiding loader as well.

Note that if you are making the ajax request with global option set to false then ajaxStart and ajaxStop events wouldn’t fire. By default global is set to true so you can actually use the global option to control for which requests you would like to show the loader icon. If you do not want to show the loader for a specific ajax request then set global to false. For example,

There are some other global ajax event handlers in jQuery you can refer to see if they suit your use case(s) better.

Happy coding!!!

How to automate Social Media Marketing


If you’re a startup or a small business, it’s likely that you are not able to spend as much time and efforts as you want on social media marketing for your business despite knowing it well that social media can be an incredibly effective way to gain more traffic and generate new leads. Reasons are manifold – lack of time, lack of clarity on where to start, unavailability of affordable tools to manage and automate social media activities, not knowing how to do things the right way and so on.

Wouldn’t it be better if there was a tool which would not only help automating your social media marketing activities but also provides you an effective way to research targeted content to share on social media as per your requirements. Well, you’re in luck because now there is a tool available which does it all, and more.

Let me introduce you to Social Media Marketing Dashboard. It helps reaching your social media goals in the most easy yet in a very efficient way without taking up lot of your time and money. Did I mention it doesn’t cost you a dime? Yes, that’s right. The tool is FREE of cost and there are no limitations on how long you can use it for. All you have to do it create an account and start using it. There is a pro version which comes with more powerful features however you will find even the basic version fully functional and extremely useful.

You must be wondering though this tool sounds great but how does it actually work?

How Social Media Marketing Dashboard works?

  • It finds relevant content including videos, news, trending content all of which can be posted on your social media accounts with the click of a button.
  • It creates incredible image posts without any photo editing experience.
  • It saves time by having all social media in one place with the ability to schedule posts across multiple platforms.
  • It measures all campaign performance to help you get more traffic and generate new leads.

Here is how the social media marketing dashboard would look like once you have setup your account.

Get your free social media marketing dashboard

Get your FREE Social Media Marketing Dashboard

Moving MySQL InnoDB data files


If you ever need to move around MySQL data files for InnoDB tables or getting the error mentioned below then follow the instructions in this post.

Note that this post might be helpful only if you have a backup of complete data files directory from your source MySQL installation. Otherwise please refer to the links at the bottom of this post.

Take backup of your data files (source)

Copy your data files from /usr/local/mysql/data/ on Mac or /var/lib/mysql/ on Ubuntu/Linux to a safe location, e.g. inside your home directory. Location of data files can be different so refer to your MySQL configuration file (my.cnf) for correct path.

mkdir ~/db-files/

On Mac

On Ubuntu/Linux

Do not forget to copy the period (.) at the end of commands above.

Restore files (destination)

Stop the MySQL server on target system, if running.

On the new/target installation, replacing the target data directory contents with source data directory may not work, specifically if you have InnoDB tables.

Take a backup of data files on the destination and keep them safe somewhere in case anything goes wrong. Assuming that target data directory location is /usr/local/newmysql/data/

Extract the compressed archive of source data files.

From the extracted contents, manually copy the database folders under destination data files directory. Do not copy/overwrite any files or folders inside destination data directory, for example sys and mysql folders. For example, if one of the database name is mydb and destination data directory path is /usr/local/newmysql/data/ then execute the following command.

cp -R mydb /usr/local/newmysql/data/

This needs to be done for all your databases one by one. Any files or folders which pre-exist in the target data directory must not be overwritten. If you do then there is a fair probability that you are doomed.

Once you have copied all your databases manually (without overwriting any existing folder or file) to the target data directory, copy/replace ibdata1 file from your source directory to target data directory

Finally, ensure that ownership and permissions of folders and files inside destination data directory are correct. Data directory itself and it’s content must be owned by mysql user, _mysql  in Mac and mysql in Ubuntu/Linux.

On Mac

On Ubuntu/Linux

I am not 100% sure but permissions should be as mentioned below. These permissions work on my Mac correctly.

755 (rwxr-xr-x) for mysql top data directory

700 (rwx——) for each database directory

660 (rw-rw—-) for database files inside database directory

Lastly, restart the MySQL server and verify if everything is as expected.


The most important part is the one related to ibdata1 file. This file stores lot of information and data about your InnoDB tables along with an internal index to all the InnoDB tables. If you don’t replace the ibdata1 file related to your original/source data files then that index would be lost and MySQL would fail to understand the schema and data too would be lost despite having ibd and frm files in place.

Here are links to some useful discussions/posts related to the topic for reference.

What is the ibdata1 file in my /var/lib/mysql directory?

How to restore table stored in a .frm and a .ibd file?

Recovering an InnoDB table from only an .ibd file.

InnoDB Corruption Repair Guide

How to Use Third Party Autoloaders in Yii


Using third party libraries in Yii is super easy. Just put the library, e.g. Google, under vendors directory and add the following lines at the beginning in your controller where you wish to use it.

Alternatively, you can include the first line mentioned above in your Yii application’s main.php imports section as shown below (line 4).

And then include the desired file in your controller (2nd line) before using it. That’s all.

However, you might run into issues if you are integrating a third party library with it’s own autoloader. Yii’s guide has some documentation on how to tackle the situation but it doesn’t work out of the box for most of the people. The reason why integrating third party libraries with autoloaders in Yii isn’t as simple as integrating a non-autoloader library is that third party autoloaders conflict with Yii’s own autoloader.

In such a situation, you can use the code mentioned below and change the path/library as per your requirements in second line. You can use it anywhere in your code (most likely in controller) as needed.

Trick here is to temporarily unregister Yii’s autoload functionality before adding third party autoloader and then re-enabling Yii’s autoloader. You still need to include the vendors directory in your application’s main.php as shown in second code snippet above.

I am not sure if this works in Yii 2 as well, most likely it won’t since Yii 2 is a complete rewrite, but this certainly works in Yii 1.x releases.

How to manually flash the OTA updates on OnePlus One


Couple of months back I bought OnePlus One after my Nexus 4 screen was shattered to bits and pieces when it fell from my hand accidentally. So much for Corning Gorilla Glass 2 protection 🙁

Device came with CM11 and the first thing I did was to root the phone. Few days back, CM12 OTA was release for Lollipop however since I had rooted my phone with TWRP recovery, I did not get the same. So I manually flashed CM12 (YNG1TAS0YL) image. Right after my OnePlus booted with CM12, it started downloading an OTA update (YNG1TAS17L). I was so happy that OTA are working again on my rooted phone. However, disappointment came after OTA download finished and I clicked on “Install Update” button. Few seconds after clicking on it, my phone rebooted and went into TWRP recovery instead of continuing with update installation. I tried numerous times but with no success. Continue reading

Active Menu Highlighting for External Link Type in Joomla


While working on a Joomla website, I realized that if you have an external URL type menu item in your Joomla site then most likely active menu highlighting won’t work for it. Active menu highlighting basically means that the current menu selection is highlighted as a visual clue to show the website user which menu is currently selected. In the example below, currently menu item 2 is shown as selected. Continue reading