The Tinstar Graphic Design and Studio Blog has moved – we’ve brought it back under the wing of our main website. Come by any time.
Archive for the ‘Websites with Magento’ Category
Long-standing client and friend of Tinstar Design is The Contract Chair Company, which (operating out of a custom-build Hammersmith showroom) has been supplying restaurant furniture as well as furnishings for hotels, cafés, conference centres, airports and healthcare institutions since 1998 – just one year less than Tinstar’s foundation. That almost makes us twins.
The time had come to expand their stylish outfit by offering contemporary furniture to interior designers and private individuals for home and home office use. Thus was born COCCO Home Furniture, a website developed primarily with usability in mind – we wanted to make it as easy and intuitive as possible for the visitor to find their way around – and hopefully buy. Sure enough, within the first few hours of launch, COCCO had sold some unique Turi Turi Coffee Tables.
I just threw an entire weekend away (and with the nicest weather we have had for sometime) sitting staring at my laptop trying to figure out why my functioning local version of Magento 220.127.116.11 refused to transfer to my remote host without breaking. It took long enough to transfer the files across (with the occasional one failing and needing to be re-submitted) – but then it took twice as long to find out why my picture zoom had broken (no matter what theme was active) and why the Add to Cart button led to a blank screen on Safari and a 500 error on most other browsers.
So another browse led me to assume that all the permissions had been messed up during the FTP transfer. Rather than attempt to change the permissions manually on thousands of files and folders, I was led to a very hand php script called magento_cleanup.php which, when run, will do exactly that – reset all the permissions to the correct format (755 for folders, 644 for files and 550 for pear scripts).
Copy the file to your main Magento directory and point your browser to it.
As satisfying as this was, it didn’t fix the problem. I resorted to Maglance, a place to post projects and recruit Magento freelancers. I thought I would put it in the hands of the experts. I got some helpful suggestions before anyone actually bid on the project, and one request was for me to:
- Turn on system and exception logging in admin: System/Advanced/Developer: Log Settings.
- Rename the file errors/local.xml.sample to local.xml
- Delete the contents of the var folder
I did this and the site completely broke. I could no longer access the front or back end, and a MYSQL 5000 error kept telling me that the site couldn’t connect to my database. This led to a flurry of comments from the freelancers suggesting (understandably) that I must had done something the database or app/etc/local.xml file – even though I had done nothing of the kind.
By this time I had spent Friday night, all of Saturday until 3am and half of Sunday (interspersed with episodes of Pride and Prejudice to calm me down) struggling with the beast. I hadn’t wanted to delete everything and start again, but actually, that’s exactly what saved me.
The following steps led me to 11.30pm on Sunday night, got the site working and gave me a peaceful night’s sleep:
- Make a backup of the (working) local site in System/Tools/Backups – and download the database backup
- Create a new MySQL database with a different name and user name than the one used before and import the backup data into it
- Edit the two fields in the core_config_data table for web/unsecure/base_url and web/secure/base_url replacing them with the new (remote) location of your new Magento directory
- Upload (!) the entire website again to a new (differently named) directory
- Once uploaded (a couple of hours later, hopefully without errors) edit the app/etc/local.xml file with the new database details
- Delete the contents of the var folder (if you uploaded it – the obvious answer here is not to upload your old local cache files)
- Gaze in wonder and relief at your working site! Zoom, Add to Cart and everything else worked again.
A really handy timesaver is the the ability to upload a single zip file, rather than hundreds of tiny files, and then unzipping it remotely. This saves time on uploading and minimises the possibility of corruption or failed uploads for the odd file buried deep in an obscure directory.
- To achieve this, create a blank html file and save it as something like unzipfiles.php
- Between the <body></body> tags, paste the following: <?php system(‘unzip zipFileName.zip’); ?>
- Replace the zipFileName.zip with the name of your zip file and upload the new page and your zip file to the same directory
- Access unzipfiles.php through your browser and the decompression should take place, expanding the contents of your zip file into your remote directory
I tested this with a small zip file which worked fine. With a larger file however (the js directory of Magento), I got a “The operation couldn’t be completed’ message in the Activity window of the browser. When I checked the remote directory, it seemed to have unpacked itself anyway – but this only presented the structure of the directories without actuall unpacking the contents – so this didn’t work.
I suppose it ultimate depends on what host you are using. Small files good, big files bad.
Another morning and much of the afternoon has been spent frustratingly trying to discover why, when the Popular Search Terms page (and some others) load with a left column, the column is visible – but completely empty. However, the Advanced Search page shows the left column content correctly. Irritating, no?
More by luck than judgement I have found a simple solution.
In the catalogsearch.xml file (found in app/design/frontend/default/yourtheme/layout) at the bottom of the page there is the following reference to the Search Term option:
<label>Popular Search Terms</label>
<block type="catalogsearch/term" name="seo.searchterm" template="catalogsearch/term.phtml"/>
All I did (more as a ‘hit-and-hope’ solution than anything) was comment out (or delete if you prefer) the following lines:
And what do you know? My left column content appeared on the Popular Terms page.
To activate and deactivate widgets in Magento like the Newsletter option, it’s pretty easy. You just go to System/Configuration/Advanced and select ‘disable’ next to the ‘Mage_Newsletter’ item.
But what if you want to disable something that has no apparent widget control? I couldn’t find a widget that controlled the ‘Shop By’ option in the left column. If there is a widget that controls this, please let me know!
The first way to remove an item – edit the code from the referenced PHTML file
What I did was to first identify the name of the DIV that contained it .To do this, visit a page containing the item on your testing or live server, select ‘view source’, copy the source code in its entirety and paste it into a new, blank HTML Dreamweaver file. Working in Split View, you can click on DIVs in the Design Pane and see what they are called in the Code Pane.
I established that the code in question was within the “block block-layered-nav” DIV. In Dreameaver Files, select the app/design/frontend/base directory and perform a search for “block block-layered-nav” in the source code of all selected files. Click ‘Find All’.
The search showed that two files contained this css string – the view.phtml and left.phtml files. Upon inspection, the view.phtml file contained the ‘Shop By’ title, so this was the one to edit. You could either comment out all the PHP and HTML, or (as I did) empty the file after making a copy of it for later reinstatement if required.
Upload the file to app/design/frontend/default/yourtheme/template/catalog/layer and the item should disappear from the left column.
If you are wondering why we retrieved the view.phtml from the Base theme rather than your theme, it’s because sometimes not all the phtml files exist in a theme, and when this happens Magento defaults to the Base theme to find one. By uploading it to the same location in your theme, it overrides the default Base version.
Of course, if you have a view.phtml already in your theme, edit that one.
The second way to remove an item – edit the code from the referencing XML file
Now you know where the code resides, you can perform a new search of the app/design’frontend/base directory for the filename, ‘view.phtml’. This showed quite a few files referencing view.phtml, but only two which were referenced view.phtml in the layer directory: catalog.xml and catalogsearch.xml.
Just focusing on the catalog.xml file (which affects more pages), locate the reference of layer/view.phtml in the code. It appeared just once on line 115. Comment out the code that references the file, replacing this:
<block type="catalog/layer_view" name="catalog.leftnav" after="currency" template="catalog/layer/view.phtml"/>
<!--COMMENTED OUT TO REMOVE *SHOP BY* START
<block type="catalog/layer_view" name="catalog.leftnav" after="currency" template="catalog/layer/view.phtml"/>
COMMENTED OUT TO REMOVE *SHOP BY* END-->
Save the catalog.xml file to the corresponding directory in your theme (if it doesn’t already exist): app/design/frontend/default/yourtheme/layout
Now the Shop By option should have left the site.
This bothered me for about 15 minutes until I found the solution online. Whilst building a site with Magento 1.4 (installed with no sample data), I added a product to test the system. However, when I tested the search feature, it returned no results whatsoever. I tried entering META keywords (which turned out to be on the wrong track entirely) and double-checked that the ‘Visibility’ option under Catalog/Manage Products was set to “Catalog, Search”.
The solution turned out to be this: Reindex Data
In the Admin Panel, go to System/Index Management. Select All items and then click ‘Submit’ next to ‘Actions: Reindex Data’. That should do the trick.
In Magento 1.4, it’s not immediately obvious (or, in fact, obvious after several hours of staring) how to add a customised static block of text, html or anything else into the website. Like all things, once you know how, it’s pretty straightforward.
This is how I added a static item (in my case, an HTML submenu in the header) into my Magento website using the admin panel and by editing the header.phtml file which can be found in:
If you find this page doesn’t exist in your theme, copy it (along with the relevant directories if necessary) from the frontend/base/default theme.
Creating a new Static Block in Magento using the Admin Panel:
Create a new block in the admin area – CMS/STATIC BLOCKS. Give the identifier a simple name with no spaces. We’ll call it NameOfStaticBlock.
Enter THIS IS WORKING in the text editing area. This will be replaced by the html or other code that you want to appear here.
Open header.phtml (or the page where you would like this to appear, such as footer.phtml or 3columns.phtml) and in the position that you want your block to appear, paste:
<?php echo $this->getLayout()->createBlock('cms/block')->setBlockId('NameOfStaticBlock')->toHtml() ?>
When you refresh your home page, THIS IS WORKING (or your html) should appear in the position specified.