November 2011
1 post
5 tags
Create a custom 'tweet this' link including...
Want to create your own Tweet this button so it fits in with your design (or just doesn’t look like the official button) AND you want to include a hashtag?
Well, here’s what you can do:
Create your link around text, an image or whatever else you can think of
Point your href to http://twitter.com/share
Add some querystring variables to generate the tweet
That’s it!
So, the...
October 2011
1 post
4 tags
Create a date ordinal with javascript
Here’s a little javacript function that will get the date ordinal (the bit after the date which can be st, nd, rd or th). It’s by no means perfect, and there’ most likely a more efficient way of doing it, but thought it useful enough to share
function get_date_ordinal(num) {
var end_num = num.charAt(num.length - 1);
var start_num = num.charAt(0);
var abbrev = 'th';
if...
August 2011
1 post
3 tags
Add a 'Clear Cache' shortcut to the Drupal 7 admin...
I don’t know about you, but I just don’t like waiting for different admin panels to load up just to get to the place where I can clear the cache so I can see the changes I just made.
So, I’ve added a shortcut to the Configuration > Performance area of the Drupal admin to my admin toolbar, and this is how I did it:
Click the ‘Edit shortcuts’ link in the admin...
June 2011
2 posts
2 tags
Fix for MAMP when MySQL is not starting →
This just helped me out, so this is for those having the same problem, but mainly posted here so I have a reference of it!
6 tags
Stop the iPad from auto-scaling your background...
I was just in the midst of building a site with a rather large background that spills well outside of the 960 grid the site is built on (2000px of rather large to be exact).
It looked great on the large monitors in the office with this bit of CSS displaying this huge background nicely:
#sitebg {
background-image: url(../img/sitebg.jpg);
background-position: top center;
background-repeat:...
January 2011
1 post
Plan, Then Build.: Writer's Block →
Its an awkward one this. We don’t like to admit it, but as developers or programmers sometimes we just pull a blank card.
You can’t shift into gear. You can’t quite pick yourself up. You’re neurons are just not firing right.
Other metaphors.
You’re trying to, but its just not kicking off for…
October 2010
1 post
4 tags
Adding styles to the drop-down in Wygwam
Wygwam by Pixel & Tonic is a WYSIWYG editor powered by CKEditor 3.4 and CKFinder 2.0.1 and is available as a module for Expression Engine.
It makes it very easy to set up a custom WYSIWYG editor with the just options you want to make available to the website content administrators. It’s dead simple. Until you want to change the styles available in the drop-down.
It would be great if...
September 2010
1 post
5 tags
Formatting the email produced by the Expression...
With my first attempt at producing a ‘simple’ contact form I realised that the email sent by this module is very basic indeed. It reall only caters for a user to enter their name, email address, subject (which you may well have as a hidden field) and message.
It just so turned out that the firtst site I’ve attempted to use this module on is a corporate site, and they generally...
June 2010
1 post
3 tags
How To: Apply jQuery Masonry correctly when using...
jQuery Masonry, by David DeSandro is an excellent jQuery plugin to enhance the layout of a page.
However, you may find that when using images in the content of the divs you are aligning with Masonry, you may get some overlapping where the script has lodaed before your images.
In order to fire the Masonry script once your images have loaded on the page, use the following...
May 2010
1 post
5 tags
Why isn't my Expression Engine SAEF being...
Depending on who you want to see the SAEF (Stand Alone Entry Form), you’ll need to assign the relevant weblog to their Member Group.
In my case I have a form that a registered member can submit news to, but it’s not displaying on the front end. In order to correct this, log in to the Expression Engine control panel and go to:
Admin > Members and Groups > Member Groups > Edit...
April 2010
2 posts
5 tags
Change how often users can search in Expression...
Some settings can be an absolute nightmare to find in the Expression Engine Control Panel, and the setting for how often a user can search your site is one of them.
By default, these are the restrictions on the search priveleges for member groups:
Admins = No restriction
Members = 10 seconds
Guests = 15 seconds
Pending = 15 seconds
Banned = 60 seconds
In order to change these, you’ll...
6 tags
Blog comments: The fuel of the design community...
I’m not much of an article writer, especially on opinions, although I did do one a while ago about my iPhone, and there are some rangom things on here. But the majority of stuff I post is intended as a record of things I’ve learnde which may help me again in future, or hopefully benefit others who come across the same development issues. With that said, here I go anyway:
I used my...
March 2010
3 posts
A Non-Blog: Weirdness in Expression Engine. →
The text should say something like, “xx posts in xx categories have generated xx comments.”
Including the post you’re reading, the weblog called blog (I know, right) has 5 posts, 6 categories, and 22 comments (mind you, this is all in experimental phase right now).
My solution spits out 5…
8 tags
Convert a Unix Timestamp using a MySQL Query
Many, many times have I had to convert a MySQL timestamp (YYYY-MM-DD HH:MM:SS) into a more human readable format directly from a MySQL query. I’ve always done this with DATE_FORMAT.
Today, however, I needed to do something a little different. A Unix formatted timestamp held in the database needed to be converted to a human readable format.
And this is the answer I came across, the rather...
9 tags
How To: Log member login activity in...
I was looking for a way to create a historical log of every member that logged into an ExpressionEngine site. I came across the Statistics module which I was hoping would do the job, but this module only worked to display statistics of users currently logged in to the site, very much akin to what you would see in the footer of a forum.
What I needed to do in this case was to log a timestamp of...
February 2010
3 posts
3 tags
ExpressionEngine Edit Menu Extension →
Extremely useful extension for the ExpressionEngine Control Panel. It adds a drop-down menu to the Edit tab in the same mould as the Publish tab. This will save you a LOT of time when editing content.
5 tags
What can Apple do to make me keep an iPhone?
It was the best timing possible for me. My Orange contract was up in less than a month, and Apple go and sell their flagship mobile talkie device on a service provider other than O2. Rejoicing occured.
Before jumping ship on my Nokia n95 8GB, I considered the drawbacks;
Poor camera in comparison. Ah, I don’t use it that much anyway.
Storage limited to iTunes. That 16GB iPhone may be...
5 tags
How to: Allow duplicate screen names in...
I’ve been working on a site which users must register to gain access. I’ve removed the need for a user to create a unique username by using their email address for their username. This also removes the need for the email field on the registration form.
However, the screen name, which I’m currently using to welcome the user to the site in a personal fashion, has to also be...
January 2010
15 posts
7 tags
Short Web Design Tips #16
Make your copy easier on the eye.
Avoid stark contrasts.
For example, if your text is on a white background (#FFF), rather than black text (#000), use something slightly lighter like #222.
Alternatively, you can reverse the effect and make the background slightly darker and keep the text black.
The other side of this coin is to ensure you have “sufficient contrast”. Here is some...
5 tags
How To Fix The eval()'d code Error in Expression...
Today I came across the eval()’d code error in core.functions.php in ExpressionEngine.
It occurred when I was posting the result of a form to the same (PHP enabled) page, which would update the page content depending on what the user had selected.
The problem was that I was attempting to use the $_POST variable to highlight the selected <option> in a <select>. Since the $_POST...
8 tags
Short Web Design Tips #15
Validate your code.
Why?
Well, the W3C can tell you why you should validate your code, and they do a much better job of telling you what you need to know than I would. But I will list the basic reasons if you can’t be bothered to click the link:
Validation used as a debugging tool
Future-proof quality checking
Helps teach good practices
Gives a sign of professionalism
How?
...
4 tags
The Must Have Firefox Add-ons for Web Developers
I mentioned one of the Firefox Add-ons I use during the web development process in my previous post, and having just upgraded my OS and having to install Firefox afresh, it got me thinking about the add-ons I install every time as a ‘must have’.
These are the add-ons that I go out and download everytime I have a fresh install since I use them just about every single day:
Web...
6 tags
Short Web Design Tips #14
Indent your code.
Quite simple reasoning to this one, it makes it easier to read. I mean, what would you rather look at when coding? This:
<html>
<head>
<title>This is our home page</title>
</head>
<body>
<h1>Hello World!</h1>
<p>Here's a list of random stuff:</p>
<ul>
...
5 tags
Line breaks in submit buttons
Just a quick one.
I’ve recently had the need to use a submit button in a web form, with no CSS styling and without using an image (the client wanted it to look like a standard form button), which had to have the value text of the button on 2 sperate lines.
Using the <br /> tag didn’t work, and neither did the use of ‘/n’. So after a bit of digging I found an ascii...
8 tags
Short Web Design Tips #13
Comment your code.
It doesn’t really matter what code you’re writing, whether it’s HTML, PHP, CSS, Javascript or anything else, commenting your code can become very important.
There are a number of reasons why we should look to comment our code;
If someone else has to work with your code, it will help them decipher what the hell is going on.
It can be used to search for a...
5 tags
Short Web Design Tips #12
Test, test and test again.
It is a fairly obvious one this, but it’s amazing how many bugs and errors can slip past the radar during development. The internet is a notoriously difficult medium to test on (yes, we all hate IE6, deal with it), since a website is generally intended for everybody in the world to see.
Every single user can view the website at a multiude of resolutions,...
3 tags
jQuery Slideshow Bookmarks →
Since I’m currently working on a bespoke jQuery based slideshow today, here’s a link to some examples, tutorials and inspiration.
6 tags
Short Web Design Tips #11
When to use tables for layout.
This post would be much shorter if I could just say NEVER!
However, there are two instances when you should use them. One is the correct reason for using tables, the other is unfortunately borne out of necessity.
You should use tables for: tabular data.
The key word there is data. It is to be used when you have information to present that would best be displayed...
6 tags
Short Web Design Tips #10
How to get what you need from a client.
It can be a bit of a nightmare getting the information you need in order to get the job done as efficiently as possible. If you know what you need, why not let the client know?
Without being condescending (this is very important), spell out everything that you need for a piece of work, whether it be for a large amount of content or a minor update. The more...
5 tags
Display a list of recent searches in...
Using the {exp:query} tag in the licensed version of ExpressionEngine, you can pull the most recent searches performed by your users. The snippet below pulls the last 3 searches that returned a result, and links to the relevant search results page:
<ul class="recentsearches"> {exp:query sql="SELECT * FROM exp_search WHERE total_results > 0 ORDER BY RAND() DESC LIMIT 3"} ...
5 tags
Short Web Design Tips #9
Choose the right CMS.
Don’t decide what CMS platform you’re going to use before you’ve got the brief.
Forcing a complex site into WordPress will cause more problems than it’s worth. Using something like Magento can be overkill for an e-commerce site selling just a handful of products.
Get your site requirements down on paper, then see what fits best. I tend to stick to...
4 tags
Displaying forum topics from the ExpressionEngine...
As is usually the case with forums attached to a main site, the forum is kept seperate in either a folder (yourdomain.com/forums) or a sub-domain (forums.yourdomain.com).
With the Expression Engine Discussion Forum Module, it’s easy to display your most recent topics in one of your main website templates. This is a snippet of the code I’ve used to display and link through to the top 5...
8 tags
Short Web Design Tips #8
Step beck for some perspective.
Everyone gets a mental block at some time or another, whether it’s during planning, designing, or coding.
You’ll be amazed at what can happen if you step back when you “can’t see the wood for the trees”.
Simply take a break, go for a walk, make a cuppa, or work on something else. When you come back to it, whether in 5 minutes or 5...
December 2009
9 posts
2 tags
A Christmas Card from Triad →
Merry Christmas everybody! Here’s our office Christmas card if anyone wants to take a look at our festive mugs!
6 tags
Short Web Design Tips #7
When to use pagination.
Web pages are not the same as those in a book. Browsers let you scroll. Pages in a book have to be turned (if you want to keep reading of course).
I’ve seen a number of blogs that use pagination for relatively short articles, which seems to me to be needless. A good example of pagination on a long article can be found on the SitePoint website.
The main use of...
8 tags
Short Web Design Tips #6
Treat IE6 better than CSS3 supporting browsers.
I’ve seen a large number of tweets and blog postings say how great CSS3 is, and how to use it. Hell, I’ve used it myself. The thing is, only the newest browsers support what is still (in the majority) a working draft of the CSS3 specification.
According to the damned lies statistics (November 2009 browser stats from ars technica), IE6...
6 tags
Short Web Design Tips #5
Organise your content before your site plan.
If content truly is king, as I’ve read that it is many, many times, then spend more time with it.
Your content can be the main factor in forming your site plan. Organisation of information will produce a clear structure which can be put to use as the framework of content around which a site can be built.
Then you only need to worry about design...
4 tags
Short Web Design Tips #4
Tell the user where they are.
Whatever the hierarchy of pages in your site, a user must know where they are, and where they can go.
Simple highlighting, or other indications (such as an icon or arrow) on the menu and sub-menu items will suffice, or perhaps a breadcrumb trail for sites with a large amount of pages.
If a user is going through the motions of a set process, such as a checkout, it...
7 tags
Short Web Design Tips #3
Make your content readable.
Making the text on your website easier on the eye is just one line of CSS away, so there should be no excuse for you not to do this.
p { line-height: 1.5em }
I find that this line height is usually optimal for the main text content on a page.
7 tags
Short Web Design Tips #2
Only apply solutions to problems.
Deny the urge to crowbar a cool new gallery/slideshow/other cool jquery plugin into a site just because it’s ‘cool’.
If you find something great, bookmark it. Don’t create the need for an unnecessary solution where there is no problem.
One day, you’ll have a unique situation where one of those finds will fit the bill perfectly, and that is the time to implement...
5 tags
Short Web Design Tips #1
Design using a grid system.
It doesn’t matter which CSS framework you end up building the final site with, or if you write your CSS from scratch, the idea is to have a well structured layout.
A set amount of spacing between sections of content throughout will bring uniformity and an organised feel to the site, even in a ‘non-standard’ layout.
7 tags
Displaying a list of Weblogs with a particular...
This may only be useful in particular circumstances (most obviously when using ExpressionEngine), but nonetheless it was useful to me, so here it is:
I have a number of Weblogs set up for managing the content on a website. The majority of these have been assigned to a ‘Static Content’ field group, and it’s these weblogs that I intend to use as menu links, with the individual...