Writings, notes, and work of a Boston based designer

And another went live – PetFoodDirect.com Jan 27 + 2 comments

written by: ryan coughlin

Since I started working at Commerce Generation last fall, we have been working on a very large project for Pet Food Direct.pfdWe launched the site about a month ago and its looking pretty good so far. I was in charge of slicing a PSD and converting to XHTML. Another site that they own is NationalPetPharmacy.com which is similar to their other site, but sells pet medication.

Its great to see a project that you and many others put time in to and see actual customers utilizing the new site. It was probably the largest site I have completed before working with lots of Javascript and CSS files.

The sites backend that was built at Commerce Generation is running Commerce Server with ASP.NET. Some features include:

  • Warehouse integration
  • Auto-ship prorgrams
  • Account management and much more!

Lots and lots of hours, but worth it once you see your work up and running.

Lets get back at it! Jan 21 + 2 comments

written by: ryan coughlin

I have found some free time this weekend to sit down and clean up the blog as well as write up some new posts to keep it going! I have been slacking the past couple of months and have been really busy working at Commerce Generation in Burlington, VT. We recently finished up a large project with the websites going live. Along with that news, there are other coding tips and much more. Expect lots coming up.

Ryan

Internet Explorer 6 Still the Popular Browser? Nov 5 + 2 comments

written by: ryan coughlin

A friend who started Cat on The Couch Productions, tweeted me an article titled “Browser Version Market Share” and I found this extremely interesting, check out this clip that was taken from the website. Most of you are going to have the same feeling as me when you see what the first result is. This article was published along with the data presented in October, 2009. I am sure there might be other data that says otherwise, but I believe this is very creditable, this resource came originally from the CNET website.

Browser Version Market Share

Browser Version Market Share

Find Internet Explorer 6 at the top using 23% – was a huge shock to me. Waiting til it dies out and Firefox, Safari, Chrome and others start to take the market share for browsers. Slowly but surely, that number will dwindle as new computers are coming with Internet Explorer 8 preloaded. As for Web Developers, you all know this still means we will be using CSS fixes to fix double float margin and many other issues that we deal with when testing a website on IE6.

Google Insights – An Aid to a Successful Blog Post Nov 3 + 2 comments

written by: ryan coughlin

Google Insights Logo

Last spring I came across Google Insights while I was working at EpikOne as a Web/Graphic Designer for the Spring semester. I used this for one of their projects to research currents trends that were developing among coffee, this was what the company was based around. I was using Google Insights to then gather information on current trends that were developing during a certain period of time and a set geography base for the search. After analyzing the data presented by Google Insights I took notes on the data given then worked that in to a new newsletter that was going to be sent out to a list of subscribers.

Lets cut to the chase, Google Insights can help you create a successful blog post because if you have an idea for a post in mind, send some keywords/phrases to insight. The interface of Google Insights is very simple, the landing page looks as follows:

Google Insights - InterfaceHere are some basics steps that I take when I want to use Google Insights to writing a successful blog post:

  • Think of a new blog post idea/thought to work with
  • Write down some keywords/phrases, that visitors might search for
  • Enter them in to Google Insights – If you need to add any filters (Area, Timeline, Country, etc)
  • The results for your keywords/phrases will be graphed out for you and also a map overlay showing popularity, also showing a graph of Interest over Time
  • See which keywords/phrases are doing the best, then work those around your up and coming blog post.

The simple tips above can help your blog post become more successful by analyzing what the current trends are relating to that one topic. Lets say I wanted to write an article about jQuery and AJAX, lets plug these in to Google Insights and see what it returns, below is an image that shows us Top Searches and Rising Searches.

google-insights-searchesGive this method a try out for yourself. Ponder up a new post idea, think of some keywords, plug them in to Google Insights, blow away, bring on the followers. This has become a common tool in my arsenal for blogging and designing. Great way to check if your blog post is running in to any current trends, that will lead in readers to your blog. Give this a try and see how it goes.

Launched Cat On The Couch Productions Site Oct 21 + 2 comments

written by: ryan coughlin

Finally..after months and months and still work to do. I was able to launch the Cat on the Couch Productions website. Which has a much cleaner appearance with new branding, that was a must to have.

The old site was terrible and did nothing but turn potential clients away. I loaded up some jQuery on the new website but am removing alot of the components to increase performance.

If you are using qTip, don’t. It is 44KB packed, which is still incredibly large. They have a lighter weight SimpleTip, that I am switching too, that is less than 10KB.

