June 2015 Web Design Meeting Report

At the June meeting, we finished up on how to use the Google Calendar in our sites. We worked on checking for mobile-friendliness. We had two sample sites from last month, one which adjusted correctly to a mobile-size screen and one that did not. The difference was the viewport meta tag, which made the correct sample adjust properly.

We used those two samples to see if we could find utilities that would accurately show how sites would like on different-sized devices. One website we checked returned a false positive reading. But in Opera and Chrome, there are developer utilities that work well as emulators. Hit F12 in Chrome to get to the developer tools. In Opera, click on the logo and activate developer tools from the drop-down menu. Either one lets you choose from a list of devices to emulate.

We then looked at WordPress and noted that a Google Calendar can be embedded into a WP page with the same process of copying and pasting the iframe code from Google.

We closed with a very different way of using Google Calendar in a webpage. With a jquery plugin called FullCalendar, we can create a calendar with javascript and then import our data from Google into that calendar. The process requires getting an API key from Google and then editing the script to import the calendar data. This calendar can be styled more readily than an embedded calendar can, but it does not seem to be mobile friendly right out of the box.

Leave a Reply

Your email address will not be published. Required fields are marked *