All Premium Tutorials

Currently 211 tutorials

Creating A Laravel Contact Form Package

December 5

In this tutorial we're going to create our own Laravel package that will give you all the functionality you need to add a contact form to your website. If you...

Creating A Login Page With Tailwind CSS

November 29

In this tutorial we're going to use the Tailwind utility library to build a login page for a new app. The final result for this login page is going to...

Algolia Custom Query Import With Laravel

November 27

In this tutorial we're going to create a Laravel command we can use to import queried models into Algolia search index by using Laravel scout. What Is Laravel Scout? Laravel...

Creating A Navigation Bar With Tailwind

November 27

In this tutorial we're going to investigate using the new Tailwind CSS library and look into build a navigation bar with tailwinds. If you haven't heard or used Tailwinds have...

Shorthand Comparisons In PHP

November 26

In this tutorial we're going to investigate how we can improve our code by cleaning up unnecessary code by using shorthand code samples in PHP. So what do I mean...

Creating View Classes In Laravel

November 22

In this tutorial we're going to investigate creating view objects in Laravel. This functionality is very useful if you have multiple routes that return the same view in different ways....

Reduce CSS File Size With CSS Purge

November 22

In this tutorial we're going to learn how we can use a JavaScript library called Purge CSS to MASSIVELY reduce the sizes of CSS files. The way it will reduce...

How To Create Your Own Laravel Package

November 14

In this tutorial we're going to learn the how and why we will build a Laravel package. Laravel packages are one of my favourite features of using Laravel, if you...

PHP7 Array Iteration Trick

October 28

In this tutorial we're going to look into a look tip for dealing with PHP array iterations with PHP 7. When you're developing in PHP and need to iterate over...

Laravel Unit Testing Commands

October 17

In this tutorial we're going to learn how you can unit test your Laravel artisan commands so that you can make sure they're doing exactly what you expect them to...

Create Config Files For VueJS

October 16

In this tutorial we're going to learn how you can create different configuration files to be used on your VueJS/Laravel application depending on which environment you're working in. If you're...

How To Validate Requests In Laravel

October 3

When it comes to validation in Laravel there are several ways you can go about this. In this tutorial we're going to investigate the different ways you can achieve this...

Using Homestead Per Project

September 9

When using Homestead with your Laravel projects there are two approaches you can take with it. You can either install Homestead globally and use all your sites on a single...

Using Mailhog With Homestead

August 31

Homestead is a package you can use in your Laravel development to create a local development environment for your application with all the services installed you can use to improve...

Create A Contact Form With VueJS And Laravel

August 30

In this tutorial we're going to learn how we can create a VueJS component for a contact form and create a Laravel API Endpoint that will send the message from...

Laravel Route Model Binding

August 28

This is one of my favourite features of Laravel routing and one of the features I see most underused, it's the model binding on the router. Let's think about the...

Laravel Debugbar Package

August 28

The Laravel debug package is always the first package I install when starting a new Laravel project. This makes it so easy to debug any performance problems you have in...

Creating Your Own Artisan Commands

August 25

Command line scripts can be a big benefit to your application, they're a great way to automate certain tasks or make it easy to get your application up and running...

Designing A RESTful API Tips

July 31

Over the past year I've been doing a lot of work on creating RESTful APIs, from the experience of creating APIs I've learnt a few things that you should try...

Using Font-Awesome With Laravel

July 30

In this tutorial we're going to learn how to use Font-awesome in our Laravel projects while using webpack and mix to compile our assets to use on the front-end. Install...

VueJS Laravel Pagination Component

July 4

In this tutorial we're going to build a VueJS component you can use in your Laravel 5.4 projects when dealing with pagination. A component is one of the most powerful...

VueJS Markdown Editor

July 3

Markdown editors for writing are becoming a lot more popular these days, they make writing very easy you don't have to worry and styling you just write. You can quickly...

CSS Square Roller

June 23

This is part of the CSS loader series that show different loaders that can be used in your application to show the user the app is processing and to please...

CSS Square Loader

June 16

This is part of the CSS loader series that show different loaders that can be used in your application to show the user the app is processing and to please...

Create Model Caching Layer In Laravel

June 7

In this tutorial, we're going to learn how you can create a caching layer in your Laravel application to help speed up your website and reduce the number of requests...

MySQL Workbench And Homestead

June 3

