Television although the internet has easily overshadowed it in terms of media consumption is the last 10 years is a hot topic amongst tech blogs, journalists and speculation. First it was talk of Apple wanting to revolutionise TV and now apparently Google might be moving into the TV space as well with its push for high-fibre connections and its internet TV offering for a competitively priced $120 per month in the states.
There are some amazingly high quality themes on Themeforest but for every quality theme there appears to be 10 bad themes. I am not entirely sure how Themeforest reviews a WordPress theme; are claims of responsiveness tested, are test installs performed in different environments, do the reviewers truly use the themes before approving them? I always check the homepage of Themeforest to see what great new themes there are. Funidfy a crowd-sourcing theme in the vain of Kickstarter for WordPress is an amazingly coded theme (not to mention it looks phenonimal). A lot of work has obviously gone into the theme and it deserves every ounce of support and success.
We’ve all been there at one stage or another. You have a grid of items that are floated using float: left but their heights are different. So your items don’t nicely sit within the grid area that you envisioned. Worry not, this simple script I’ve written gets the job done. The plugin will calculate the height of multiple elements and return the tallest height of those elements. The plugin has an example of usage so it should be easy to understand.
If you’re not already using LESS, you should be and I advise you start now or else. As you’ll know developing responsive websites involves taking the desired pixel value dividing it by its parent contextual value and then multiplying by 100 to get the desired percentage. I used to use a calculator back in the day before I discovered LESS. I realised a few developer friends of mine were still doing it the hard way, so I thought I’d share some mixin functions I created and incorporate into my LESS workflow. These could perhaps be merged into one super function, but in responsive development I only ever use percentage widths and margins/paddings left and right values so this works better for me and is for flexible.
Sometimes in WordPress when you want to query a particular page but don’t know it’s ID and know better than to rely on it’s title there is no way to really query it. For example if you had a contact page that used a custom template called, “contact-page-template.php” there is no internal function that does this for you. WordPress stores the page template into a private custom field on each page that has a custom template assigned. Using meta queries, we can query pages by this custom value. The following function will allow you to query a page by it’s template and either return or echo an array of contents as well as support for a single key (you only want the title or url for example).
You can edit any page imaginable in WordPress, except the 404 error page. Usually the 404 error page is only editable by opening up the 404.php file in your WordPress theme directory and changing the content that way. There are plugins which allow you to have custom 404 pages, but there is no point in using plugins if you can do it easily yourself. Wouldn’t it just be simpler if you could edit your 404 page from within the pages menu in the WordPress dashboard? Well, you can.
As you may already be aware of, iOS devices (iPhone, iPad and iPod) do not support the hover event. While this isn’t usually a problem, when it comes to dropdown navigation menus it is a problem because as you’ll discover unless your parent hyperlink doesn’t link anywhere, a user will click a navigation item and be taken to that links location. An example of the scenario is shown below for the visual people.
Whilst recently working on a WordPress theme I needed a way to apply gradients to elements via Javascript without having to write 5 separate lines for supporting the multitude of various browser prefixes for varied support so I wrote a plugin after Googling and not finding anything similar. The plugin is called Gradientizer and can be found on Github here. The plugin is very simple, you can have multiple colours (simply specify the percentage value and colour) and optionally your gradient direction (vertical or horizontal). That’s all there is to it. If you look at the Github repo above you’ll also see a simple example in the README and description showing you how to use it.
There is no denying that the WordPress Theme Customisation API is an awesome addition (added in version 3.4) however there are some things that it can’t do out of the box and if you’re not a super developer capable of creating your own customize classes to create custom sections and settings with textual descriptions then you’re fresh out of luck. The Theme Customisation API has support for a description attribute you can add to your sections like so:
Chances are if you’re developing a responsive website and using a Google map you will encounter an issue where the zoom control and street view control appear to be broken, they’re there but not clickable and look corrupted. The issue is the usual process of developing a responsive site entails of setting max-width: 100% to all images on the site in the form of the following: img { max-width: 100%; } This will also break your Google Map controls. The simple fix is to fix the max-width property by targeting your map container with the following CSS: