December 14, 2018

cm-mini

Thinking Magento

Magento - Show Only Special Priced Products In A Category

THIS TECHNIQUE HAS BEEN UPDATED - CLICK HERE FOR A BETTER WAY OF MAKING A SALE CATEGORY

So your tired of always having to go through your catalog to add and remove products that have a special price to a certain category called On Sale or something similar. A solution is on hand now that will allow you to filter out those Special Priced products that have a special from and special to date.

First of all this is the code were that we're going to be using to do this.

<?php
Mage::getSingleton('core/session', array('name' => 'frontend'));
$_productCollection = Mage::getResourceModel('catalogsearch/advanced_collection')
->addAttributeToSelect(Mage::getSingleton('catalog/config')->getProductAttributes())
->addMinimalPrice()
->addStoreFilter();
Mage::getSingleton('catalog/product_status')->addVisibleFilterToCollection($_productCollection);
Mage::getSingleton('catalog/product_visibility')->addVisibleInSearchFilterToCollection($_productCollection); 
$todayDate = date('m/d/y');
$tomorrow = mktime(0, 0, 0, date('m'), date('d'), date('y'));
$tomorrowDate = date('m/d/y', $tomorrow); 
$_productCollection->addAttributeToFilter('special_from_date', array('date' => true, 'to' => $todayDate))
->addAttributeToFilter('special_to_date', array('or'=> array(
0 => array('date' => true, 'from' => $tomorrowDate),
1 => array('is' => new Zend_Db_Expr('null')))
), 'left'); 
echo '<div class="listing-type-grid catalog-listing">';
$_collectionSize = $_productCollection->count();
$i=0; foreach($_productCollection as $_product):
if($i++%3==0) 
echo '<ol class="grid-row">';
echo '<li class="item">';
echo '<p class="product-image">';
echo '<a href="'.$_product->getProductUrl().'" title="'.$this->htmlEscape($this->getImageLabel($_product, 'small_image')).'">';
echo '<img src="'.$this->helper('catalog/image')->init($_product, 'small_image')->resize(135, 135);.'" width="135" height="135" alt=".$this->htmlEscape($this->getImageLabel($_product, 'small_image')).'" title="'.$this->htmlEscape($this->getImageLabel($_product, 'small_image')).'" />
</a>
</p>';
echo '<h5><a href="'.$this->getProductUrl().'" title="'.$this->htmlEscape($_product->getName()).'">'.$this->htmlEscape($_product->getName()).'</h5>';
echo $this->getPriceHtml($_product, true) ?>
echo '</li>';
echo '</ol>';
echo '</div>';
You can then paste this into a file and name it specials.phtml and save it into your frontend template folder catalog/product.
Once you've done this you can then go into your admin and go to Manage Categories.
Create a category called On Sale Items or something else that you find fitting for your website. On the tabs click on Custom Design and in the Custom Layout box you can place the following.
 
<reference name="content">
<remove name="product_list"/>
<remove name="category.products"/>
<block before="-" type="catalog/product" name="home.new" alias="product" template="catalog/product/specials.phtml"> <action method="setProductsCount"><count>9</count></action>
</block>
</reference>
 
This will remove the current content block and replace it with your specials.phtml content. Press save category and thats it. You will now have a category that will only have your current special priced products.

Magento - Editing phtml Files in Dreamweaver

Its only recently that we came across a post which has now brought me a lot of joy to our lives and made it a lot easier on the eyes. Natively dreamweaver does not recognise phtml files and so you end up living in a black and white world, which is ok except you feel like you've been living in a 1950's sid com for the last few years. However help is finally at hand and now you can finally see phtml files for what they really are and we're going to show you how to achieve the same.

First of all since we're all on PC's, the fix described is only for windows based computers. But if you do need a fix for windows you can find the fix here.

  • Step One

Documents and Settings > [user] > Application Data > Adobe Dreamweaver > Configuration > extensions.txt

Change the top line and add the PHTML

HTM,HTML,SHTM,SHTML, ... ,TXT,PHP,PHP3,PHP4,PHP5,PHTML,JSP,WML,TPL, ... ,MASTER:All Documents

And then change the third line down to look like

PHP,PHP3,PHP4,PHP5,TPL,PHTML:PHP Files

  • Step Two

Program Files > Adobe > Dreamweaver [Your Version] > configuration > Extensions.txt

Change the top line and add the PHTML

HTM,HTML,SHTM,SHTML, ... ,TXT,PHP,PHP3,PHP4,PHP5,PHTML,JSP,WML,TPL, ... ,MASTER:All Documents

And then change the third line down to look like

PHP,PHP3,PHP4,PHP5,TPL,PHTML:PHP Files

  • Step Three

Program Files > Adobe > Dreamweaver [Your Version] > configuration > DocumentTypes > MMDocumentTypes.xml

Go to line 75 and change it so it looks like below

<documenttype id="PHP_MySQL" servermodel="PHP MySQL" internaltype="Dynamic" winfileextension="php,php3,php4,php5,<strong>phtml</strong>"<br />macfileextension="php,php3,php4,php5,<strong>phtml</strong>" file="Default.php" writebyteordermark="false">; </documenttype><br /><br />Fin.<br /><br />Now you can live in the real world and see all your code in colour.</pre>"
	

Magento - Using Conditional Attributes For Display

In Magento you have all these great features in terms of adding attributes to your products, but utilising them in a far more constructive way than just "display on product page" is a little bit harder, but worth the learning curve. With some basic php know how you can turn those static stuffy attributes into extremely useful events on the product page. Today we are going to demonstrate a simple, yet effective use of this by showing you how to change an "add to cart" button into a "Pre Order Item" button.

To start with create your attribute in the backend. An example setup would be;

  • Attribute Code: pre-order
  • Scope: Shop View
  • Type: Dropdown
  • Unique Value: No
  • Required: No
  • Validation:None
  • Apply To: All Products
  • Frontend Attributes: All set to no

For the dropdown options

  • Pre Order Available For This Item

Save

Go to Manage Attribute Sets and add pre-order to the various set names.

Now time for the code:


<?php if($_item->isSaleable()): ?>
<?php if ($_product->getData('pre-order')): ?>
getResource()->getAttribute('pre-order')->getFrontend()->getValue($_product); ?>
<?php if ($preorder=="Pre Order Available For This Item"): ?>
<button type="button" class="form-button" onclick="setLocation('getAddToCartUrl($_product) ?>')"><span>__('Pre Order Item') ?>

<button type="button" class="form-button" onclick="setLocation('getAddToCartUrl($_product) ?>')"><span>__('Add To Cart') ?>


<button type="button" class="form-button" onclick="setLocation('getAddToCartUrl($_product) ?>')"><span><?php echo $this->__('Add To Cart') ?></span></button>
<?php endif; ?>
<?php endif; ?>

This code can now be used to replace the current add to cart button, from the if saleable statement on both the list.phtml and the view.phtml files in the frontend catalog template folder.

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.