If you do Laravel development then you most likely are using Homestead for your local development environment, if you're not using Homestead then I can't recommend it enough to get...

Create Test Database For Unit Tests On Laravel

June 3

When you're testing your Laravel application particularly with functional tests there will be times where you need to test database interactions, such as if you testing the form posting you'll...

CSS Spring Loader

June 2

This is part of the CSS loader series that show different loaders that can be used in your application to show the user the app is processing and to please...

Deploying With Envoy

May 30

In this tutorial we're going to look at how you can use Envoy to make it very easy to deploy your Laravel applications. Envoy provides a nice blade style syntax...

CSS Speedo Loader

May 26

This is part of the CSS loader series that show different loaders that can be used in your application to show the user the app is processing and to please...

CSS Lined Circles

May 19

This is part of the CSS loader series that show different loaders that can be used in your application to show the user the app is processing and to please...

CSS Hour Glass

May 12

This is part of the CSS loader series that show different loaders that can be used in your application to show the user the app is processing and to please...

Add Pagination To VueJS WordPress Theme

May 8

In this tutorial we're going to add previous and next pagination buttons to the Homepage and the Category page. When using the WordPress REST API to get post you need...

Create 404 Page – VueJS WordPress Theme

May 6

In this tutorial we're going to create the 404 page for the WordPress theme. The 404 page is a page some companies have some fun with here is a page...

CSS Half Circle Of Circles

May 5

This is part of the CSS loader series that show different loaders that can be used in your application to show the user the app is processing and to please...

CSS Full Circle Of Circles

April 28

This is part of the CSS loader series that show different loaders that can be used in your application to show the user the app is processing and to please...

How To Install xdebug on PHP 7.1

April 22

Xdebug is a very useful tool when it comes to PHP development, it's a PHP extension that allows you to profile and debug your PHP code. It even allows you...

Create Date Archives Page – VueJS WordPress Theme

April 22

In this tutorial, we're going to build a date archives page for your WordPress theme so that you can display a list of your previous posts sorted by date. If...

CSS Double Circle Bounce

April 21

This is part of the CSS loader series that show different loaders that can be used in your application to show the user the app is processing and to please...

Create Search Results Page – VueJS WordPress Theme

April 15

In this tutorial we're going to revisit the Creating the Homepage tutorial and create the search form we added to the homepage. In the Homepage tutorial we added a component...

CSS Dot Loader

April 14

This is part of the CSS loader series that show different loaders that can be used in your application to show the user the app is processing and to please...

Create Author Page – VueJS WordPress Theme

April 11

If you have a multi-author blog then you will have information about the author of the post on the page so that user's can find out more about the author...

CSS Walking Circles

April 7

This is part of the CSS loader series that show different loaders that can be used in your application to show the user the app is processing and to please...

Create Category Page – VueJS WordPress Theme

April 5

The next tutorial in the VueJS WordPress theme series we're going to create the category pages for the theme. So far in the theme, we've created the homepage, the blog...

Create Static Pages – VueJS WordPress Theme

April 4

In the last tutorial we setup routes and components for our blog posts, we did this with dynamic routes. In this tutorial, we're going to create the routes and VueJS...

Create The Post Page – VueJS WordPress Theme

April 3

In the previous tutorial, we created the Homepage for the VueJS theme, with the Homepage showing a list of posts with a link to the post page we can now...

CSS Clock Loader

March 31

This is part of the CSS loader series that show different loaders that can be used in your application to show the user the app is processing and to please...

Creating The Homepage – VueJS WordPress Theme

March 27

With the project setup, we can now focus on building the pages we need for the WordPress theme. First we're going to start off with the homepage, throughout this project...

Building The App.vue Component

March 26

The most important component that we need to create is the vue App.vue component, this is the main Vue component that the application will use. This is the file that...

Making API Requests With Axios

March 26

To make requests to the WordPress REST API we need to install another library to help us make these requests. We can use something like jQuery which has helpers for...

Setup The WordPress Routes

March 25

With the styling for the theme setup and ready to go we can set up the routing for the WordPress theme. In a normal WordPress build, this is the section...

CSS Circle Triangle

March 24

This is part of the CSS loader series that show different loaders that can be used in your application to show the user the app is processing and to please...

Setup Styling For The Theme

March 23

For the styling of this project, we'll simply be going to use a CSS framework like Bulma to speed things up. Bulma is a CSS framework that uses SASS and...

