Monthly Archives: January 2012

Page 1 of 212

Change Default “Add to Cart” Quantity from 0 to 1 in Magento

Posted on by
2

You may have noticed that the default “Quantity” or “Qty” to “Add to Cart” on product pages is 0 or zero. While the visitor can simply click “Add to Cart” to add 1 item of the product into the shopping cart, it would still create confusion. Some customers might think they had to manually update the quantity from 0 to 1 for the “Add to Cart” button to work (which is totally unnecessary) and be slightly annoyed because they *had to* do so. This is definitely not what we intended.

So how to change the default quantity on product pages to 1?

Many of the online answers involve editing one of the template files. It is not so any more with the newest versions of Magento. Tested on 1.6.1 and 1.6.2, you can simply change the default quantity by the following path in administrator panel:

System > Configuration > Inventory > Product Stock Options > Minimum Qty Allowed in Shopping Cart > Click “Add Minimum Qty” > Select “ALL GROUPS” and enter “1” in “Minimum Qty” > Click “Save Config“.

change magento default quantity

That’s it. You may probably need to refresh cache. And you would now see 1 as the default quantity on all your product pages. This is the update-proof solution.

Add External JavaScript / CSS to Header or Remove JavaScript / CSS from Header

Posted on by
Reply

In /app/design/frontend/base/default/layout/page.xml, Magento uses addJs and addCss action methods to add internally hosted JavaScript and CSS files. Your attempts to add external JS or CSS files with these methods would eventually fail because the generated URL will always start with your store’s absolute URL path such as http://www.yourstore.com/, making it impossible to include JavaScript or CSS hosted on another domain / sub-domain.

What if you want to add an externally hosted JavaScript such as one from a sub-domain CDN or one from Google’s hosted libraries? Such as prototype.js?

Add External JavaScript to Magento Header

Just edit the head.phtml located at here:

/app/design/frontend/default/your_theme/template/page/html/head.phtml

Open it and you should see the entire HTML header that Magento uses to render all pages of your store. Simply add a hard coded line of script tag anywhere appropriate:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/prototype/1.7.0.0/prototype.js"></script>

Refresh the cache and you would find the external javascript hosted at Google loaded in every page of your store in the HTML header section.

Remove Default JavaScript Files in page.xml

You may also want to get rid of the same version of JavaScript (prototype.js in this case) that’s hosted local on your main site. Duplicate ones would simply mean a waste of bandwidth and unnecessary download time. Because you should always try to serve static content from a separate domain / sub-domain as CDN rather than on the same domain as your site, or it’d be slower to download all the assets for the users.

To remove a local JavaScript from your Magento theme, simply create a new .xml layout file in /app/design/frontend/default/your_theme/layout and name it whatever you want, such as custom.xml or local.xml and put the following snippet in it to remove the prototype.js loaded in the base default theme of Magento:

<?xml version="1.0"?>
<layout version="1.1.1">
	<default>
		<reference name="head">
			<action method="removeItem"><type>js</type><name>prototype/prototype.js</name></action>
		</reference>
	</default>
</layout>

Refresh your store’s cache and you should see no local prototype/prototype.js being loaded in the HTMl header any more.

Differences between {{store direct_url=…}} and {{store url=…}}

Posted on by
Reply

When editing the CMS pages or static blocks, one should specify URLs with either {{store url=…}} or {{store direct_url=…}} directive in the HTML you create for them, so that the base URL is correctly and automatically outputted – http:// or https://, appending suffixes, etc.

{{store url=…}}

After some tests, I found that, basically, {{store url=…}} transforms the supplied parameter into a normalized URL. For example, it appends the suffix you specified in System -> Configuration -> Catalog -> Search Engine Optimizations to the end of the URL.

