WordPress plugin to create animated full screen modal flyouts

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__ ) […]

Create a custom mobile and tablet friendly dropdown menu in WordPress

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 […]

Create your own WordPress shortcode that pulls posts from facebook page

Hello there! In the same vein as our previous post that shows how you could create your own shortcode to pull tweets from a user, we’ve decided to make a similar post that shows how you could pull content from a facebook page and integrate it into your WordPress site. Sometimes it makes more sense to create custom shortcode in WordPress as opposed to creating a full on WordPress plugin. One might consider it overkill to create a WordPress plugin to accommodate integrating a feed such as this. If you envision needing a visual interface to change options such as styling, css and Facebook API keys then you might want to go the plugin route. Creating shortcode is a very efficient and lean way to accomplish full WordPress customization and integration without the overhead that may be required to create a custom WordPress plugin. First things first is we want […]

Create your own wordpress shortcode to pull tweets from a user

Hello! I’m of the opinion that it is better to code your own functions, shortcode and templates to accomplish even simple things within content management systems, as opposed to downloading a free plugin to accomplish the same task. You might be asking “Why not just download a plugin? Its much easier!”. Well that may be true in the short term, but there are many reasons why investing a little bit of extra time to develop a solution in wordpress yourself is better in the long run. I’ll go into the reasoning first and then I’ll get into how we created our own shortcode to pull tweets from a twitter user. Security Security is more important than anything else. When you use someone else’s WordPress plugin to accomplish a task, you are putting all your faith and trust in that developer’s ability to develop a solution that adheres to security best […]

Creating custom post types and pulling them into a custom page template in WordPress

Hello! Occasionally in WordPress it is necessary to push, what is primarily a blogging content management system, to its limits in order to create a dynamic website. The reason why it may be necessary to create a custom wordpress post type is in just that scenario where you need to create custom and dynamic types of content that go beyond what a wordpress blog “post” by default will allow you to modify. For example you may want to create a car website that lists all sorts of different cars and has a multiple car listing page and single car listing pages. Each car could have many fields like color, make, model, year, engine, features and so on. Doing this in a wordpress blog post just wouldn’t work because out of the box you only have fields like post title, categories, tags and post content. While it is possible to simply […]

Automatically tweet your Toronto Real Estate (TREB) listings

Hello! A while ago we released a Python based solution to connect to TREB, pull real estate listings and post it to WordPress. We also posted a brief guide on how to use the Python script. With python, we are using the module wordpress_xmlrpc in order to connect to a wordpress sites via the XML RPC interface in order to search, add, edit and delete posts and content. There is tonnes of documentation out there with respect to how you can , via custom code in Python, Ruby or PHP (to name a few), interact with a WordPress site. We are basically taking the CSV data set from TREB, parsing it for certain listings we are really interested in, grabbing the listing photos and then posting it to wordpress as a blog post. For someone with experience in development, this would be fairly easy to set up and integrate into […]

Detect browser type or device type and assign custom CSS in WordPress

Howdy! With the advent of responsive web design in recent years, developing “mobile only” websites has somewhat become a thing of the past. That is to say we no longer need to maintain a separate version of a website for mobile devices as we once did. All that said, it is sometimes necessary to address things on specific devices or specific browsers. A potential scenario could be that a particular jquery plugin, sticky header menu or HTML form may not work in Safari (for example) where it works fine in IE, FireFox and Chrome. There are quite a lot of differences between all the major browsers that any web developer or web designer should be aware of. A scenario we recently had to deal with here @ Shift8 was a particular WordPress sticky / fixed header menu that was overlapping content only on iPhone devices using Safari. A user on […]

Make your own custom WordPress shortcode for pulling category posts

Hello! WordPress is a great entry level CMS that has a vibrant and extensive development community with many free plugins and offerings to help extend your web installation significantly. Once in a while , either with a significant WordPress update or for other reasons, the default plugins wont cut it. Sometimes when you seemingly want to do something simple, the options that a free plugin may offer either don’t work as advertised or don’t do enough. With wordpress, creating your own shortcode that does its own query for posts is quite easy. Why would you do this when there are so many plugins out there? Well if you create your own custom post type in WordPress and are integrating other plugins or perhaps tieing all those plugins together or even further to that perhaps you want to take the custom post type and pull specific content from that post type […]