VueJS Project Structure

March 23

In the previous tutorial, we created a new VueJS project using the vue-cli command, in this tutorial we're going to investigate what this has done and look into how we...

Building A WordPress Theme Using VueJS

March 22

In this series, we're going to use VueJS to create a WordPress theme using the WordPress REST API to display your WordPress content. I'll try to go through all the...

Creating A REST API With Lumen

March 22

In this article, we will investigate how you can easily create a simple REST API using Lumen. To illustrate this API, we'll create a Books table, and then perform CRUD...

CSS Circle Loader

March 17

This is part of the CSS loader series that show different loaders that can be used in your application to show the user the app is processing and to please...

VueJS Slots

March 14

VueJS Slots is a way of injecting content into your rendered Vue components. This allows the component to become more flexible and reusable. In this tutorial, we're going to investigate...

CSS Box Loader

March 10

This is part of the CSS loader series that show different loaders that can be used in your application to show the user the app is processing and to please...

CSS Block Loader

March 3

This is part of the CSS loader series that show different loaders that can be used in your application to show the user the app is processing and to please...

WordPress REST API Authentication

February 25

In this tutorial, we're going to investigate authentication with the WordPress REST API. By default, the WordPress REST API has some open endpoints and some cookie authentication endpoints. The main...

CSS Battery Loader

February 24

This is part of the CSS loader series that show different loaders that can be used in your application to show the user the app is processing and to please...

CSS Animated Circle Spinner 2

February 17

This is part of the CSS loader series that show different loaders that can be used in your application to show the user the app is processing and to please...

Create A Welcome Page For Your WordPress Plugin

February 12

Whenever you install WordPress or upgrade WordPress you get a nice welcome page that shows you some of the features that you've just installed. Some big WordPress plugins do the...

CSS Typing Loader

February 10

This is part of the CSS loader series that show different loaders that can be used in your application to show the user the app is processing and to please...

Wait For iFrame To Load jQuery

February 5

Recently I've had a project that needed to do some work in JavaScript on code within an iframe. The problem I was facing was that the website inside the iframe...

Deploy Code With Git Push

February 4

In this tutorial we're going to learn about quite possibly the easiest way of deploying your code onto a staging or production environment. In the past it was common place...

CSS Animated Circle Spinner

February 3

This is part of the CSS loader series that show different loaders that can be used in your application to show the user the app is processing and to please...

Modify WordPress REST Endpoint Response

January 29

When working with the WordPress REST API you can get all the information back you need for a specific post. This data will consist of all the standard information such...

CSS Typing Indicator

January 27

This is part of the CSS loader series that show different loaders that can be used in your application to show the user the app is processing and to please...

Create Your Own WordPress Rest Endpoints

January 25

As the REST API is still relatively new there might be some endpoints that don't currently exist such as getting the post archives where you would normally use the function...

CSS Three Circle Loader

January 23

This is part of the CSS loader series that show different loaders that can be used in your application to show the user the app is processing and to please...

Get Posts Between Certain Dates WordPress REST API

January 23

When building your WordPress theme using the REST API one of the pages you might want to correct is the Post archives page that displays all the posts for a...

How To Disable Auto WordPress Responsive Images

January 21

As of 4.4 WordPress will automatically add the srcset attribute to the images in your content. The srcset attribute allows you to define different images to use at different viewport...

Only Allow Access To REST To Logged In Users

January 17

The WordPress REST API is a very exciting feature of WordPress, it was introduced into the core in version 4.7 and is getting a lot of attention from the developers...

Installing Laravel With Homestead

January 16

To get started first we need to install Laravel. Installing Laravel There are multiple ways you can install Laravel, the easiest way you can install Laravel is by using composer....

Building A Weather App With VueJS

January 9

In this tutorial we're going to build a component we can use to display the weather of a location in VueJS. This component will be created with a location search...

VueJS: Single File Components

December 23

When you're defining new components in VueJS you can use the method Vue.component like we've used in a previous tutorial about Vue. This has created a Vue component of todo-item...

VueJS: Mixins

December 22

Mixins are a way of reusing functionality from within your Vue Components. A mixing will use the same properties as a component such as created, methods and when a component...

VueJS: Transition Effects

December 21

VueJS provides an inbuilt way of providing transitions when making changes to the DOM, these can be applied when inserting items, updating items or deleting items from the DOM. Transition...

VueJS: Route Meta Data

