Web Design

Dreamweaver CS3 won’t start in Windows 7

I’m still using Dreamweaver CS3 for some web stuff. It does all I need it to do, or at least it did until it suddenly just decided to not load anymore!

I tried rebooting, tried running as admin, tried running in compatibility mode etc.
Finally I found that there now appears to be a some kind of issue with Windows Aero, on my laptop at least.
So, after much frustration I finally got it to work.

If your Dreamweaver CS3 has stopped loading in Windows 7 you can get it to work by just changing these settings …

1. Right click the Dreamweaver shortcut and then click “Properties”.
2. Click the “Compatability” tab.
3. Under the “Settings” section:
Tick “Disable visual themes” and “Disable desktop composition”
(It does seem to work without ticking “Disable visual themes”, but a couple of times it didn’t start so I left mine ticked just in case.)

You’ll notice that you lose your nice aero transparency / colours etc but at least you can now use Dreamweaver CS3 on Windows 7 again!

You could disable Windows Aero completely, or just the Aero Peek feature, but seems overkill to change the entire OS appearance just for the sake of one misbehaving application.

If this helped you please tweet me (@alanhart) or comment below to let me know!

Compare CSS Stylesheet Tool – Update

In December 2010 i made my compare stylesheet tool available on my site for everyone.

It had a few shortcomings (pointed out to me by a few of you) so I’ve made some nice additions! Hurrah!

What does it do?
For those who don’t already know, CSS is a standard used to define Web site presentation styles.
When a Web designer creates a CSS stylesheet for a site, he will evolve it through multiple versions with incremental changes.

This tool allows a web designer to clearly see the differences between two css stylesheet files (classes only, not values)

Compare CSS Stylesheets

Description
A webpage that takes two CSS files and compares the classes contained in both. Resulting differences are highlighted in red.

Updates:

  • Optional flag “(!)” can be added next to every difference for quick & easy text search.
  • Text boxes at bottom of page for easy copy and paste of CSS code (also with optional “(!)” flag for easy text search)
  • Usage:
    Click the “Compare CSS Tool” link below and simply upload the css files you want to compare and click the compare button.

    Compare CSS Tool

[tweet][/tweet]

EKM Powershop – Adwords Conversion Value – Add Order Value to Your Adwords Code

When logged into your account on the successful checkout page (Settings > Checkout > Order Complete Page)
QuickLink if you’re already logged in is: http://youraccount.ekmpowershop2.com/ekmps/shops/settings_shop_checkoutfields_6.asp

Paste the google adwords javascript with the ekm tag [ekm:totalcost_number_only] where conversion value needs to go (in both the javascript and noscript bits of the code.)

Here’s  code example (with made up conversion id and label data):
this data goes at the bottom of the successful checkout page source

 <!– Google Code for Sale Conversion Page –>

<script type=”text/javascript”>

/* <![CDATA[ */

var google_conversion_id = 1234567890;

var google_conversion_language = “en”;

var google_conversion_format = “3”;

var google_conversion_color = “ffffff”;

var google_conversion_label = “ab-CDEfghIJKlMn1_AB”;

var google_conversion_value = [ekm:totalcost_number_only];

/* ]]> */

</script>

<script type=”text/javascript” src=”http://www.googleadservices.com/pagead/conversion.js”>

</script>

<noscript>

<div style=”display:inline;”>

<img height=”1″ width=”1″ style=”border-style:none;” alt=”” src=”http://www.googleadservices.com/pagead/conversion/1234567890/?value= [ekm:totalcost_number_only] &label= ab-CDEfghIJKlMn1_AB &guid=ON&script=0″/>

</div>

</noscript>

Important:

  1. If you have more than one payment method e.g. telephone, paypal etc you will need to add this code to the source of each payment method’s “checkout complete” page.
  2. The ekm powershop database/server code escapes any (“) with a slash e.g. (\”)
    it double escapes this if the user changes something then updates the page source again
    replacing every double quote (“) in the google code with single (‘) will prevent this happening.
  3. Make sure you do a dummy run throught the checkout process and view page source on the order complete page to verify the code looks as it should.

 

If you have more than one payment method e.g. telephone, paypal etc you will need to add this code to the source of each payment method’s “checkout complete” page.

XML Twitter Feed Not Working? The Twitter Feed XML has been removed/changed

Looks like twitter have turned off XML feeds…

Here’s where you can find XML feed for your tweets:

https://api.twitter.com/1/statuses/user_timeline.rss?screen_name=AlanHart

You can also use (Thanks to @steveclarkcouk for this one) …

https://api.twitter.com/1/statuses/user_timeline.xml?include_entities=true&include_rts=true&screen_name=alanhart&count=2

