MAMP Error – “You don’t have permission to access /MAMP/ on this server.”

February 16th, 2010

If you’re seeing this message when trying to view MAMP, chances are you have just been amending a Wordpress on your localhost and have altered the url’s ready for upload to a live server? Sound about right?

Same thing happened to me and I found this blog post that detailed the solution:

Basically, browse to the root of your hard drive and delete the .htaccess file (it should show today’s date but if you’re super cautious renaming the file will work too).

However, if you can’t see this file in the root, there’s a chance your OSX isn’t showing the system files. To see system files fire up Terminal (Appications > Utilties > Terminal.app) and enter the following:

defaults write com.apple.finder AppleShowAllFiles TRUE
killall Finder

When you’ve deleted the file, if you want to re-hide the system files enter the following in Terminal and hit return:

defaults write com.apple.finder AppleShowAllFiles FALSE
killall Finder

Good old MAMP should fire up properly again now. Phew, that was a relief…

Bookmark and Share

Chicubes 2010 re-design. Cubecart enhanced with jQuery

February 15th, 2010

Chicubes is a website I first built back in 2008. 2010 meant it was time for a design refresh to reflect the growth of the company.

The basis for the store is Cubecart. However, besides created a completely bespoke ’skin’ for the store, I’ve added lots of jQuery to add enhanced functionality and done quite a bit of search engine optimisation with the site to provide better Google rankings. Read the rest of this entry »

Bookmark and Share

Internet Explorer 6: let’s kill it…

February 3rd, 2010

I’m extremely encouraged that the calls for companies to upgrade away from Internet Explorer 6 are intensifying. If you’re reading in the UK, there’s now an online petition to register your feelings on Microsoft’s crippled and ageing browser (it was released in summer 2001 no less). If your outside the UK, sign the Twitter based equivalent.

IE6 is both slow and insecure and if you’re using it as your primary browser, it’s likely your view of the world wide web is extremely limited. The motoring equivalent of driving a 1982 model car when you could have a 2010 model, complete with ABS, traction control, Air Con etc (for free)!

From a designer’s point of view, making a website Internet Explorer 6 compatible currently takes an unacceptable length of  development time. Time that could be spent further improving a site for more mainstream browsers. As such I’ve taken the policy that I won’t be supporting the browser in future development work. I’d encourage other designers to discourage their clients from supporting the browser too. This means we can all look forwards to newer technologies like HTML5, CSS3 and Jquery 1.4 without the headaches of workarounds for Microsoft’s tired old browser.

In the meantime, it’s possible guide users to a different browser with a gentle warning. For example, my own site has only a handful of IE6 visitors (that’s quality readership for you) so with the imminent design refresh I’ll be implementing a Jquery based warning to IE6 users.

Use Jqquery to guide users to other browsers

Use Jquery to guide users to other browsers

Bookmark and Share

Adding Jquery and jquery lightbox to Cubecart 4

January 22nd, 2010

As you will note from my previous post I’ve been working on another Cubecart based site. Cubecart 4 uses the Prototye & Scriptaculous Javascript library, which I’m not a fan of and I wanted to add some Javascript functionality to the site I can only find in Jquery. The task was therefore to remove add Jquery and remove the other unneeded libraries (multiple Javascript frameworks rarely run happily together). The one additional task was to amend Cubecart to use a Jquery lightbox rather than the default.

So here is a step by step of how you can add Jquery to your Cubecart 4 based site (interestingly, Cubecart 5 is using Jquery rather than Protoype/Mootools) and amend the Cubecart templates to use a Jquery lightbox instead of the default:

1. Download jquery

2. Save jquery to the JS folder of your Cubecart site. I also renamed mine from ‘jquery-1.4.min.js’ to simply ‘jquery.js’.

3. Download Lightbox and extract the ‘jquery.lightbox.min.js’ from the JS folder of the archive into the JS folder of your Cubecart installation (it’s in the root). Rename the file to ‘jquery.lightbox.js’ for simplicity.

4. Now extract the jquery.lightbox.packed.css file from the CSS folder of the Jquery Lightbox archive to the CSS folder of your Cubecart skin which will be like so: ’skins/your skin/styleSheets’. For simplicity rename the file to simply jquery.lightbox.com

5. Within the ’skins’ folder of Cubecart, within your skin, browse to ’styleTemplates’ > ‘global’ and open index.tpl

By default (for example with the Carreta-Bright skin), line 17-19 are this:

1
2
3
<script type="text/javascript" src="js/jslibrary.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>

Replace those lines with the following:

1
2
3
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.lightbox.js"></script>
<script type="text/javascript" src="js/jslibrary.js"></script>

6. You will also need to change the style sheets so amend the following line:

1
<link href="skins/{VAL_SKIN}/styleSheets/lightbox.css" rel="stylesheet" type="text/css" media="all, screen"  />

To read:

1
<link href="skins/{VAL_SKIN}/styleSheets/jquery.lightbox.css" rel="stylesheet" type="text/css" media="all, screen"  />

So the other libraries won’t get loaded now and we have also added the stylesheet for the new Lightbox plugin.