December 20

You can add additional information to a specific route by giving it route meta data, this meta data can then be picked up by the router on the beforeEach() function...

VueJS: Vue Router Restricting Routes

December 19

In the previous examples of using the Vue Router we learnt how to build routes and how we can navigate around the application to view the previous examples please see...

VueJS: Vue Router History

December 15

Looking at some of the examples we have of the Vue router you'll notice that the browser is automatically add a hash to the end of the URL. This is...

VueJS: Redirect Unmatched Routes To 404

December 14

Like any other website if the router can not find the URL you're navigating to then you need to display a 404 page to your user for them to know...

VueJS: Vue Router Change Page

December 13

Sometimes while you're developing you find situations where you need to redirect to a different page or go back to the last page. For example you could have a form...

VueJS: Vue Router Child Paths

December 12

In a real world example you'll be creating an application that has a few nested URLs for example a user account will have URLs such as /account /account/security /account/notifications /account/billing...

VueJS: Vue Router Reacting To Route Changes

December 10

The the last example we learnt how to create dynamic routes in VueJs. This allows you to have the same component be reused on multiple page, for example if we...

VueJS: Vue Router Dynamic Routes

December 9

In a previous example we learnt how to use the Vue Router. In this example we just used simple links to a single page. But as you know most apps...

Export All WordPress URLs

December 8

In this tutorial we're going to create a way you can export all of your WordPress URLs into a CSV file. This is very important task to do when migrating...

VueJS: Vue Router

December 7

An important part of a JavaScript website is the ability to show different content depending on the URL you navigate to. In traditional web development this URL will point to...

VueJS: Building A Comments Section

December 5

To carry on through the learning of VueJS we're going to build a real world example of creating a comments section in your website. We're going to use an API...

VueJS: Building A Simple Calculator

November 30

In previous tutorials of VueJS we've learnt the basics of how to use Vue, but we haven't really learning how to build an application. In this tutorial we're going to...

VueJS: Building A Confirmation Modal

November 28

In this tutorial we're going to learn how you can create a deletion confirmation modal in VueJS. This technique is important when you have a form or a link asking...

VueJS CRUD: Product Search

November 26

With a product list on the page it will be a good idea to be able to search through the products by product name so that you can find the...

VueJS: Make API Requests With Vue Resource

November 25

When developing in JavaScript the majority of the ways you get data to show on the screen is through APIs, these will return JSON format of data and parsed by...

VueJS CRUD: Form Notifications

November 25

The notification component will be used to display an alert to the user either success or error. This component requires data to be passed into it via props, this allows...

VueJS CRUD: Delete Product Page

November 24

The Delete Product Page is a confirmation page used to delete the product from the database. It will simply consist of a button to submit the form, on submitting the...

VueJS CRUD: Edit Product Page

November 23

The Edit Product Page will be used to allow a user to edit a specific product. This needs to work off a URL like /product/edit/:id with :id being the product...

VueJS: Vue Components

November 23

In this tutorial we're going to learn how we can create reuseable templates in VueJS by creating Vue components. For this example we're going to re-visit the todo list loop...

VueJS CRUD: Create Product Page

November 22

The Create Product Page will display a form allowing us to fill out new product data and POST this to the API to store the product data in the JSON...

VueJS CRUD: All Products Page

November 21

The first page we're going to create is the All Products page this in very simple at the moment and will display all the products located in the products data...

VueJS: Computed Functions

November 21

In a previous tutorial we learnt how you can add a message to the page in VueJS by using the handlebars syntax. Along with simply outputting data properties on the...

VueJS CRUD: Instantiate Application

November 20

The main.js is the import file for webpack so this is the file that we need to bootstrap the application from. First we need to import Vue which is simply...

VueJS CRUD: Single HTML Page

November 19

This CRUD application will run off a single HTML page, this takes advantage of the VueJS router functionality, by allowing us to replace the components in view by switching out...

VueJS CRUD: Create a Node.js API Using Express

November 18

For this project we're going to build an API from Node.js to process the products we can use in the CRUD application. Normally I would use an API using something...

VueJS CRUD: Install Webpack

November 17

What Is Webpack? The image above sums up Webpack perfectly, it takes your project modules like Javascript, CSS, images and bundles them up into static files for the browser to...

VueJS: Click Counter

November 16

In this tutorial we're going to build a simple click counter using VueJS. For this we're going to simply have a button on the page and on the click event...

