CSS Combinators

CSS Combinators

In this post we’re going to look at CSS combinators. Aside from having one of the best names of all CSS they are a great way to learn how to create rules for targeting specific elements that are nested within others. To start with lets look at how we would reference an element that is simply inside another. In our first example we’re going to put a paragraph inside a div. <div class=”container”> <p>There once was a kelpie.</p> <div class=”inner”> <p>The kelpie was blue.</p> <p>The kelpie loved to play ball.</p> </div> <p>The kelpie jumped the fence.</p> <p>The kelpie got the ball.<p> </div> If we want the text in all paragraphs to appear in blue text we simply put a p selector after a div selector separated by a space. The space references all p tags that are descendants of the container div. There once was a kelpie. The kelpie was blue.

Continue reading

Dynamic Opening Hours WordPress woman opening store

Dynamic Opening Hours in WordPress

Today we were asked to create a simple dynamic opening hours script to display the closing time of a store based on the current day of the week. The concept is really simple but we couldn't find an example of someone having done this before. All we need to do is get the day of the week from the PHP DateTime object which returns an integer which we'll use to reference an array of closing time statements. Our array starts on Sunday - where the store is closed and ends with Saturday, closing at 12pm. We've added two short strings $start_span and $close_span, the first opening a span tag with the class "top-header-hours" and an icon tag to add a Font Awesome clock-o icon. The span class allows us to add any required CSS. The second string simply closes the span tag. That's all we need. You'll see that the whole thing

Continue reading
Woocommerce Product Category Image

How to add a Woocommerce category page header

Adding a header image or banner to a Woocommerce category page is not terribly difficult but finding out how to do it can be so I’ve written this quick guide as a future reference and to make your life easier if you need to do this too. The first thing that you will want to do is to add a banner image to your product categories. It’d be handy if you could do this with Woocommerce out of the box but at this point in time you can only add a thumbnail. Using thumbnail images is a possible solution but changing the sizes to accomodate large banner images is arguably more trouble than it’s worth. Fortunately there is a handy plugin by Eduardo Stuart for adding images to WordPress categories. Once the images are added to the product categories we will write a simple hook callback function that utilises the

Continue reading

Google Speed Test

Google Test My Site – Page Speed Tester

One of the great maladies of the twenty-first century is that we all have a greatly reduced attention span and when we're looking for a service online this is more significant than ever. According to a Google AdWords report from last year more people than ever are using mobiles to find what they want and online and in fact the number of mobile searches now out weighs the number of desktop searches in a growing number of countries. When we combine these two facts it is apparent that having a mobile friendly site that loads fast and performs well is becoming increasingly important. In fact if a site doesn't display well on mobile then a user is five times more likely to leave than when using a desktop. Did you know that nine out of ten people will leave a mobile website if they can’t find what they’re looking for right away?

Continue reading
WordPress redirect not working

WordPress redirects not working on new domain?

Here's a real simple solution for a not so obvious problem - redirects not working in WordPress after migrating a site to a new domain. The not so obvious part of this problem comes from the way that WordPress dynamically creates content and the permalinks that contain that content - if you look on your server you wont see the directories that match the URLs for your site. So if you have a page with the URL example.com/contact/ you won't find a contact directory in your public_html root directory. You can't see it and nor can the server when it is trying to redirect from that directory to the new URL ie example.com.au/contact/ so the redirect fails. How do you fix it? Really simply you can just create an empty contact directory in your root and the server will redirect to the new page.
Force Awakens Google

Google prepares for The Force Awakens

As you probably already know by now Google has been adding little Easter Egg style animations for a while now, although they’re really obvious for the most part. The latest one is in preparation for the next instalment in the Star Wars series The Force Awakens set for release in just over one week. If you enter ‘a long time ago in a galaxy far far away’ into the search field you will see the results displayed in the famous scrolling text seen at the introduction of the films. If you’re too lazy to type the text into the field just click this link: A long time ago in a galaxy far far away. Enjoy!
Apple Pay

Apple Pay now available in Australia. Mostly.

So having an iPhone or Watch is fairly common here in Australia and one feature that has never been utilised is the Near Field Communication ( NFC ) antenna that can work like the RFID chip used for PayPass on your credit card. The idea is quite simple; you can use your iPhone to make payments at contactless points of sale and also in iOS apps and webapps. As CNET reported back in August there have been delays getting this of the ground as Apple andAustralian banks have been negotiating who gets what cut of the fees and for this reason it it is currently only available for AmEx cards. I did however have a quick chat today with my contact at eWay ( we shamelessly stole their image too ) about Visa and MasterCard and they are expected to be on board shortly but we are yet to get a launch date.

Continue reading