Tuesday, March 29, 2016

Responsive design for TheQuotes.net to make it Mobile-Friendly

Few years back, I had published post about using wptouch plugin for making our motivational Quotes website TheQuotes.net

Wptouch made the website mobile friendly. But it had many shortcomings. For example, the free version of this plugin is not having option to show adsense advertisements. I had to manually include the adsense code in the wptouch plugin theme. And, I had to do it again each and every time whenever updating the wptouch with new version.

And, the cooperation between wptouch and wpsupercache is not good. Sometimes, we used to see the mobile version of the cached pages in desktop.
Another important problem with wptouch is, it seems hackers are exploiting it to include malwares. So, I decided to replace the wptouch with responsive design.
I just deactivated/deleted wptouch plugin and replaced the main theme with responsive theme. This simple step made the sites to appear correctly in desktop, tablets and mobile devices without creating any additional issues.

But in case of TheQuotes.Net, I had added lot of custom codings in the main wordpress theme. So, just changing the theme is not feasible. It will require lot of rework. So, I decided to manually change the current theme into responsive theme by adding required code/style changes.

First I added viewport meta tag, and I added few media queries to do the specific style changes related to mobile devices and tablet devices. And, I replaced the old Google Adsense ads with Responsive adunits provided by Google Adsense.

After making these changes, I tested it using Tools provided by Google and Bing to make sure that our site passes the mobile-friendly test.

Are you able to conveniently use our website Thequotes.net in your mobile/tablet devices? If you face any difficulty or error you can inform me or you can participate in this Forum Discussion.

You can subscribe to our Email posts, and you can subscribe to our blog feed.


Anonymous said...

I am excited to read more of your sites content.

Geetha said...

This blog is impressive and informative.It clearly explains about the concept and its techniques.Thanks for sharing this information.Please update this type of information

Search This Blog