VueJS CRUD: NPM To Load Dependencies

November 16

What Is NPM? NPM is the Node Package Manager that is used to install, publish and manage your node programs. If you're coming from a PHP background then you can...

VueJS CRUD: Setup Application

November 15

To start off this project we first need to create and setup the structure of our files. At the root of the project we have index.html package.json README.md server.js webpack.config.js...

CSS Animation Link Underline

October 12

In this tutorial we're going to investigate how you can use CSS animation using transition to create link effects on the hover event of the visitor. Were going to look...

Add Font Awesome To WordPress Menu Items

October 4

Font awesome is a huge library of icons that uses fonts and CSS pseudo selectors to add these icons to your page. This technique means loading the icons is very...

Hotlink Protection On Nginx

September 30

I recently created a WordPress plugin called Redirection Manager which will keep track of all 404s on your website and log the URL and the referrer of the link. In...

CSS Bouncing Arrow

September 28

In this tutorial we're going to learn how you can create an animated bouncing arrow by using CSS, like the example above. You'll see this type of animation on sites...

Fixing Analytics Leverage Browser Caching

September 26

If you've read my previous articles you would of seen a post from last month about trying to reach the 100/100 on Google's pagespeed tool. This doesn't necessarily improve your...

How To Use Page Templates In A Plugin

September 20

In this tutorial we're going to investigate how you can override a theme template files from your WordPress plugins. For this we're going to be using two filters: theme_page_templates template_include...

Change WordPress Default Email From Name

September 18

If you send emails from your WordPress site using the wp_mail() function you might of noticed that the email address and the email name is not being sent as you...

How To Reverse jQuery SlideUp And SlideDown

September 15

By default jQuery slideDown will obviously slide the element down to display the contents and slideUp will slide the element up to hide the contents. What if you want to...

Back To Top Pure JavaScript

August 29

A popular trend you see on many websites is the back to top button, where the user will click this button to automatically scroll back to the top of the...

Build Your Own Responsive Tester Page

May 30

Today with all the different devices we can use on the internet it is very important that your website is responsive and can be viewed in any browser on any...

Using Composer With WordPress

May 21

In this tutorial we're going to investigate using composer as the dependency manager for WordPress. What Is Composer? Composer is a dependency manager for PHP which allows you to easily...

How To Style Broken Images

May 19

The image has disappeared In this tutorial we're going to look at how you can customise broken images like the above to make them a bit more user friendly to...

No More Comment Spam

May 15

Since moving my comments from Disqus back to native WordPress comments I was getting a lot of spam comments a couple every minute. I had the suggested plugins installed like...

Run Code For Multisite On Plugin Activation

May 3

When you're developing a new plugin you may need to run some code on the activation of the plugin. For example if your plugin requires a database table to be...

Restrict Access To WordPress Login Page

April 29

In this tutorial we're going to create a WordPress plugin that can be used to help improve the security of your site by restricting access to the login page by...

Change WordPress Database Prefix

April 4

As WordPress is an open source application all the database table names are known to everyone. If someone knows the name of your database table it makes it easier for...

CSS Responsive Tables

March 25

In this tutorial we're going to look at how we can use tables on responsive layouts and how can we make these tables usable on mobile devices. When tables are...

Get WordPress Image ID By URL

March 22

In a recent project I needed to automatically assign a image to a post from a URL. This situation happened where I had a library of image URLs which on...

How To Create A Show Password Button

March 21

In this tutorial we're going to have a quick look at how you can create a show password button on your register or login forms. When you're creating a register...

Dequeue Styles and Scripts In WordPress

February 27

When developing on WordPress one of the first things you need to learn about is how to add Javascript and Stylesheets to your page correctly. If you're new to WordPress...

Restrict Content Pro Stats WordPress Dashboard Widget

February 16

If you use Restrict Content Pro on your WordPress membership site then you most likely find yourself logging in regularly to check the stats on your site. One of the...

Back To Top WordPress Plugin

February 7

In a previous tutorial I wrote about how you can use jQuery to create a Scroll back to top button. jQuery Back To Top In this tutorial we are going...

Stop WordPress Automatically Adding br

December 11

WordPress uses a function called wpautop to automatically add paragraphs and line breaks to your content from the content editor. This will change double line breaks and convert them into...

WordPress Recent Posts Shortcode

December 10

