loonyblurb

Current version : 1.4.2.0

While reworking a 1.3.2.3 magento template to work for magento 1.4, I had an issue on a product page where a tall thin image was not being resized correctly by the product zoom javascript. The script seemed to think that the image was small enough to fit inside the image container and so the image was not shrunk and the zoom in bar was disabled, despite the fact that around a third of the image was hidden behind the zoom bar itself.

Digging into it, it turns out that the width of an image is the main dimension used to calculate if the image is oversized or not. But as my image was tall and thin it was the hieght causing the problem and not the width.

I fixed this by simply amending the javascript in /js/varien/product.js.

In the scale function, which is around line 128, change the line that calculates the variable ‘oversize’ from this:

var overSize = (this.imageDim.width > this.containerDim.width && this.imageDim.height > this.containerDim.height);

to this:

var overSize = (this.imageDim.width > this.containerDim.width || this.imageDim.height > this.containerDim.height);

This makes sure that an image is marked as oversize if either the width or hieght exceed the container size, rather than both. Then in the if statement below, amend the first if from this:

if (this.imageDim.width > this.containerDim.width) {
     this.imageEl.style.width = (this.imageZoom*this.containerDim.width)+'px';
}

to this:

if (this.imageDim.width > this.containerDim.width) {
     this.imageEl.style.width = (this.imageZoom*this.containerDim.width)+'px';
} else if (this.imageDim.height > this.containerDim.height) {
     this.imageEl.style.height = (this.imageZoom*this.containerDim.height)+'px';
}

This then resizes the image based on the height of the image if the width is not the reason for the oversize.

Current magento version: 1.4.1.1

We recently upgraded a magento site to version 1.4.1.1 as part of moving the site to a new server. Everything seemed to run smoothly with no issues, job done.

However it didn’t take long for  the customer to ring up – ‘My site’s broken, no one can make payments anymore’. Once customer had entered their credit card details they found that the continue button did not work at all, they were stuck on the payment screen. Uh oh, time to dig around checking the server setups, looking for any reported issues with authorize.net (the payment engine being used) and checking into the changes made in the magento upgrade.

Amazingly the problem turned out to be that in latest version of magento, they had included a new javascript file for validating the payment variables input by the user and without this file the payment process would just stop at the card input screen and refuse to go any further.

The solution is simple. Just add the following line of code to your themes page.xml (in the layouts folder) and all should be fine:

<action method="addJs"><script>lib/ccard.js</script></action>

Everything would have been fine if we’d been using the default theme, or if we hadn’t had to override the default page.xml with our own version for our theme.

It just makes me wonder if there was some way that developers could be notified when key changes are made to files, especially to theme files that are overwritten in most installs to avoid such head scratching and long periods of debugging in the future. As far as I can tell this wasn’t even mentioned in the release notes. Do let me know if I’m wrong though and varien do actually release such useful information!

I’ve recently been working on quite a complex magento setup, that involves a number of different stores based in different countries.

A problem was reported where some stores appeared to be adding the tax twice in the shopping cart. The product prices had been setup including tax but the tax was then being added again in the cart, despite the tax settings in the admin clearly stating that the product prices already included tax and the cart subtotal should display excluding tax.

So for a moment I panicked thinking that this was going to be some overly complicated bug that I’d need to fix (not what I needed on a Friday).

So in a desperate effort to avoid that I looked around and fiddled with as many settings as I could think of, hoping that one of these would solve the problem, meaning that there was no horrible bug but just some obscure settings conflict. This was a good plan!

Although the tax calculation settings seemed to be correct, the ‘Default tax destination calculation’ was still set to the default country ‘USA’ so I changed this to the correct country for that particular store. I also changed the shipping origin under ‘Delivery settings’ to be the country rather than the default of ‘USA’ and this is what actually solved the problem.

I know this seems like a really simple thing, but hopefully it’ll save someone else a lot of searching around. I also thought I’d better post this incase I come across this problem again and can’t remember what I did to fix it last time! A blog can be a very useful memory tool!

Current magento version – 1.3.2.4

I’m guessing that quite a few people will have done what I did when I initially set up Magento, which was to just move the magento folder into my required document root and then go in and run the installer.
Logically all the files then got installed into that magento folder resulting in all my urls having “/magento/” in them which wasn’t exactly ideal. Of course this fact only registered with me once I’d done quite a bit of work, so the idea of doing a fresh install to sort this out was extremely unappealing to me.

Luckily for me it is possible to change the magento root from “/magento/” to “/”, but as you might imagine this sort of thing is fraught with danger (if that’s not too dramatic).

