Articles > Tutorial

How to create your first Anchor theme, part 2

In the first article we saw the beginnings of a an Anchor theme, as we created the header and got a better understanding how Anchor works under the hood. In this article it's time to get our hands dirty in the posts.php file and with the footer in order to finish our very simple Anchor theme. posts.php ... This is the page where you get all the home page posts, the blog page if you wish, and this is where we’ll perform our main loop and place all our posts. The first thing we need to do is get the header and open our...

How to create your first Anchor theme, part 1

We all know there are a lot of choices when it comes to choosing a CMS for our projects. Sometimes we want something more complex like Wordpress or Joomla that allows us to create a bigger site, but other times you just want a simple good looking blog, and for that Anchor CMS may be the perfect choice. What is Anchor CMS? ... Like its website says, Anchor CMS is a lightweight blog system that allows you to create a blog really easily. Even though it is a lightweight solution it does have some great features that...

How to create Google Chrome extensions

Google Chrome is the most widely used browser, and for good reason: it’s fast, reliable, has a great set of developer tools and to top it all off, it has literally hundreds of extensions in the Google Store you can take advantage of. The other amazing thing is that you can build your own extensions using just HTML, CSS and JavaScript, so it’s not like you need to even learn any new languages. You already know this, you only need to figure out how to apply it to Chrome. There are times you need something specific...
CSS

HTML5 JavaScript Gem Game With Saved Scoreboard

Everyone is talking about HTML5 games and how they are the future of mobile gaming, but where do you start? What is it you need to do to create a game? In short the answer is actually "not much", everything that I will be using in todays tutorial I've already covered in various different guises in my previous tutorials. We'll be using only pure JavaScript and CSS in this tutorial and the images I've used are from the PlanetCute image pack from Daniel Cook Apologies in advance, but this is a fairly length tutorial....

Using HTML5 Drag And Drop To Create A Shopping Cart

The release of HTML5 introduced native Drag and Drop functionality to modern web-browsers. This means it is now possible to have movable elements on screen without the aid of frameworks like jQuery. This week we'll be taking advantage of the drag and drop functionality to create a basic shopping cart. The basic functionality we'll cover, will be adding an item to the cart and if it already exists updating the quantity and totals. Getting Started ... The first thing we'll need is a basic structure for...
CSS

Introducing CSS3 Multiple Backgrounds

CSS3 introduced a novel concept, the ability to specify multiple, layered background images. This allows you to build up an image using smaller parts to create a more complex image. This feature allows you to have one single element instead of one for each image, it also means you don't have to worry about z-indexing as it is automatic. In this tutorial we'll be creating an animated header using layered background images. We're going to then apply an animation to position everything and add some interactive...
CSS

Using CSS3 pseudo-classes and transitions to create interactive links and buttons

Hyperlinks and buttons are a functional yet in general boring aspect of a website or web application. They tend to provide very little feedback when you interact with them. This doesn't have to be the case, it's very easy to add some simple styling to let the user know that they have either interacted with or can interact with an element. Pseudo-classes And Selectors ... Pseudo-classes for links have been in CSS for many years and for the most part people just reset them all to be the same color and text-decoration....
CSS

A Customizable WordPress Weather Widget

In this weeks tutorial we'll be creating a WordPress widget to display the current weather for a specified location. To do this we'll be using the great Weather Underground API. You can sign up for a free developer account here, or sign up for a professional account to get increase request rates. Signing Up ... Once you've signed up and registered for your API key, you should see something like the following. To actually query the API we just need the API key. The Wunderground API does not use OAuth to authenticate...
Load more
Home CSS Deals HTML HTML5 Java JavaScript jQuery Miscellaneous Mobile MySQL News PHP Resources Security Snippet Tools Tutorial Web Development Web Services WordPress