On WordPress.com you automatically get are a large number of shortcodes that you can use on your blog. Here you can view all the default shortcodes on WordPress.com. One of...

Preserve Variables Between Unit Tests

December 9

Although not strictly unit testing but more functional testing I've been in the situation where I've had to perform automated tests of database interactions. This could be by using a...

Set WordPress Posts To Private By Default

December 8

The following code snippet will allow you to set all your posts to private as default. We do this by using the action post_submitbox_misc_actions and inserting jQuery into the page...

Viewing Localhost Site On A Mobile Device

October 6

In modern web development it's very important that your website is functional on mobile devices. There are a few options that you can use when testing how your website works...

jQuery Build Dropdown From AJAX

July 12

In a recent project I had to correct a lot of AJAX requests that will populate a HTML select dropdown, in this post I'm going to show you a quick...

Colours With Sass Map

June 2

Here is a quick CSS snippet on how you can use Sass maps to create a colour list for your project. Sass maps are a nice way of creating lists,...

Add Required Asterisk With CSS

May 17

A red asterix is a common approach in website UX to show that a form field is required to be filled out by the using before submitting the form. Therefore...

Add Delete Confirmation Modal To Form With jQuery

April 13

In this tutorial we are going to learn how you will add a confirmation modal box to your forms for things like deleting. Most tutorials I've seen on this only...

Media Query Sass Mixin

March 5

If you do any front-end development over the past couple of years then you would of heard of CSS pre-processors. The most common CSS pre-processors are SASS, LESS, or Stylus....

Using Namespacing And Autoloaders In WordPress Plugins

February 17

One thing I have been experimenting with recently is adding namespacing and autoloaders to new WordPress plugins. What Are PHP Namespaces PHP namespaces was introduced in version 5.3. Namespaces is...

Sass Mixins To Get You Started On The Next Project

February 9

If you are unaware of some of the features of Sass that can help speed up your front-end development then I would recommend reading this article on How To Get...

Change Sortable Columns In WordPress

January 23

In a previous tutorial we saw how you can recreate the All Posts table in the WordPress admin area by using the WP_List class in WordPress. It talks about creating...

Migrating WordPress Database To A New Server

November 24

When you are developing any website you will always have different environments for your website, the number of environments you need will depend on the size of the project and...

REM Sass Mixin With Pixel Fallback

October 22

The REM CSS unit is similar to the EM CSS unit except it allows you to size elements relative to the root of the HTML tag, as it stands for...

Add Scripts To Shortcode Only When Used

August 14

Since version 2.5 WordPress introduced a new way of developers to provide dynamic content for the content author of the website with the use of Shortcodes. What Is A Shortcode?...

Get A List Of Registered Actions In WordPress

August 11

WordPress actions and filters is an event driven architecture that allow you to run specific code at certain times in your application. To do this WordPress uses two functions the...

Dynamically Create Classes With SASS

July 3

There are many advantages to using CSS pre-processors like SASS, some of the features allow you to end up writing less CSS code by using inheritance and functions in SASS...

Load Scripts Dynamically With jQuery

June 4

A common tactic to help speed up your website is to use a technique called lazy loading which means that instead of loading everything your page needs at the start...

Remove Comments From Certain Post Types

May 19

In WordPress the default posts and pages both come with comments enabled, this will allow WordPress to display your comment form under your content. But with custom post types you...

Pre-populate Post Type Content

May 12

With custom post types you can separate the content into different section, for example you can post types, pages, portfolio pages and products. If you find that you enter the...

Add Custom Post Types To RSS Feed

May 7

By default WordPress comes with an in-built RSS feed allowing your visitors to subscribe to your RSS feeds to be alerted to your new articles. This will normally consist of...

Force Sub Categories To Use Parent Category Templates

April 23

When doing WordPress theme development the first thing you will learn about is the template hierarchy, this is the order of templates WordPress will use to display the content. WordPress...

Get Image Src With PHP

April 22

There are some occasions where you need to get the attribute value in PHP from a HTML element, this can be for migration reasons or perhaps you are writing a...

File_Exists For Remote URL

April 16

If you want to make sure that a file exists in PHP you can use the function file_exists(), which takes one parameter of the filename. This function will not only...

Sticky Posts In WordPress

April 14

As of WordPress version 2.7 you've been able to assign some posts to be sticky, a sticky post will make sure that this post appears at the top of the...