You can check out the website, but there are still numerous changes to be done, but my thoughts were that it was acceptable and working to launch for now. Then go back and tweak performance, gzip, compress, and CSS sprites.

Work and school studies have been picking and I have been slacking on the blog posts and jquery goods, but there will be more.

Reload CSS without a page refresh Oct 7 + 2 comments

written by: ryan coughlin

As I was working this afternoon, Rogie King posted a tweet about a Bookmarklet that allows you to reload your CSS on your page without reloading the page.

So far I have been loving this, it is the perfect tool for your workspace. I highly recommend this to others. Thanks to the creator of this, can grab this bookmarklet and start using it.

  1. Drag it to your bookmark toolbar
  2. Open a site your are designing
  3. To view your new CSS changes, just click the bookmark in the toolbar, and wa la

Quick and really easy. Thought i’d share this tool with everyone. Give it a try.

Minor changes – Syntax Plugin Oct 7 + 2 comments

written by: ryan coughlin

I am switching my syntax highlighting from WP-Syntax to Google Syntax Highlighter. It is installed and working, but for some reason it is parsing my PHP, which is not allowing me to post the code for readers can try out the articles.

I have been doing some searching on Google with little results, but hopefully something will come up.

I recently started working at Commerce Generation in Burlington, VT so pardon for the delay in articles. I have several quick posts with some tips to publish in the next couple of days.

In the mean time sorry for the error in the syntax highlighting.

If you’re in the Northeast, try to stay dry!

NextGEN Gallery not loading CSS/Javascript Oct 1 + 2 comments

written by: ryan coughlin

Is your NextGEN Gallery showing images? But not loading the CSS and Javascript? Find the solution below.

I have been working on this project where the client wanted to be able to upload and install image galleries, so I have worked with this one and I love it: http://alexrabe.de/wordpress-plugins/nextgen-gallery/

All was smooth and working until, I removed this one line of code from my header.php in my WordPress theme directory.

<?php wp_head() ?>

Without this function in your header.php the gallery does not know where to insert the CSS/JavaScript files to create a fully functioned gallery. Be sure that it is placed before your closing tag.

To find out more information on the function check out this

All in all, be sure if you are running any type of plugin where they need to insert code upon plugin creation that you have that line within your head element of the page.

TIP: Use trackpad to control Expose in Mac OS X Sep 20 + 2 comments

written by: ryan coughlin

Another Sunday night is here, which means 8AM classes to start the week. After Football all day, I started working on some design projects, and I stumbled upon this small feature on my Mac. If you activate your desktop Expose and use two fingers you can use as you would use the arrow keys to navigate Expose on Mac OS X.

Not too crazy of a tip, but one I found out, that is pretty neat.

WordPress Login Page Blank Sep 16 + 2 comments

written by: ryan coughlin

Trying to login to your WordPress blog and after submit you get a blank login page? Also trying to access the wp-admin area with a blank screen and no errors?

This problem has happened to me many times with my personal site as well as client sites. After trying different things and looking at other articles what worked for me was to:

  • First log out using this url: http://www.yourdomain.com/wp-login.php?loggedout=true
  • Rename your plugins folder to “_plugins” to back them up and create a new folder called “plugins” – this insures that there is on conflict with any plugins that are being run
  • Replace your current wp-login.php file with a new one
  • NOTE: You might get a header php error, and if you do follow this article posted at WordPress

Hopefully those steps can fix this problem for you. If something else works for you, feel free to post the results.

Display wordpress posts on a page Sep 14 + 2 comments

written by: ryan coughlin

I have been searching for various articles and help to use WordPress to display a page full of your blog posts. I finally found out a source and it is going to be creating a custom page template in WordPress. If you want to read more on this visit: creating custom page templates.

The basic concept, will go as follows:

  • Create a new file and give it a name such as “allposts.php”
  • Paste the code below in the “allposts.php”
  • Upload the file to your theme directory
  • Create a new page in WordPress
  • To the right where you see Page Template, select the one you just created
  • Save and view the page. You should now be viewing your posts

The code that goes in to the “allposts.php” is below, this is an example from my site. The XHTML can be customized to the theme of your website.
The top section of code is where the name of the page template is defined. This will display on the page editor under the Page Template drop down.

<?php
/*
Template Name: Page of Posts
*/
?>

<?php get_header(); ?>

			<?php
				$wp_query = new WP_Query();
				$wp_query->query('showposts=4'.'&paged='.$paged);
			?>