(This includes all the original xml fields. Change “count=2” to retrieve more than 2 tweets)

*Obviously replace “AlanHart” with your username ;)

Hope this helps someone!

There are a few changes:

As an example: I am loading the xml into a cache file and updating this every 5 minutes (keeps it up to date but stops each webpage request hammering twitter)

I then load the XML from the cache file into a VAR:

$xml = simplexml_load_file($cache_file);

var_dump($xml); // will show the array data for debugging

And output for each tweet:

foreach($xml->channel->item as $entry) {echo ($entry->title);}

Differences i have noticed:

1. The xml is nested differently:

Used to be: $xml -> status

Now: $xml ->channel->item

2. User Profile Picture

used to be: $entry->user->profile_image_url (This no longer exists)

3. Tweet text

used to be: $entry->text (this is now: $entry->title)

4. Tweet Date

used to be: $entry->created_at (this now: $entry->pubDate)

How to Disable Javascript in your Browser

You can easily disable javascript in any browser completely or you can disable javascript for a specific site/domain in the Chrome Browser.

Note: Make sure you remember to re-enable javascript when you’re done!

Internet Explorer:
1. Click the little gear (top right)
2. Click “Internet Options”
3. Choose the “Security” Tab
4. Click “Custome Level…” Button (near the bottom)
5. Scroll down to the “Scripting Section”
6. Locate the Active scripting subheading and select the “Disable” radio button.
If you would rather be prompted each time a website attempts to launch any javascript code, select the “Prompt” radio button instead.

Chrome:
1. Click the spanner icon (“Customise and Control Google Chrome”)
2. Click “Options”
3. Click “Under the Bonnet”
4. Click the “Content Settings…” button at the top (next to where it says “Privacy”)
5. In the “Javascript” section make sure that “Allow all sites to run JavaScript (recommended)” is selected
6. then click the “Manage Exceptions…” button
7. Select “Block” from the drop down box
8. Enter the hostname in the text box: http://en.wikipedia.org
9. Hit Enter

(to remove this javascript block for after the “blackout” just goto the same “Manage exceptions” page hover your mouse over the wikipedia entry you added and click “X”)

Firefox:
1. On your keyboard hold down “Alt+T” together then tap “O”
2. Click the “Content” icon
3. Untick “Enable Javascript”
This will disable javascript on ALL sites you visit until you tick “Enable Javascript” box again

Safari:
1. Open Safari
2. On your keyboard hold down the “Ctrl” key and tap the comma [,] key
3. Select the “Security” icon
4. untick “Enable JavaScript”

Single PHP error page to handle all response headers / errors

There might be an easier way of doing this but i’ve been working on a project which needed the following which i have done as a simple single php page and thought i’d share it in case anyone wants to do the same thing.

  1. Error page generated by dynamic pages
    (using any code; 403, 404 etc)
  2. Error page to handle genuine errors
    (404 ‘Not Found’, 403 ‘Forbidden’ etc)
  3. Forbid visitors from visiting sensitive areas/directories
    also returning 403 ‘forbidden’ header.
    (e.g. /images, /css /javascript, /ajax etc)

Download all these files: http-error-code.zip

instructions for use are commented within the error.php code but in summary:

You need to create a .htaccess entry for each error code:

Code for .htaccess:


ErrorDocument 403 /error/error.php
ErrorDocument 404 /error/error.php

For forbidden folders just add this code into a file called index.php then put this file into the folder that you want to forbid directory listing for:

Code for index.php:

<?php
// Set response code
$error = 403; //Forbidden
// include the error page (
include ($_SERVER['DOCUMENT_ROOT'].'/error/error.php'); // assuming "/error/error.php" is the location/name of this file
// stop processing the current page
exit();
?>

Save this code to a file called error.php and save to yourdomain.com/errors/error.php

Code for error.php:

<?php
/*
------------------------------------------
PHP Response Header / Error Page Generator
------------------------------------------
Created by Alan Hart (www.alanhart.co.uk)
19/09/2011
------------------------------------------

To generate response from another page, as a result of incorrect database query or invalid content etc just add this code:
(make sure no page output has been generated before this include)

<?php
// Set response code
$error = 403; //Forbidden
// include the error page (
include ($_SERVER['DOCUMENT_ROOT'].'/error/error.php'); // assuming "/error/error.php" is the location/name of this file
// stop processing the current page
exit();
?>

-------------------------------------------------------
TIP:
-------------------------------------------------------
Hide the default directory listing for a folder
e.g. /images, /css, /java etc.

1. create a blank file called index.php
2. paste the php code above into the file
3. place it inside the folder
-------------------------------------------------------
*/

// ------------------------------
// THE CODE...
// ------------------------------