7. By default the ‘next’ and ‘previous’ images of the Jquery lightbox effect live in an ‘images’ folder at the same level as the ‘JS’ folder. Therefore, extract all four images from the ‘images’ folder of the Jquery Lightbox archive into the ‘images’ folder in the root of your Cubecart installation.

8. Now open ‘viewProd.tpl from the skins/your skin/styleTemplates/content folder of your Cubecart installation.

9. Around line 21, change the following line of code:

1
rel="lightbox[imageset]"

To read:

1
rel="lightbox-myGroup"

This is the call for the new Jquery based Lightbox.

That’s it, Jquery is added and the default lightbox effect has been switched for a Jquery based one. Best of all you can now add new Jquery scripts to your site without any javascript conflicts.

Happy coding…

Bookmark and Share

How to setup MAMP and Coda for Cubecart development

January 22nd, 2010

I was looking for a simple tutorial that described how to use MAMP and Coda together for locally developing CMS (php based) systems before making them live, in this instance Cubecart. I searched high and low and couldn’t find anything on the net specific to Cubecart. The best documentation I found was this blog post by Jay Robinson that explained how to setup Coda to work with MAMP for developing Wordpress sites.

However, this tutorial describes how to set up MAMP to enable you to develop a Cubecart based site, locally, with Coda.

Credit where it is due: I had particular problems getting Ioncube for PHP working with MAMP. The following forum post was very helpful in setting that part up: http://forum.mamp.info/viewtopic.php?f=2&t=6875&start=0

Instructions:

1. Download and install MAMP

2. Download and extract Ioncube. (choose the relevant Ioncube download for your processor). You need to extract the file ‘ioncube_loader_dar_5.2.so’ into the ‘Applications/MAMP/bin/php5/zend/lib/’ folder

3. Browse to Applications/MAMP/conf/php5/ and open the file ‘php.ini’ in Coda

4. Add the following line at line 1085:

1
zend_extension=/Applications/MAMP/bin/php5/zend/lib/ioncube_loader_dar_5.2.so

Be sure to add it at the correct line. When in places you should see lines above and below like this:

1
2
3
4
5
6
7
; Local Variables:
; tab-width: 4
; End:
zend_extension=/Applications/MAMP/bin/php5/zend/lib/ioncube_loader_dar_5.2.so

;zend_extension="/Applications/MAMP/bin/php5/lib/php/extensions/no-debug-non-zts-20060613/eaccelerator.so"
eaccelerator.shm_size="16"

5. Download Cubecart. Extract the contents to the local folder you want to use. For example, I extracted it into a folder on my desktop e.g. ‘Desktop/benfrain.com/clients/clientname/’

