October 25, 2020

cm-mini

Thinking Magento

Magento - Remove the ugly radio buttons from checkout

The onepage checkout in Magento is already quite slow in lots of respects and the last thing you want to do is over complicate it further. What we've done here is replaced the ugly and irritating radio buttons that require you to make a selection and then press continue, with nice instant action buttons. In order to do this, you'll need to do the following;
In template\checkout\onepagelogin.phtml remove the radio buttons and replace with the following.
 
<ul class="form-list">
getQuote()->isAllowedGuestCheckout() ): ?>
<li>
<button type="radio" class="button" onclick="checkout.setMethod('guest');");"><span><span>__('Continue') ?></span></span></button>
</li><li>
<label for="login:guest">__('Checkout as Guest') ?>

<button type="radio" class="button" onclick="checkout.setMethod('register');"><span><span>Register</span></span></button>
<label for="login:register"><?php echo $this->__('Register') ?></label>
</li>
</ul>
In the opcheckout.js file in the skins folder, replace the setmthod function with this one.
 
setMethod: function(methodtype){
if (methodtype=='guest') {
this.method = 'guest';
var request = new Ajax.Request(
this.saveMethodUrl,
{method: 'post', onFailure: this.ajaxFailure.bind(this), parameters: {method:'guest'}}
);
Element.hide('register-customer-password');
this.gotoSection('billing');
}
else if(methodtype=='register') {
this.method = 'register';
var request = new Ajax.Request(
this.saveMethodUrl,
{method: 'post', onFailure: this.ajaxFailure.bind(this), parameters: {method:'register'}}
);
Element.show('register-customer-password');
this.gotoSection('billing');
}
else{
alert(Translator.translate('Please choose to register or to checkout as a guest'));
return false;
}
},
 
Now, once that's all in place you should be able to hit the continue button for each selection and it will bring up the related section. You may not think that it makes much of a difference, but what we've seen over time is that removing the number of clicks in the checkout process is always beneficial.

Magento - New/Special Price Stickers on Images

In the extension world of Magento there are plenty of little addons out there that will do this job for you, but at a cost. Whilst trauling through the Magento German forums last year, we came across an exceptional post that still merits mentioning today and its complete FREE!

So here is our adaptation of how this could be implemented.

In your frontend template, if you open up your list.phtml file located in the catalog/product folder locate in grid view <div class="product-image"> and add the following.</p> <div class="codeblock"> <?php 
$_now
= time();
$specialToDate = strtotime($_product->getspecial_to_date())+(60*60*24);
$specialFromDate = strtotime($_product->getspecial_from_date());
$newsToDate = strtotime($_product->getnews_to_date())+(60*60*24);
$newsFromDate = strtotime($_product->getnews_from_date());

if (((
$newsFromDate <= $_now) && ($newsToDate > $_now)) || (($_product->getSpecialPrice()) && ($specialFromDate <= $_now) && ($specialToDate > $_now))): ?>
<div class="teaser">
<?php if (($_product->getSpecialPrice()) && ($specialFromDate <= $_now) && ($specialToDate > $_now)): ?>
<div class="new-sign"</span><span style="color: #007700;">></div>
<?php endif; ?>
<?php
if (($newsFromDate <= $_now) && ($newsToDate > $_now)): ?>
<
div class="onsale"></span><span style="color: #007700;"></div>
<?php endif; ?>
</div>
<?php endif; ?>