{{store url=’some//weird/page.php‘}} would output:

http://www.yourstore.com/some/weird/

Should you set ‘/’ as the category suffix.

{{store direct_url=…}}

This one simpler as it output whatever you put in the parameter and doesn’t do anything to them.

{{store url=’some//weird/page.php‘}} would output:

http://www.yourstore.com/some//weird/page.php

That’s it.

Custom Magento Theme for Error – “There has been an error processing your request”

Posted on by
1

If you ever run into the ”There has been an error processing your request” error of Magento, it’s just a plain default page of the very default theme of Magento when you first installed it.

default magento error exception theme

It simply sucks in user experience and page design. You want to:

  1. Use your own theme for this error page
  2. Use your own logo rather than Magento’s
  3. Add a back to the previous page sort of button / link
  4. Change Magento copyright notice to your own

How to do accomplish all these?

For 1, I thought it’s in the design.xml but turned out it’s not. And thus far I have no idea how to switch the error page to your own theme design once and for all.

For 2, just change /errors/default/images/logo.gif with your own.

For 3, just edit the /errors/default/report.html.

For 4, just edit the /errors/default/page.html.

 

Magento Error – “There has been an error processing your request”

Posted on by
1

By default Magento has disabled output of the exception / error details which makes it impossible to debug for developers.

There has been an error processing your request

Exception printing is disabled by default for security reasons.

And that’s it. Not nearly enough information to make it right. We need the error details.

To make it display error details and problem traces, FTP to your Magento installation and go to /errors/, and rename local.xml.sample to local.xml. (without the last dot, it’s the period punctuation)

Now the error should be much more useful by showing a lot more details: descriptive error message, traces, and line of code that is at fault.

magento error

"There has been an error processing your request"

Make sure you change local.xml back to local.xml.sample to disable detailed error output for production site for the sake of security.

List of Magento Go Reviews

Posted on by
3

Magento Go is a great product. It is not perfect but it’s thus far the biggest eCommerce platform with the largest community and probably the most developers working behind it, shaping it better and better every day. There are also many other great online store software that are equally powerful and friendly.

Here’s a list of real user reviews of Magento Go I found across the web. Read them before you make your decision to go with them or not. This IS kind of a big deal because it’s always a pain to switch from one technology to another. So choose wisely.

Independent Reviews

Scroll down for newest reviews added.

Review: http://www.boostingecommerce.com/magento-go-magento-for-the-masses
Date: Mar. 2nd, 2011
Brief: An early adopter reviews Magento Go in a rough manner.

Review: http://www.shoppingcartsforwebsites.com/general/magento-go-review/
Date: Jun. 24th, 2011
Brief: Detailed review of various pros and cons which concludes in a negative manner.

Review: http://www.simplerna.com/2011/07/to-setup-online-store-magento-go-or.html
Date: Jul. 18th, 2011
Brief: Magento Go, BigCommerce, Volusion and Shopify compared.

Review: http://www.kavoir.com/2011/09/magento-go-test-drive-review.html
Date: Sept. 27th, 2011
Brief: Incompetent and slow support. Adding an SSL is expensive.

Review: http://www.auctionbytes.com/R/R/chart.pl?SD&101536&Storefront_Solutions_and_Shopping_Carts&Magento Go
Date: Since Oct. 2011
Brief: Reviews and ratings aggregation for Magento Go. Ratings are categorized in 5 regards: performance, reliability, ease of use, customer service, and money value.

Review: http://enlightenedpixel.com/review-of-magento-go
Date: April 11, 2012
Good:

  • Support has been very good.
  • Product options are excellent.
  • Very flexible coupon / discount abilities.
  • Integration with MailChimp.
  • Active community.

Bad:

  • Limited design options and theming.
  • No responsive design.
  • No support to host .pdf files.
  • Email templates are hard to customize.
  • No featured products on homepage.
  • Lack of documentation on page layouts.
  • No attribute template.
  • No way to get rid of footer links.
  • No integration with QuickBooks payment gateway.

Review: http://www.merchantmaverick.com/shopping-cart-reviews/magento-go-review/
Date: October 25th, 2012
Brief: A comprehensive review surrounding as many aspects about Magento Go as possible. Also compiled quite some reviews by other parties – both negative and positive.

Magento Go has the potential to be a top (web-hosted) shopping cart, but they’re not there yet. They have a large number of built-in features, are well priced, and don’t charge any transactions fees. However, the lack of integrations & add-ons, the lack of themes, the complicated interface, the new ownership (eBay/X.commerce), and the fact that the co-founder and CTO recently left the company, has made me think twice about using Magento Go.

Forum Talks

  1. Magento Go vs Shopify vs BigCommerce - http://www.webhostingtalk.com/showthread.php?t=1043026
  2. A few web designers talk about Magento Go - http://www.webdesignerforum.co.uk/topic/48325-magentogo/
  3. Remove credit card from Magento Go - http://www.webhostingtalk.com/showthread.php?t=1088487
  4. Magento Go vs. Magento CE - http://www.webhostingtalk.com/showthread.php?t=1101370

More reviews of Magento Go will be ADDED here once they emerge themselves. So stay tuned by bookmarking this page!

Magento Go Promo Codes

If you are interested in Magento Go and feel like giving it a try, here are some very big promo codes you can use to get nice discounts.

Move Magento Sub-menu to Right

Posted on by
Reply

By default Magento displays the sub-menu in the middle of the parent item. What can be done to make it aligned to the right? At least move it 50px to the right?

The solution is real simple. While you may think it’s something to do with the JavaScript and even started looking for the line containing the class name, it is actually right in the CSS file.

Just search for “#nav li .shown-sub li div.shown-sub” in the primary CSS styles file and bingo! Simply change the default value of 100px which is the distance of the sub-menu’s left margin to that of the parent item, to something like 150px.

And the sub-menu will then always emerge itself 50px rightward.

Add “Register” Link to Top Navigation of Magento Store

Posted on by
Reply

The default Magento theme and many other themes miss the point by not giving the user a handy chance to directly register for a user account. “Register” or “Sign up” link has been way too common practice and instinctive to be missed out at the top links of your site.

We can’t afford that and we have to add it to our Magento stores.

Here’s how we do it.

Search through all your theme’s layout files for a section named <customer_logged_out> and add this snippet into it:

<reference name="top.links">
    <action method="addLink" translate="label title" module="customer"><label>Register</label><url helper="customer/getRegisterUrl"/><title>Register</title><prepare/><urlParams/><position>10</position></action>
</reference>

Refresh your store’s cache and you are fine to go with a shiny “Register” link on the top links section when the user isn’t logged in.

Add a Breadcrumb Link to the Breadcrumbs Path in Magento

Posted on by
2

It’s weird but some of pages of Magento don’t come with a full breadcrumbs path and all you have is just:

Home »

Which doesn’t look good in a professional online store.

So you may want to add a breadcrumb entry to the end of the breadcrumbs path, for example:

Home » Shopping Cart

How to add a breadcrumb link to the breadcrumbs?

Find the <checkout_cart_index></checkout_cart_index> section in your theme’s layout files and add in it:

<reference name="breadcrumbs">
	<action method="addCrumb">
		<crumbName>Home</crumbName>
		<crumbInfo><label>Home</label><title>Home</title><link>/</link></crumbInfo>
	</action>
	<action method="addCrumb">
		<crumbName>Shopping Cart</crumbName>
		<crumbInfo><label>Shopping Cart</label><title>Shopping Cart</title><link>/checkout/cart</link></crumbInfo>
	</action>
</reference>

Remove the <link></link> tag if you don’t want any links to be on the breadcrumb text.

Adapt Product Images to Keep Aspect Ratio without White Padding in Fixed Width

Posted on by
Reply

Some Magento themes adapt uploaded product images to identical width AND height so there would be white padding horizontally or vertically. It’s not pretty sometimes and you may want to resize the product images by a certain / fixed width and then have variable / adapted height to maintain the aspect ratio of width:height dimensions so as to get rid of the white area.

To achieve this, find any resize() method calls across the templates by searching ‘->resize(‘ and you would see they are probably like this:

Mage::helper('catalog/image')->init($product, 'image')->resize(250)

Which basically tells Magento to server a 250×250 version of the product image – aspect ratio kept but there would be white padding if the original image isn’t in square.

The following code resizes the image to specified dimensions: 400×250 -

Mage::helper('catalog/image')->init($product, 'image')->resize(400,250)

But that would only be good if you upload images with width:height=400:250. If not, you’d end up with distorted image or with white padding depending on the other options specified.

So what would be the real solution?

The real solution to adapt to changing product image dimensions (so you can freely upload images of any dimensions) WITHOUT white padding NOR distortion, would be this:

Mage::helper('catalog/image')->init($product, 'image')
->constrainOnly(TRUE)
->keepAspectRatio(TRUE)
->keepFrame(FALSE)
->resize(300,null)

And you will also get rid of any height=”" property on the <img> tag you find therein or the client browser will distort the image.

That’s it. Now all the images would be in fixed width and adapted height to respect the original aspect ratio without any white padding nor any distortion.

Make sure you call the 3 option methods before calling resize() and do keep the ‘null’ value for height in resize() parameters.

Page 1 of 212