So I will stress here that it’s best to setup your root folders correctly on install, or run a fresh install if you can. But if you really need to change the root after the event then here’s what you have to do: (more…)

Current magento version – 1.3.2.4

jQuery is my favoured javascript library. It is the one I use most so it’s familiar and I can develop quickly with it. Magento however relies heavily on a mix of prototype, scriptalicious and their own varien scripts, none of which I’m familiar with or feel particularly confident about extending and adapting to my own needs.

So when I needed to add some custom javascript functionality to my magento site, I immediately thought “Wouldn’t it be great if I could use jQuery”. Now obviously this raises some issues. Firstly you’ll be adding in another javascript library to the mix, so the first thing to decide is “is this really necessary?”. You don’t want to add a whole load of extra code just for a really small bit of functionality as that doesn’t justify the performance hit or the extra bulk (if I can call it that). It is also well known that jQuery and prototype don’t really get on, so you’ll need to make sure that you can get them to play nicely together.

If you decide that it is worth it and you can justify adding the extra library, then here is what you need to do: (more…)

Current magento version – 1.3.2.4

This is what you need to do to add a new layout template, eg 4 column page layout.

1. Copy app/code/core/Mage/Page/etc/config.xml
   to app/code/local/Mage/Page/etc/config.xml.
   Creating this new file will allow magento core updates to occure without over-writing your changes (you’ll probably have to look out for changes to the core config.xml to megre them into your custom file).
2. Register your custom module by adding a new file to app/etc/modules, called something like Mage_Local.xml
3. In this file add the following code:

   <?xml version="1.0"?>
   <config>
   <modules>
   <Mage_Page> //relates to file structure
   <active>true</active> //set to active
   <codePool>local</codePool> //tell which folder to look in
   <depends> //requires the mage core
   <Mage_Core/>
   </depends>
   </Mage_Page>
   </modules>
   </config>

4. Now create your new template file, easy way is to copy an existing one such as 3columns.phtml (in app/design/frontend/your_package/your_theme/template/page), and give it a name, such as 4columns.phtml
5. Register this new template in the config.xml file your created in step 1 by adding your module to the layouts list. For my 4 column example I have added:

   <four_columns module="page" translate="label">
   <label>4 columns</label>
   <template>page/4columns.phtml</template>
   <layout_handle>page_four_columns</layout_handle>
   </four_columns>

You should now be able to access this new template in the cms->manage pages option in the magento admin backend.

Current magento version – 1.3.2.4

Magento had some very handy functions that easily allow you to find some fundamental urls of your site from your phtml files so you can avoid hardcoding them. These are:

• $this->getBaseUrl() – returns the base url of your store (funnily enough)
• $this->getSkinUrl() – returns the url of the folder containing your css, images and local js files (eg skin/frontend/default/your_theme, will vary depending on what package and theme the page is using).
  So to find the image logo.gif in the images folder you would call $this->getSkinUrl('images/logo.gif');. It should be noted that if getSkinUrl does not find the file that you have specified (like images/logo.gif) then it will default to looking in the default theme folders rather than your custom theme folders.
• $this->getJsUrl() – returns the url of the main js folder. So if you want to include a new js library from a template you can use this.

There are probably a few other functions like this, and some variations including some that use the Mage_Core_Model_Store, but there are the ones that I use most often.

Current magento version – 1.3.2.4

This is a very brief introduction to Magento, a powerful php based open-source e-commerce platform.

I am currently working on my first ever Magento project, and given the flexibilty and complexity of Magento and it’s code base, it seems a good idea to write a series of Magento hints and tips so that the next time that I come to use it I’ll be able to spend less time searching out the solutions to little niggly problems or requirements.

As an e-commerce solution, Magento is extremely powerful and flexible and may well be the answer for many peoples e-commerce needs. However because of this power and flexibility the code base is extremely large and the processing can be a little on the slow side, so if all your looking for is a really small and basic shop then this might prove to be overkill.

Overall though, now that I’ve almost got my head round the basics, I really like Magento as a tool and it can be fairly straightforward to work with if you know what you’re doing. If you’re not sure what you’re doing or you’re trying something a bit new then it can prove to be very frustrating and mentally draining, as the documentation isn’t always great and the forums can prove frustrating. But if you keep at it and in turn share what you’ve learned yourself then you’ll find yourself with a site that does exactly what you want, while at the same time improving the amount of information out there and possibly giving a lifeline to other magento users. If you learn something, share it! It might help someone who could provide you with invaluable help later on!
(more…)