and add the following to your CSS *Adjust as needed*
.new-sign {padding:10px 0; width:127px; height:67px;color:#ffffff; text-align:center; background:url(../images/new.png) no-repeat; font-family:Impact; font-size:1.5em; letter-spacing:0.05em; }
.onsale {padding:10px 0; width:113px; height:40px; background: url('/../images/reduced.png') no-repeat;  }
You can now create your own reduced.png and new.png image and place them into your skin images directory.

Magento - Special Prices Date (More Control)

So this next blog is going to be about what is featured in the Enterprise edition of Magento and how you can attain this in your current version of Magento. One big flaw in the special prices is that they are controlled by the day, so you can't really do very exciting promotional sales on your website in the CE version of Magento, however in the Enterprise edition you can implement a special price countdown til sale ends, as well as control product special prices by the hour and minute. Today you'll be briefly guided through how you can achieve this in your CE version of Magento.

Magento - UK Postcode Validation

We came across a problem recently, which was related to exporting orders to parcel force and how the UK postcode format is required to have a space between that seperates the district code and the inward code.

Many people these days assume that there is little or no reason to have a space in their postcode and seem to take a more continental approach towards this. However, this creates problems when transporting your orders to distribution firms such as ParcelForce and they WILL NOT recognise the postcode without a space. To prevent this from happening you can add the following into your name.phtml file in the customer folder of your frontend templates.

<script type="text/javascript">
var shippingForm = new VarienForm('co-shipping-form');
Validation.addAllThese(
[
['validate-zip-international', 'Please enter a valid uk zip code.E.G. GB1 6LY', function(v) {
var country_id = 'GB'
var country = $('billing:country_id');
var element = $('billing:postcode');
if (element && ('' != element.value) && (country_id == country.value)) {
if (!element.value.match(/(^[A-Za-z]{1,2}[0-9]{1,2}[A-Z]?[\s][0-9][A-Za-z]{2}$)/ )) {
return false;
}
}
return true;
}]
]
);
</script>z
Once you'ved added this to name.phtml you can now locate the postcode inputs in billing.phtml and shipping.phtml and replace the input with the following
<input type="text" title="" name="billing[postcode]" id="billing:postcode" value="" class="validate-postcode required-entry input-text" />
This will now give you nice clean postcodes for all of your UK postcodes only and mean that there will be less complications for users checking out when it comes to payment processing and order exporting to distributors.

Magento - Low Stock Notifications

Stock notifications in Magento are always confusing and it seems to me like the issue needs to be cleared up for some. Stock notification on the frontend of the store is for the customer to know when a product is back in stock. They will be alerted by an email that is sent when triggered by the cronjob in the early hours. The other is the RSS feed that can be found on the Catalog > Manage Products grid. This particular RSS feed however is admin protected, which in theory would be great, but in reality can be a real pain. I'll explain in this blog how to utilise the RSS feed, as well as the Low Stock Grid and a few other tips on how to manage your stock levels.

First of all you are going to require making some core hacks, you could modulise this, however for all intensive purposes the following will be surfice.

Open up /app/code/core/Mage/Rss/controllers/CatalogController.php

and remove  Mage::helper('rss')->authAdmin('catalog/products'); from public function notifystockAction().

This will remove the login authentication from the Low Product Stock RSS feed.

You can then use website like Feed My Inbox to check the RSS feed daily and to email your account once stock has reached 0. This then removes any need for tedious RSS viewers or readers to be running in your browser or desktop and that each morning the is the possibility of a stock notifcation.

On top of this method, the Low Stock Grid in the Reports section of Magento is extremely valuable.

Again though some alterations are required in order to fix the problems.

First of all if your on a version of Magento that is lower than 1.4.0.1 and you do not want to upgrade, however you are unable to filter by Qty on your Low Stock Grid, then all you need to do is download a copy of Magento 1.4 and find file app/code/core/Mage/Reports/Model/Mysql4/Product/Lowstock/Collection.php. You can use this file to replace the one you are currently using on your installation. We've posted in the Magento forums exactly what the problem is for this fix.

Next up is to give your Low Stock Grid more functionality and you can do this by adding in another column called Low Stock Date. This will allow you to filter when products went out of stock, depending on what number your low stock notification is set to.

For this we need make a copy of 

app/code/core/Mage/Adminhtml/Block/Report/Product/Lowstock/Grid.php

and place it in the same set for directories within /code/local 

->joinInventoryItem('qty')
with
->joinInventoryItem('qty')
->joinInventoryItem('low_stock_date')
and then further down add to the columns
 
$this->addColumn('low_stock_date', array(
'header' =>Mage::helper('reports')->__('Low Stock Date'),
'sortable' =>false,
'index' =>'low_stock_date',
'type' =>'date'
 ));
This will now give you a new column of when Low Stock was reported in the Magento system.

IF selling products via the admin and going into minus levels of stock, the Low Stock Date will update to the day of the most recent order with the associated product.
 
* Make backups of all core files before making changes.