Why my Products Won’t Show on my Magento Store??

So the first time that happened, after my initial panic, I ran to Google for help and was lucky enough to stumble upon this checklist.

Couple of tests had me find the leak (My product was not set as ‘in stock’), and I was good to breath and go on.

However today – it just happened again. This time I was dealing with a configurable product. I have created it, set it’s appropriate set of attributes, saved it, and came back in order to associate its simple products. Refreshing the front end – the product won’t show up.

I remained calm and went for this checklist again, but no jackpot for me there this time. I went again for help from Google, and came across this article, but still no solution in there either. I decided to keep it anyway, I know it may come in handy in the future.

It took me quite too long, but eventually I figured it out: moving to the associated products tab of my configurable product – I suddenly realized that it had none associated products. The products existed, I remembered having created them, and I could see them separately. So what happened? The answer is simple – after creating them at the configurable product’s window – I have forgotten to hit the save button once more – therefore – the simple products were created, but their association with my configurable product was not saved. They didn’t show on my front-end, being set as invisible for search and catalog, and my configurable product didn’t show – being associated-prodcuts-less!! As simple as that.

Important: If you don’t see any products in the list – hit ‘clear filter’ – and they will all show up again for you to choose from.

How to Create a Product With 3 Sizes in Magento

The Mission: Create a product that has 3 sizes. Each size has a different price. Each size comes also with a free (different) giveaway product

  1. Catalog => Attribute => Manage Attributes => Create a new attribute: Size. [Enter all required information]. Select ‘yes’ for Use To Create Configurable Product – note that this drop-down will only appear if the Scope is Global and the Input Type is Dropdown!
  2. If you haven’t already – now is the right time to create at least one attribute set for your store.
  3. Add the new attribute to your attribute-set.
  4. Create a new product – select the appropriate attribute set, and on product type select Configurable.
  5. You will next be taken to a list of all configurable attributes available for this product. There, you have at least one item for your size attribute. Check the checkbox for this attribute. Next you will be requested to fill in the product name and all relevant details. In the price field, enter the price for your smallest size. Click Save and continue editing
  6. Having saved your product for the first time, in the associated products tab, you now have the possiblity to create a simple product and associate it to your configurable product. Fill in all the details, enter the price difference from the main product, and select weather this difference is in percentage or fixed. For instance: your main product price is $10. Your medium size product costs $15. So you can either select ‘fix’ and enter $5, or select ‘percentage’ and enter 50%. Save your new product and repeat this for each size.
  7. Important! Remeber to hit save on your configurable product editing window to save the new modification for your configurable product – i.e. adding to it the associated products. Otherwise you will end up wondering, again why on earth my new product won’t show on my store. it might save you a lot of headaches.

Setting up a free givaway for each product.

Still trying to work this out – will let you know as soon as possible!

How to Change the Total Upsell Products in a Row in Magento

If you add additional up-sell products to your product, they are displayed in a table, at the bottom of your product’s view page. By Default they are set 4 in a row, but this can be changed.

Locate the file app/design/frontend/your_package_your_theme/layout/catalog.xml, or copy it from the tefault package if it doesn’t exist under your package layout folder yet.

In this file look for the block that starts with <block type="catalog/product_list_upsell"...

Change the line <action method="setColumnCount"><columns>3</columns></action> to read <action method="setColumnCount"><columns>4</columns></action> (when 4 is your desired total in a row), and you’re good to go!

If you want to make further changes to the block’s HTML – the template file is located here: app/design/frontend/your_package_your_theme/template/catalog/product/list/upsell.phtml.

How to use Media Queries in CSS for Building Fluid Layouts

Apparently, as discussed in Zoe Gillenwater’s blog, there’s a pretty neat way to address different clients’ layouts using different media queries.

For instance: if we want to move our navigation block to the side with windows wider than 1024ox. This is done like so:

@media screen and (min-width: 700px) {
#main-nav {
float: left;

Read all about this and more in Zoe Gillenwater’s blog

How to Change the Product Default Page Layout from 2 Columns to 3

The default layout for the product page is 2 columns: content and right. You may want to change it, so this is how it’s done:

Locate the catalog.xml file under your theme/layout folder. If you can’t find the file, copy it from the basic package.

Scroll down to the section named: <!--
Product view

There, on the first block that is nested within the <catalog_product_view> tag, locate the line: <action method="setTemplate"><template>page/2columns-right.phtml</template>

Change this line to: <action method="setTemplate"><template>page/3columns.phtml</template>

Refresh the page - you're done!

How to Disable Cache in Your Magento Store

Why would you like to disable cache?

Well probably you wouldn’t. Especially not when your store is already live an fully functional. But on developing stage, disabling the cache would make it possible for you to immediately test and control the fluent changes you are constantly applying to your theme, locale files or scripts. Not disabling cache in this case will cause a huuuge frustration. Not to mention an almost irrepressible desire to bang your head against the nearest break wall! Not at all recommended, and may be avoided quite easily like so:

In the back office, go to system => configuration => cache management.

Check marked the checkboxes near layouts, block HTML Output and Translations

From the top right hand side drop down menu, select ‘disable’

When the page refreshes, notice that for each of these lines, the status has changed to red, with the message ‘disabled/inactive’.

Now go ahead, refresh your frontend, your changes are there, see? Go grab a glass of water, sit down and relax for a while.

Translating In Magento

After creating your language website, you probably want to translate its content. There are several ways to do that. The most immediate is to work straight on your store’s interface. This method is basically good only for your store’s development stage.

First off – Remember to disable the cache. Then go to System => Configuration > Developer.

When you are on your desired store view – selected from the top-left hand side scope drop down menu, click on the Translate Inline tab and enable inline translation. Then, save the changes.

Back on the front end you will now see that some text blocks are in red boxes. Click on the little book icon near each box to get a display of a text field, where you can change the text for this label. If you want your changes to affect only the current view, click to check the ‘store view specific’ checkbox. Once done, click ‘submit’ and remember to refresh the page in order for your changes to show on the page.

Please consider that these changes do not affect the .csv files; they will be saved in your database.

The other way is to tackle the translate.csv file located within your template.

So let’s say you want to translate your site to French:

Locate or create a text file by the name of translate.csv under this path: app/design/frontend/your_template/your_theme/locale/fr_FR/. If you cannot find your language folder or even the locale folder under your theme, just go ahead and create those folders. Mind case sensitivity – to avoid frustration.

Having done all that, all that’s left for you to do, is add a line for each string you want to translate. The line would be twofold: first – a quoted string containing the original string to translate, and second – the translated string. Both are separated with a comma. For instance:

“My original string”,”A string in french”

Save the csv file and refresh your store page. Your changes should show immediately on the page. If they’re not – well, that’s probably because you haven’t disabled cache yet in the admin area.

Most important: remember to save your csv file in UTF-8 encoding, otherwise you may end up looking at some strange hieroglyphs instead of meaningful messages!

Adding a Style Sheet to only One Store View on Magento

Sometimes you may want to add a style sheet to only one of your store views, so it affects only this view, and not any other of your views. For instance: you have 2 languages in your site, and for each language you have its own view. One of the languages in your site requires special style rules, for instance – you want to change the directionality to rtl for this language (Hebrew or Arabic). For that you will want to add a special style sheet with some rtl rules.

Continue reading