Redirect Users After Login In WordPress

April 8

WordPress comes with the ability to create different users for your website. Each of these users can have different roles and different capabilities to perform tasks on your website. You...

Equal Height Columns

April 7

If you are displaying a number of columns on your web page then would of probably reached the problem where you need these columns to be the same height as...

Add Custom User Profile Fields In WordPress

April 2

When you are working on projects that need a lot of user management then you can get to the point where you need to add additional information to the users...

Password Protected Pages Excerpt

March 26

When you display list posts in WordPress and want to display a snippet of the post content, there are two ways you can do this. You can either use the...

Hide Content on Password Protected Pages

March 25

On private websites it can be handy to have password protected pages to stop everyone getting at some pieces of content. In WordPress creating a password protected page is very...

Add Upload Media To Library On Widgets

February 26

The WordPress media library is one of my favourite features in using WordPress over other CMS's, when you upload a new image into WordPress it will convert it to a...

Debug WordPress Cron Jobs

February 19

In WordPress you can setup scheduled tasks that allow you to run a certain action at a scheduled time in the day. As this runs a set action you can...

Remove Protected: From Post Titles

February 10

In WordPress you can easily password protect a page from the admin area. All you have to do is under the publish block edit visibility and select password protected. A...

Trim Post Content Outside Of Loop

January 27

The WordPress loop is used in the theme files to display the post content, when you are inside the loop there are two main methods you can use to display...

Stop WordPress Including jQuery Migrate File

January 23

In WordPress version 3.6 when WordPress loads the built in jQuery file it will also load in the jQuery migrate file. The jQuery migrate file was introduced in version 1.9...

Restart CSS Animation

January 13

Since CSS3 we have been able to add CSS animation to our elements, these are relatively easy to setup. An example of a simple CSS animation example is to fade...

Calculate Different Shades Of A Colour

January 7

There are different ways colours are defined the two most popular values in web are HEX or RGB. Both of these values have a logical formula to working out what...

Get All Menu Items In WordPress

December 23

In previous project I had to display a list of categories in a certain order, to get the categories out from WordPress we have a few options we can use...

How To Create WordPress Admin Tables Using WP_List_Table

December 12

WordPress it's not only a CMS it can be used as an application Framework, when it's being used as a framework you will find yourself adding custom data to your...

Create A Clock In CSS

December 10

In this tutorial we are going to walk through the process of creating a ticking clock in CSS, using CSS3 features animation and transform. The animation will start when you...

How To Get Breadcrumbs In Search Results

November 26

If you are ranking well in the search engines but still aren't seeing the amount of traffic you should be from the search results then you need to think about...

Cache Google Web Fonts Api

November 19

Google web fonts is a huge library of free web friendly fonts you can easily use on your website. The fonts are loaded in to your website with Javascript and...

Get Theme Directory In WordPress

November 18

When you doing theme development there are times when you need to reference a file in the same folder of the current theme. You may need to include a file...

Override Sidebars Per Page In WordPress

November 11

In WordPress development you define what sidebars can be used on your theme, these sidebars will then appear on the widget dashboard screen where you can assign all the widgets...

HTML5 Datalist

November 5

Most people use the jQuery library jQuery UI in their applications, this gives you access to a number of useful elements that you can use, these consist of the colour...

Disable Auto Updates In WordPress

November 4

In the past when there is a new WordPress version release the site admin would have to log into the admin area and manually update their website. As of WordPress...

Maintain Last Keyframe Of CSS Animation

October 31

When using CSS animation you can set the keyframes of activities you want the animation to do. For example if you want an element to fade-in you would change the...

Force Browsers To Load Latest CSS And JS

October 30

In modern browsers they will cache most external aspects of the website, they will cache all images and even stylesheets and javascript files of your website. During a website redesign...

Create A Animated Download Icon In CSS

October 16

When you place a call to action on a webpage you normally want the visitors to down something like sign up to your newsletter or download some of your content....

Remove Blog Prefix For Custom Post Types

October 8

This is a problem I've seen a couple of times and it sometimes tricks people out of using custom post types in WordPress. When people first create a WordPress site...

Hide WordPress Update Notice To All But Admins

October 7

When you have built your site on an open source project like WordPress one of the benefits you get is continuous updates and improvements to the core code. WordPress aims...

Create Custom Tables In WordPress

September 12

