How to display an Alexa rank chart in your website?
Ever wonder how to display an Alexa rank chart in your website? You are in luck, in this tutorial, we are going to show you how it can be done.
In a nutshell, this is how it works. We would query this free Alexa API endpoint once a day to get the Alexa global rank for a specifc website. We then parse the result as XML and send the rank to Google Sheets via IFTTT. Now that we have the rank stored in Google Sheets, we simply need to download it and go through the ranks to retrieve global rank for each month of the year. Once every month of the year is retrieved, it is store in a JSON file and upload it to Azure Blob Storage. In the website, simply show the ranks to user using Chart.js with the data coming from Azure Blob Storage.
Let’s start! We will be breaking down the task to 3.
Head over to IFTTT to create an Applets. If you do not have an account with them, simply create one. IFTTT is a great service that allows you to create chains of simple conditional statements, called applets. An applet is triggered by changes that occur within other web services such as Webhooks, Spotify and many others. For example, an applet may send an email to you when an user retweet your twitter post.
For the “If This”, let’s select the Webhooks.
Specify your event name as add_alexa_rank, and click Create trigger.
Now that we have “If This”, let’s set up the “Then That”,
In your “Then That”, add Google Sheets.
Make sure you select “Add row to spreadsheet” option since we don’t want to overwrite existing ranks.
Here is how I set up my action.
Click Create action follow by Continue button.
Review your changes and make sure it looks good.
If you created the applet successfully, you should see this.
Now that you have the applet ready, let’s get to work!
Get the rank from Alexa API endpoint
We need to set up our config before we can get started.
Now, we would need to set up a cron job to run this guy once a day. Here is how I set it up,
At 9:00 AM every day, the cron job will be responsible to run this script once and output its result to the log file. In case you need help with figuring out your cron job time, check out this awesome website.
Now, we would need to set up a cron job to run this guy once a month. Here is how I set it up,
At 9:00 AM on the 15th of the month, the cron job will be responsible to run this script once and output its result to the log file. In case you need help with figuring out your cron job time, check out this awesome website.
The third task
The third task will show the data to user in the Front-end.
Hopefully your website’s alexa rank will keep going up haha!
Tada! You should now be able to go home and add Alexa rank chart in your website. If you do, please let us know in the comments below. If you happen to have any questions, feel free to ask us in the comments as well!
Hopefully this article will help you and thank you for reading!
I’ll try to keep this list current and up to date. If you know of a great resource you’d like to share or notice a broken link, please let us know.