6. Start MAMP (Applications > Mamp. Click ‘Stop Servers’.

7. In MAMP, click ‘Preferences…’, choose the ‘Apache’ tab and enter the local folder address you are keeping your files in (same as the ‘Local Root’ field in Coda - we’ll get this in Step 9). Click ‘OK’ and click ‘Start Servers’.

8. Still in MAMP, click the ‘Open Start Page’ button. The start page will open in your default web browser. Click the phpMyAdmin link (under the MySQL header).

9. We now need to create a database for use with Cubecart. Enter a name in the ‘Create new database’ field. E.g. ‘cubecart_test’, ensure ‘Collation’ is selected from the drop down and that ‘utf8_general_ci’ is selected in the drop-down below and click ‘Create’. Now click the ‘Privileges’ tab.Set up a SQL database for use with Cubecart

10. Either amend the user and password of ‘root’ (the default user for SQL databases in localhost) to your preference or create a new user by clicking the ‘Add a new User’ link. Either way, make a note of the username and password and ensure the user has ‘ALL PRIVILEGES’ set. You can now close this browser window.

11. Now open up Coda and select ‘Sites > Add site’

12. Name your site. Enter ‘http://localhost:8888/’ in the Root URL and Local URL boxes, leave ‘Remote Root’ blank and in the ‘Local Root’ box enter the location of the folder you are keeping your local copy of the site at. Click the ‘Set…’ button and browse to it. You don’t need to enter anything in the ‘Connecting’ section for local development. Here’s what it looked like on mine (click for full size version):

Settings in Coda for MAMP

Settings in Coda for MAMP

13. Now two options to set-up Cubecart. Either open the site in Coda, (open the index.php page in your local folder and click Preview in Coda) and it should kick the setup process off.

14. Everything should be straightforward now, when it gets to the database details, you will need to user the database details from step 10.

15. After setup completes it is possible that you will be unable to access the Admin panel. To rectify this you may have to email Cubecart support and ask them to add ‘localhost’ to your licence.

That’s it, Cubecart is setup locally and you can do all your development work locally before uploading your amendments to a live site.

Bookmark and Share

Review: Twelve South SurfacePad

December 21st, 2009
The SurfacePad for MacBook Pro 13 by Twelve South

The SurfacePad for MacBook Pro 13" by Twelve South

The Twelve South SurfacePad is one of those products that you don’t realise you want until you have it…

After reviewing the Twelve South BookArc for MacUser magazine, Twelve South asked if I’d also be interesting in taking a look at their ‘SurfacePad’ product: a cover for the palm-rest area 13 or 15″ MacBook Pro.

Having checked out the Twelve South website (by the way, I piggin’ love their logo - only just figured out the arrow is a ‘12′ on its side!) there didn’t seem like there was anything to get particularly excited about. It’s just a cover, right?

So it arrived and I installed it and… I wouldn’t be without it!

So what’s the big deal?
The SurfacePad is, on the surface (ahem - see what I did there?), merely a thin piece of custom-cut napa leather which covers the area around the keyboard and trackpad. It costs $39 (roughly £20) and if you don’t want to buy direct from Twelve South, the Apple store stocks it. But the comfort the product bestows belies its physical simplicity.

Installing it on the MacBook Pro is as simple as peeling off the back and sticking it to your MacBook Pro. However, here’s a little positive thing that is worth mentioning: the adhesive cover on the back of the SurfacePad is split into three sections and numbered 1-3. The benefit of this is that if you are a mole-handed clown like myself, it gives you chance to align the sticky stuff a section at a time which stops it looking like a dog’s dinner when installed.

Once applied the MacBook opens and shuts perfectly (it’s cut so it doesn’t intervene with the lid) and provides a nice soft surface to rest your hands on whilst typing. It’s also nice in colder locations too as even when the MacBook is cold, the surface doesn’t feel anywhere near as cold as the standard aluminium. There are some swirly patterns on the sample I received but they are fairly inoffensive. If you’d rather, Twelve South also make a smooth version without the pattern. Either way, patterned or not, the black actually looks great when on the MacBook Pro, complimenting the black bezel of the screen.

Should you need to remove the SurfacePad down the line, I’m reliably informed it will peel away without leaving any horrid residue. In the name of investigative journalism I should probably check that claim. But I won’t; because then I’d be without my trusty SurfacePad!

Bookmark and Share

HTML5 feature by Ben Frain in MacUser magazine

December 16th, 2009

I’ve been looking at the HTML5 specification a lot recently and intend to use parts of the specification in my upcoming website redesign. I’ve consolidated a lot of the research on the subject I’ve done into an HTML5 feature for MacUser magazine (it will be in issue 25/25). It’s kind of a primer on the subject so if you’re wondering just what is in HTML5 for you, or whether you should consider using portions of the specifications in your next website, it may be worth you taking a look. In the meantime, for more on HTML5, take a look at the HTML5 gallery and HTML5 Doctor - two sites that give you a good insight on the features of the new spec and how they can be applied today.

Bookmark and Share

21.5″ iMac screen bezel damage and misalignment

December 16th, 2009

I recently reviewed the all-new 27″ iMac for Computer Active Magazine and was pretty impressed. I certainly didn’t experience any of the screen issues that are getting all the headlines. On the back of that, I recommended my brother get the 21.5″ version of the new iMac. Which was a mistake…

The first one suffered a damaged bezel, around where the black of the screen meets the aluminium ‘chin’. A one off I thought. Not so. To cut another long (but dull) story short, he has now had FIVE models delivered and all of them either had bezel damage or the black surround wasn’t aligned properly against the silver ‘chin’. Not what you’d expect when you’re dropping the best part of a grand on a system.

Despite Apple support team acknowledging the issue, they have ultimately refused to go any further to resolve the issue and instead provided a full refund. So instead, he’s going to plump for one of the previous generation models on the Apple refurb store.

However, with everyone shipped suffering some obvious defect or another I am amazed I’m not hearing any grumbles about this on the net. No one else had a squiffy screen on their new 21.5″ iMac?

Bookmark and Share

Beginners guide to CSS: article in Computer Active

December 16th, 2009
Computer Buyer Isssue 308

Computer Buyer Isssue 308

I’ve recently contributed another article to Computer Active magazine. This one is a ‘Masterclass’ on CSS. In reality it’s very much a beginners guide to the subject, written in layman’s terms. If you’ve ever wondered just how on earth CSS works, head over and pick up issue 308 (10-23 December) now.

Bookmark and Share

New Cooper D engines in January 2010, Cooper S Diesel and Mini One Diesel coming in 2010

December 1st, 2009

If you’re about to order a new Mini you may want to hold off a little. I had a conversation with the ’shoe shine man’ yesterday which revealed the following…

The Cooper Diesel is (from January) to be fitted with a leaner Diesel engine which produces comparable emissions to the current model but WITHOUT the stop/start technology. The start/stop will be re-introduced later in the year (and provide further economy/emissions saving) but as a payable option (around April was the best guess).

The Cooper S Diesel is also due in 2010 but not until much later in the year (Q3/Q4). There are no part references on the BMW systems for this which means it isn’t in production yet. Unlike the Mini One Diesel…

The Mini One Diesel is due first half of 2010. There are part references to it on the BMW systems so it’s a definite. That’s all I now, afraid I wasn’t interested so didn’t ask further.

Bookmark and Share

Valid XHTML 1.0 Transitional © benfrain.com 2007-2008 | UK Based Freelance Writing and Web Design