<section>
	<article>
			<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
				<h1><?php the_title(); ?></h1>
				<h5>written by: ryan coughlin</h5>

				<?php the_content(); ?>

				<?php edit_post_link('Edit this entry','','.'); ?>

				<details>
					<ul class="tags">
						<?php the_category(', ') ?>
					</ul>
				</details>
			<?php endwhile; endif; ?>

			<div class="page_navigation">
				<div id="p_next"><?php next_posts_link('« Read Older') ?></div>
				<div id="p_previous"><?php previous_posts_link('Read Newer »') ?></div>
			</div>

	</article>
</section>
<?php get_footer(); ?>
<!--?php query_posts("showposts=10"); ?-->

Lastly, once this file is saved and uploaded, go to your page you created and on the right side under “Page Templates” select “Page of Posts”

To read more on the WordPress query_posts(), check out the reading.

Another jQuery UI Slider Example Sep 12 + 2 comments

written by: ryan coughlin

First post in a very long time. Finally the summer is over and I am back at school for my last year. Now finally I have a lot of free time to work on this new layout and getting it solid, and getting back to blog posts to catch up on what I missed.

The jQuery UI Slider is one part of the jQuery UI collection that is really neat and can have many uses. So last year I created this jQuery UI Slider never posted about it and I figured now would be the best time.

I wrote this tutorial on using the slider close to a year ago.

Now I created another version of it, with some different styles, with full code examples as well. This will display the current value of the slider as you move up and down bar.

Check out the jQuery UI Slider and start playing around with it.

Around in Europe May 30 + 2 comments

written by: ryan coughlin

Wanted to write a quick post while overseas. Just wanted to say that sorry for the delay in posts recently. I have been away in Europe the past couple of weeks. I started in England and then headed for the Greek islands. Its a blast here, a great way to end the year and start the summer. I have been taking a bunch of photos and will be sure to upload them to flickr and post up the link. Wish I brought my laptop with me to upload and see what I got for shots so far.

I will be back on the 4th and back to reality, catching up on the site work that I have in store for me, along with the many blog posts I have as drafts right now. I have been slacking on that. Also, working on finishing the new layout for my site. Giant to do list, but I hope I can get it all done and get caught up. Cheers

Installing Ruby on Rails Plugins via MediaTemple May 10 + 2 comments

written by: ryan coughlin

Good Morning and Happy Mothers Day!

I have been running Ruby on Rails on my Mac, playing around with applications, getting familiar with the framework. I recently started a Ruby on Rails project for a client and I told the client to switch over to MediaTemple, the best decision ever made. All of the controls and support are amazing. I was trying to run this command to install Restful Authentication:

./script/plugin install git://github.com/technoweenie/restful-authentication.git

The main issue to make sure to be aware of is to change to your containers directory using this via Terminal:

cd $HOME/../../containers

If you do run:

ls

You should now see a listing of any containers you have purchased in my case mine returns:

rails

Change directories for you are inside your rails application and now run:

./script/plugin install git://github.com/technoweenie/restful-authentication.git

You should be golden! Hope this helps out some people with any issues they may have. I should also add in that the command will generate your controllers/models, best of luck!

./script/generate authenticated user sessions

How to load data using JSON/PHP using jQuery May 6 + 2 comments

written by: ryan coughlin

I have seen a good amount of people wanting to see learn how to load data on their website using jQuery, JSON, and PHP. I thought I would show a simple example that should give you a jump start to your project.

We are going to use $.getJSON() function, you have something like:

$.getJSON("readJSON.php",function(data){
    $.each(data.posts, function(i,post){
          content = '\n';
          content += '' + post.author + '\n';
          content += '+ post.date_added + '\n';
          content += '' + post.post_content + ';
          content += ';
		$("#contents").append(content).fadeIn("slow");
	});
});

And example of JSON from the PHP page could look like this below:

{ posts: [{"id":"151","date_added":"2009-05-05 13:40:34","post_content":"This is a test post. jQuery!","author":"Ryan"},
{"id":"152","date_added":"2009-05-05 13:40:55","post_content":"Hey, you got to love Ajax","author":"John"}] }

That JSON above loads two records that will be displayed on to the page.

The results are being pulled from a MySQL database with tables: id, author, post_content, date_added, and author.

I am going to wrap up and article on the jQuery/PHP/JSON comment form with the results loaded on to the page after form submission, stay tuned for a much more in depth explanation of using JSON with PHP and jQuery.