// if the error code has been set by referring page:
if ($error <> ""){
// Use the error code from referring page
$code = $error;
} else {
// Use the error code from server
$code = $_SERVER['REDIRECT_STATUS'];
}

// set $path variable to the requested path/uri
$path = $_SERVER['REQUEST_URI'];

// Create array with error codes and messages
// You must add a line to .htaccess for each code used here.
// e.g.
// ErrorDocument 403 /error/error.php
// ErrorDocument 404 /error/error.php
// etc...
// (assuming /error/error.php is the location/name of this file)

// Common Error Codes / Responses:
$response['403'] = array('title' => '403 Forbidden', 'message' => 'The server has refused to fulfill your request.
You do not have permission to access '.$path.' on this server.');
$response['404'] = array('title' => '404 Not found', 'message' => 'The document/file requested was not found on this server.') ;
$response['405'] = array('title' => '405 Method Not Allowed', 'message' => 'The method specified in the Request-Line is not allowed for the specified resource.') ;
$response['408'] = array('title' => '408 Request Timeout', 'message' => 'Your browser failed to send a request in the time allowed by the server.') ;
$response['500'] = array('title' => '500 Internal Server Error', 'message' => 'The request was unsuccessful due to an unexpected condition encountered by the server.') ;
$response['502'] = array('title' => '502 Bad Gateway', 'message' => 'The server received an invalid response from the upstream server while trying to fulfill the request.') ;
$response['504'] = array('title' => '504 Gateway Timeout', 'message' => 'The upstream server failed to send a request in the time allowed by the server.') ;

// Other header response codes (not necessarily errors) that you may want to use:
// $response['100'] = array('title' => '100 Continue', 'message' => 'Continue')
// $response['101'] = array('title' => '101 Switching Protocols', 'message' => 'Switching Protocols')
// $response['200'] = array('title' => '200 OK', 'message' => 'OK') // *Not an error so should never be handled by this script*
// $response['201'] = array('title' => '201 Created', 'message' => 'Created')
// $response['202'] = array('title' => '202 Accepted', 'message' => 'Accepted')
// $response['203'] = array('title' => '203 Non-Authoritative Information', 'message' => 'Non-Authoritative Information')
// $response['204'] = array('title' => '204 No Content', 'message' => 'No Content')
// $response['205'] = array('title' => '205 Reset Content', 'message' => 'Reset Content')
// $response['206'] = array('title' => '206 Partial Content', 'message' => 'Partial Content')
// $response['300'] = array('title' => '300 Multiple Choices', 'message' => 'Multiple Choices')
// $response['301'] = array('title' => '301 Moved Permanently', 'message' => 'Moved Permanently') // *Not an error so should never be handled by this script*
// $response['302'] = array('title' => '302 Found', 'message' => 'Found')
// $response['303'] = array('title' => '303 See Other', 'message' => 'See Other')
// $response['304'] = array('title' => '304 Not Modified', 'message' => 'Not Modified')
// $response['305'] = array('title' => '305 Use Proxy', 'message' => 'Use Proxy')
// $response['307'] = array('title' => '307 Temporary Redirect', 'message' => 'Temporary Redirect') // *Not an error so should never be handled by this script*
// $response['400'] = array('title' => '400 Bad Request', 'message' => 'Bad Request')
// $response['401'] = array('title' => '401 Unauthorized', 'message' => 'Unauthorized')
// $response['402'] = array('title' => '402 Payment Required', 'message' => 'Payment Required')
// $response['406'] = array('title' => '406 Not Acceptable', 'message' => 'Not Acceptable')
// $response['407'] = array('title' => '407 Proxy Authentication Required', 'message' => 'Proxy Authentication Required')
// $response['409'] = array('title' => '409 Conflict', 'message' => 'Conflict')
// $response['410'] = array('title' => '410 Gone', 'message' => 'Gone')
// $response['411'] = array('title' => '411 Length Required', 'message' => 'Length Required')
// $response['412'] = array('title' => '412 Precondition Failed', 'message' => 'Precondition Failed')
// $response['413'] = array('title' => '413 Request Entity Too Large', 'message' => 'Request Entity Too Large')
// $response['414'] = array('title' => '414 Request-URI Too Large', 'message' => 'Request-URI Too Large')
// $response['415'] = array('title' => '415 Unsupported Media Type', 'message' => 'Unsupported Media Type')
// $response['416'] = array('title' => '416 Requested range not satisfiable', 'message' => 'Requested range not satisfiable')
// $response['417'] = array('title' => '417 Expectation Failed', 'message' => 'Expectation Failed')
// $response['418'] = array('title' => '418 I\'m a teapot', 'message' => '(RFC 2324) Hyper Text Coffee Pot Control Protocol')
// $response['501'] = array('title' => '501 Not Implemented', 'message' => 'Not Implemented')
// $response['503'] = array('title' => '503 Service Unavailable', 'message' => 'Service Unavailable')

// get the relevant title from array
$title = $response[$status]['title'];

// get the relevant message from array
$message = $response[$status]['message'];

// return message if error code provided isn't in the $codes array
if ($title == false || strlen($code) != 3) {
$message = 'Please supply a valid status code.';
}
// Return response header(s) with relevant code
header("HTTP/1.1 ".$title);

// Customise the page to be displayed below...

// -------------------------------------------------------
// You can use the variables $title and $message in the page
// -------------------------------------------------------
// e.g.
//        echo "<h2>".$title."</h2><p>".$message."</p>";
// -------------------------------------------------------

// -------------------------------------------------------
// !! IMPORTANT !!
// -------------------------------------------------------
// if you want to include a header / footer in the page displayed
// make sure you use $_SERVER['DOCUMENT_ROOT'] in your include code
// e.g.
//         include($_SERVER['DOCUMENT_ROOT']."/inc/header.php");
//
// this ensures the header/footer path is always correct
// e.g.
//        actual path of header.php = "http://www.domain.com/inc/header.php"
//         if path/uri is "domain.com/foo/" header path would incorrectly become "domain.com/foo/inc/header.php"
//        if path/uri is "domain.com/foo/bar/" header path would incorrectly become "domain.com/foo/bar/inc/header.php"
// -------------------------------------------------------

?>
<?php
// Include your own header here
//         include($_SERVER['DOCUMENT_ROOT']."/inc/header.php");
// or use HTML as below
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Error: <?php print $title;?></title>
</head>
<body>
<center>
<?php echo '<h2>'.$title.'</h2><p>'.$message.'</p>'; ?>
</center>
<?php
// Include your own footer here
//         include($_SERVER['DOCUMENT_ROOT']."/inc/footer.php");
// or use HTML as below
?>
</body>
</html>

 

Compare CSS Stylesheet Tool

CSS is a standard used to define Web site presentation styles.
When a Web designer creates a CSS stylesheet for a site, he will evolve it through multiple versions with incremental changes.

This tool provides a solution that allows a web designer to clearly see the differences between two different css stylesheet files (classes only, not values)

Compare CSS Stylesheets

Description
A webpage that takes two CSS files and compares the classes contained in both. Resulting differences are highlighted in red.

Usage:
Click the “Compare CSS Tool” link below and simply upload the css files you want to compare and click the compare button.

Compare CSS Tool

Change Juitter Time and Date Format

As you can see in the sidebar on the left i am using Juitter to retrieve my twitter feed, I didn’t like the default juitter date format because it’s rather long (“ddd,dd mm yyyy hh:mm:ss +0000”)

Here’s how you can reformat the default juitter time and date format…

Just insert the code below into the “jquery.juitter.js” file, underneath the line “var tweet = $.Juitter.filter(item.text);”

// Re-format Date/Time
//get Tweet date
var d=new Date(item.created_at); //Default date/time is when the tweet was published
var tweetdate=d.toLocaleDateString(); //rewrite date in a nicer way
//get Tweet time
var t=new Date(item.created_at);
var tweettime=t.toLocaleTimeString().substr(0,5); //rewrite and remove seconds
//pull it together
var timestamp=""+tweetdate+" at "+tweettime+"";
// Reformat Date/Time

Then in the few lines below this newly inserted code (the code that generates the HTML) replace “item.created_at” with “timestamp”

Simple!

main date conversion taken from: http://www.ibrii.com/n/f317z

Some useful web design links

Here are some geeky/webdesign thinga-ma-bobs i’ve stumbled across/used recently:

Regular Expressions Cheat Sheet

a very handy quick reference guide for regular expressions, including symbols, ranges, grouping, assertions and some sample patterns for beginners.
http://www.addedbytes.com/cheat-sheets/regular-expressions-cheat-sheet/


CSS Transparency

used on this site so you can see the background image behind content on smaller screen resoltions
Transparency is one of those weird things that is treated completely differently in all browsers.
don’t forget to read the comments at the bottom of this article too:
http://css-tricks.com/css-transparency-settings-for-all-broswers/


Twitter “Retweet” Button

The Retweet button is for website and blog publishers that want to encourage their audience to retweet their content on twitter.
Here’s a really smart bit of code using one simple piece of JavaScript to give up to date tweet counts and shorten your title and link for the retweets. Best of all it will work on any web page, anywhere!
http://help.tweetmeme.com/2009/04/06/tweetmeme-button/


Dezignus.com

Vector art, icons, brushes, textures, wallpapers, anime, girls, tutorials… nuff said!
http://dezignus.com/

if you found any of these useful, please tweet/share.