How to protect WordPress media files and only allow the users who uploaded them to view

Hello! In the past we have written about how to protect your WordPress media files. In the past exercises we utilized a strategy to set a session cookie with encrypted details that can be read and validated at the http service (i.e. nginx) as well as application (php/wordpress) level. Since then we have refined this process to be much more secure, flexible and efficient. We have abandoned the cookie validation process for verifying the request before serving it and replaced it with a slightly more complicated but much more secure method. First before getting into the details, why would we want to protect WordPress media files? Well the answer depends on what sort of site you have and what you are trying to do, obviously. In our scenario, which isn’t necessarily unique, we have end-users that register for an account in order to check out of a Woocommerce store. We […]

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

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