If you are creating your own WordPress plugin you may want to store data inside the WordPress database. There are a few options that you can use for this, you...

Remove Automatic Paragraphs In Shortcodes

August 7

This post is an extension to the post I wrote some time ago about displaying code snippets on a WordPress site. This post showed how you can create a WordPress...

Create Password Strength Indicator With jQuery

July 22

With security being the biggest problem for most websites it's important to make websites as secure as possible. But after all the precautions a developer can do with their code...

Validate Requests In WordPress Using Nonce

July 3

There are loads requests that you can perform in WordPress from either forms or links that will do things like updating database values or deleting posts. If you are deleting...

Multi Environment WordPress wp-config.php

May 16

When you are developing any website you will always have different environments for your website, the number of environments you need will depend on the size of the project and...

Always Get A Checkbox $_POST Value

April 30

The problem with checkboxes is that if they are not checked then they are not posted with your form. If you check a checkbox and post a form you will...

Add Custom Post Meta Data To Post List Table

April 8

One of the best thing about WordPress is that you can customise almost anything. In the admin area you can see a list of all the posts you have added...

Check If A Sidebar Has Widgets Assigned

March 25

To display a sidebar in your WordPress site you first need to register the sidebar so that WordPress can assign widgets to it. When a sidebar is registered it will...

Dependency Injection With Test Driven Development

March 13

With unit tests you can check that your code behaviours just as you expect it to. When writing your unit tests you shouldn't need to worry about if any other...

Create Your Own WordPress Login Page

February 25

In WordPress you can create your own users and user roles, you can even do this programmatically which means that you can create a register form so that visitors to...

Test Driven Development With PHP

February 20

In a previous post I wrote about the benefits of using Test Driven Development in your application development process. This can be used in all types of development from software...

Test Driven Development

February 11

In this post we will be investigating what is test driven development and how we can use it to improve our development process. What Is Test Driven Development? Test driven...

Alert Theme Users To Required Plugins

February 6

One of things that I've said about premium WordPress themes before is the amount of features that are included in the theme options panel page. Most of these theme options...

Restrict Admin Area To Only Admin Users

January 18

When you create a new user in the WordPress user manager they will be able to login to your site by going to the default WordPress login page /wp-login.php. Depending...

Move Wp-Content Folder To Different Location

November 6

Ever since WordPress version 2.6 you can actually move your wp-content directory to a different location. The wp-content directory will store all your theme files, plugin files and images. Why...

Javascript Full Screen API

October 22

The full screen API is an easy way to get the full web content to be displayed on the page. It's very similar to pressing F11 on your keyboard but...

Display A WordPress Search Form

September 24

Wordpress has an built in search facility which will allow you to search for keywords within your posts search in either the post title or the post content. In order...

Add New Menu Items To WordPress Admin

September 7

If you are a plugin or theme developer then you will get to the stage where you need to add a link to your plugin or theme settings page in...

Create WordPress Post Custom Meta Boxes

September 5

At the bottom of my posts you will sometimes see a couple of embedded tweets near the comments section. Many people have asked me how this appears on the site...

Add Stylesheets To WordPress Correctly

August 8

When you are developing WordPress plugin or theme then you will always get to a point where you want to add a stylesheet to the page so you can use...

Customizing WordPress Comments

July 9

Post comments are an important part of any blog, they give your readers a way of engaging with the author of the article. Comments are the main thing that makes...

Create A CSS 3D Push Button

June 4

In this tutorial we are going to look at how we can use CSS transitions to make it look like a button is 3D when you push it. For this...

How To Register Menus In WordPress

May 3

In a previous snippet we learnt How To Register A Sidebar In WordPress in this snippet we are going to learn how we can easily create custom menus and add...

Show Urgent Messages In WordPress Dashboard

March 14

If you use WordPress dashboard then I'm sure you would of noticed the error messages that are displayed at the top. These will normally be messages from WordPress to let...

How To Use HTML5 GeoLocation API With Google Maps

February 24

In this tutorial we are going to learn how to use the Geolocation API to get your current latitude and longitude, from these results we can then connect to the...

Replace jQuery With CDN In WordPress

January 9

Here is a snippet which allows you to load jQuery from the Google CDN in WordPress. jQuery is a very popular Javascript framework which can do some very powerful things...

Remove WordPress Version Number

October 5

If you have been looking into WordPress security then you will notice that one of the most common solutions to help improve WordPress security is is remove the version number...