Hello! We are excited to announce that we have created a brand new website for ourselves! Sometimes its difficult to focus on ourselves when we are so often focused on our clients. With new and exciting projects on the horizon, we thought we would take the opportunity to chip away and eventually launch a new website for ourselves. While previous site was on the Drupal CMS, we decided it would be nice to migrate back to our old friend, WordPress. Though our site may seem kind of simple, there’s a few interesting things that we did that we wanted to share. Mobile Detection with jQuery Why does anyone ever need to detect for mobile devices anymore? Don’t we just use media queries? Well, yes that is the best practice answer. But throw in multiple layers of caching like Memcache, Page caching, Object caching and Varnish caching and you will soon […]
Hello! Creating a unique, original and flexible navigation menu in WordPress can be challenging. There are many commercial and free plugins out there to establish navigation systems, however many of the commercial options seem to be “overkill” providing many bloated options with embedded CSS that can be difficult to adjust by a novice user. What we wanted to do is put together a very simple and clean navigation menu that sticks to the top of the screen and is mobile friendly in a simple yet flexible way. We created a plugin, which you can view by clicking here, to do just that! The plugin utilizes FontAwesome, Modernizr, Google Fonts and CSS from Codyhouse to put together a simple and clean navigation menu solution. Below I’ll walk through the different components that went into this plugin in order to tie everything together in an easy to use solution. Register settings to […]
Hello! We have recently created & submitted our first official WordPress plugin : Shift8 Modal. This is a relatively straightforward plugin that integrates the animatedModal jQuery library into WordPress as an easy-to-use shortcode. Submitting our plugin to the WordPress plugin directyl took roughly 7 days to complete. WordPress has pretty straightforward (though sometimes changing) development policies, standards and best practices to follow. Once approved, a WordPress team member provides SVN access to submit / commit your code to the plugin directory. This plugin is pretty simple in terms of what it does, but I’ll break down what it does. Load animatedModal.js and Animate.css The animatedModal library makes use of the (popular) Animate.css library as well. So we’ll need to load both as an enqueue within the plugin : // Load Animated Modal function shift8_modal_scripts() { wp_enqueue_script( ‘animate-js’, plugin_dir_url( __FILE__ ) . ‘js/animatedModal.min.js’, array(), true ); wp_enqueue_style( ‘animate’, plugin_dir_url( __FILE__ ) […]
Hello! There was a scenario not too long ago where we were required to create a heatmap layer on top of a Google map to plot latitude/longitude coordinates. I thought I’d share the process through which we pull the coordinate data from a MySQL database and plot it into the google map as a heatmap layer. We chose to go with a pre-built jQuery library to handle most of the work interacting with the Google Map api and drawing the heatmap layer itself. For this we chose heatmap.js. From heatmap.js’ website, it is a “lightweight, easy to use JavaScript library to help you visualize your three dimensional data!”. What we’re ultimately trying to do is build a simple PHP page that pulls all the coordinate from a MySQL table, prepares it into a json array and then plots all the points as a heatmap over top a google map location. […]
Hello! In our many instances where we are developing, designing and deploying a WordPress site for a client, it is a constant necessity to implement a mobile / tablet friendly dropdown menu. Because this happens often, we have developed a “starter” mobile menu for our WordPress implementations. We prefer to create a CSS based responsive mobile menu from scratch instead of using an out-of-the-box plugin because although the commercial (or free) WordPress menu plugin may make it much easier to roll out a mobile menu, as soon as the client comes to us with requests for customization, changes, positioning and styling it can become problematic. This is because often times a WordPress plugin such as Superfly or Uber Menu will have their own stylesheets that are prioritized and sometimes difficult to override. This is also true with the built in jQuery effects such as slideouts, fade-ins and anything along those […]
Hello! There is many strategies for securing your code against malicious user input. Some frameworks have checks and balances built in. There are simple standard PHP functions that are designed to strip tags and illegal characters from variables like strip_tags and filter_var. Filtering XSS in PHP Those standard functions are good for basic input filtering, but will not protect you 100%. For example, with strip_tags, you can still escape the filter and inject javascript into the request : http://domain.com/query?name=”style=”margin-top:10px;margin-left:50px;display:block;”onmouseover=alert(/XSS/[-1]);eval(name) a=” So what do you do? Well this post was written to mainly cover SQL injection with MySQL queries in PHP. Before we get to that, I’ll touch on one option which is to create your own customized input sanitize function. The function can be adjusted based on the queries, commands and risk factors that are dependent on the actual function of your code. Using str_replace, you could craft your own […]
Hello! Some may argue that sticky navigation menus (menus that are fixed at the top or bottom of the page as you scroll) are a fashionable web design style. Whether or not its a “fad”, having a navigation bar that is fixed as you scroll throughout the the site is advantageous. This is especially so when you have a page that has a lot of content to scroll through. Keeping the navigation front-and-center as the end-user browses throughout a site will ensure a smooth user experience. Having elements “stick” as you scroll doesn’t have to be just within the context of navigation. You might want to have a sticky newsletter signup, sales chat window or even an e-commerce “cart” block or widget. We thought we would share a simple example that can be injected into any CMS or flat file template. The example includes HTML to generate the menu content […]
Hello! Whether your developing a mobile or web based application, keeping on top of constantly changing data is a challenge on its own. Sometimes its necessary to make repeated calls to your API to pull updates at regular intervals. We wrote a previous blog post describing how to use Ajax to pull JSON data via a RESTful web API (click here to read it). Somewhat extending that sentiment a bit, we would like to walk through the process of creating an Ajax “polling” process that repeatedly polls the API to pull data over and over again. This will allow you to receive, process and manipulate or display the data as it changes. The context through which we are using this process is to display changes made to a google map via geo-location updates to a centralized API server that processes updates and returns them to the end users. This particular […]
Hello! It is sometimes necessary to bridge different web applications together in order to transmit or receive information and process it. One scenario could be a mobile application that connects to a web service to pull or push data in order to update the app or provide “real time” services with centralized data. One of the PHP frameworks we have been working with lately is the aptly named Slim. The Slim framework is a very lean PHP framework that allows for a straight forward path to creating the commonly needed building blocks to produce dynamic web services. First, before we do anything, it would be ideal to set up a web site to host the Slim based API service. In the interest of security it is a good idea to force SSL for all requests. That means you will have to purchase an SSL certificate for your website. This will […]
Hello! Making mobile applications is much easier than it used to be. As with previous posts, we have been experimenting with Apache Cordova Framework for easily building mobile applications, leveraging web frameworks like AngularJS. Many mobile applications communicate with a centralized “server” or website that retains all the data that may be useful for the mobile app. For example you might want to have a mobile application that retains a centralized “friends list” that the end-user can modify. You can store this friends list in a database, and access that data by making an Ajax request to pull the data in json format. For the website that retains and manages this data, we have decided (for this example) to use the PHP Slim Framework. We mainly chose this because it makes rolling out a web based application API with a database backend very simple (in under 30-50 lines of code). […]
