Posting in the Magento forums has been disabled pending the implementation of a new and improved forum solution which should better serve the community.

For new questions please post at magento.stackexchange.com, the community-run support site for the Magento community. We will be providing updates on the new forum solution soon. For questions or concerns please email community@magento.com.

Magento Forum

SOLVED: Almost there - categories on homepage working but images aren’t showing up
 
furqan
Jr. Member
 
Total Posts:  12
Joined:  2008-05-27
 

Thanks “spib” it works for me… smile

 
Magento Community Magento Community
Magento Community
Magento Community
 
Aiden1
Jr. Member
 
Total Posts:  1
Joined:  2009-11-03
 

I only use the latest version..Now it working..Thanks for the updates..

Regards

Aiden

_____
dossier surendettement

 
Magento Community Magento Community
Magento Community
Magento Community
 
allianceetrading
Jr. Member
 
Total Posts:  13
Joined:  2009-09-27
 

Worked like a charm.  Thank you & thanks to the OP. smile

Twan - 06 August 2009 10:47 AM

Hi all,

I have just been working on this, and while I still want to work on the style sheet a bit and amend the layout a bit more too, it does show the images, etc. correctly in 1.3.x.  I save this as a CMS block (subcategory_listing) as described in earlier posts, and then in the category whose sub categories I want to show I choose the CMS block (subcategory_listing)

I have only amended my own design, no need to change core code, or override any part of the core code.  Here are the full instructions based on post #28 from Brendan

1. In cms select Static Blocks
a. Set the Block Identifyer to for example “Sub Category Listing”
b. Set the Identifyer to “subcategory_listing”
c. In the content section write

{{block type="catalog/navigation" template="catalog/navigation/subcategory_listing.phtml"}}

2. Now take the code below and paste it into a new file called “subcategory_listing.phtml” this file needs to live in the “catalog/navigation” directory

<?php 

$_categories
=$this->getCurrentChildCategories();

foreach (
$_categories as $_category): 
    
$cur_category=Mage::getModel('catalog/category')->load($_category->getId());

?>

  
<div class="categorylisting">
  
<?php if($cur_category->getIsActive()): ?>
    
<div class="product-image">
       <
a href="<?php echo $cur_category->getURL() ?>" title="<?php echo $this->htmlEscape($cur_category->getName()) ?>">
         <
img src="<?php echo $cur_category->getImageUrl() ?>" width="140" alt="<?php echo $this->htmlEscape($cur_category->getName()) ?>" />
       </
a>
    </
div>
    <
h4>
      <
a href="<?php echo $cur_category->getURL() ?>" title="<?php echo $this->htmlEscape($cur_category->getName()) ?>">
        
<?php echo $this->htmlEscape($cur_category->getName()) ?>
      
</a>
    </
h4>
                        
    
<?php echo $cur_category->getDescription() ?>
              
  <?php 
endif; ?>
  
</div>
<?php endforeach; ?>

3. Now Goto Manage Categories.
a. Pick a Category whose subcategories you’d like displayed
b. Set the display mode to “Static Block Only” or “Static Block and Products”
c. From the CMS Block dropdown select the Static Page “Sub Category Listing”


Cheers
Twan

http://www.heydayonline.co.uk
http://www.deadmensspex.co.uk
 
Magento Community Magento Community
Magento Community
Magento Community
 
Adam Moss
Sr. Member
 
Avatar
Total Posts:  248
Joined:  2009-02-11
Birmingham, UK
 

So Just to confirm:

1. Create a file called subcategory_listing.phtml in app/design/frontend/default/modern/template/catalog/navigation/
And paste in:

<?php $_categories=$this->getCurrentChildCategories(); ?>

    <?php 
foreach ($_categories as $_category): ?>
   
<div class="categorylisting">
            
<?php if($_category->getIsActive()): ?>
                
<div class="catimg">
                            <
a href="<?php echo $_category->getURL() ?>" title="<?php echo $this->htmlEscape($_category->getName()) ?>">
                                <
img src="<?php echo $_category->getImageUrl() ?>" width="90" height="90" alt="<?php echo $this->htmlEscape($_category->getName()) ?>" />
                            </
a>
                                
<?php /* echo "Find this item->" */ ?>
                        
</div>
                        
                       <
div class="button"><a href="<?php echo $_category->getURL() ?>" title="<?php echo $this->htmlEscape($_category->getName()) ?>"><?php echo $this->htmlEscape($_category->getName()) ?></a></div>
                        
<?php echo $_category->getDescription() ?>
              
            <?php 
endif; ?>
        
</div>
    
<?php endforeach; ?>

2. Open app\code\core\Mage\Catalog\Block\Navigation.php

Find:

public function getCurrentChildCategories()
    
{
        $layer 
Mage::getSingleton('catalog/layer');
        
$category   $layer->getCurrentCategory();
        
/* @var $category Mage_Catalog_Model_Category */
        
$categories $category->getChildrenCategories();
        
$productCollection Mage::getResourceModel('catalog/product_collection');
        
$layer->prepareProductCollection($productCollection);
        
$productCollection->addCountToCategories($categories);
        return 
$categories;
    
}

And replace with:

public function getCurrentChildCategories()
   
{
        $layer 
Mage::getSingleton('catalog/layer');
        
$category   $layer->getCurrentCategory();
        
/* @var $category Mage_Catalog_Model_Category */
        
$collection Mage::getModel('catalog/category')->getCollection();
        
/* @var $collection Mage_Catalog_Model_Resource_Eav_Mysql4_Category_Collection */
        
$collection->addAttributeToSelect('url_key')
            ->
addAttributeToSelect('name')
            ->
addAttributeToSelect('is_anchor')
            ->
addAttributeToSelect('image'
            ->
addAttributeToFilter('is_active'1)
            ->
addIdFilter($category->getChildren())
            ->
setOrder('position''ASC')
            ->
joinUrlRewrite()
            ->
load();

        
$productCollection Mage::getResourceModel('catalog/product_collection');
        
$layer->prepareProductCollection($productCollection);
        
$productCollection->addCountToCategories($collection);
        return 
$collection;
    
}

3. Create a static block called subcategory_listing and name it Subcategory Listing. Then enter:

{{block type="catalog/navigation" template="catalog/navigation/subcategory_listing.phtml"}}

4. Create a category, go to Display Settings >

Display Mode: Static Block Only
CMS Block: Subcategory Listing

5. Now if you want to style it in the same way I have, you need the following CSS (edit as appropriate):

.categorylisting {float:left;width:140px;height:170px;padding:10px;border:1px solid #ccc;margin:10px;text-align:center;}    
.textcat {width:129px;padding:3px;padding-top:5px;height:30px;border:1px solid #ccc;text-align:center;margin-top:10px;background-color:#eeeeee;background-image:url(images/headcat.gif);background-repeat:repeat-x;}    
.button { margin10px autofont-size:1.2emfont-weight:boldtext-align:center}
.catimg { margin:0 auto}
 
Magento Community Magento Community
Magento Community
Magento Community
 
johnson m
Jr. Member
 
Total Posts:  13
Joined:  2009-06-17
 

Hi all,

Have spent the last 4 hours trying to get this to work and am 90% of the way there I’m sure.

The URL for the category in question is: http://www.frameme.co.uk/frames/wooden-frames/bespoke-wooden-frames.html

I used the CSS code from above and it seems to be working because the images are in boxes now - the problem is the CSS source code is visible on the front end as well!

I’m really struggling to work out why this is - it looks like it’s part of the description or something - but there’s nothing in the description field other than what should be there. Have tried deleting cache and even deleted and recreated the category itself.

I know it’s probably something really stupid but I’m struggling big time

Thanks in advance

 
Magento Community Magento Community
Magento Community
Magento Community
 
Adam Moss
Sr. Member
 
Avatar
Total Posts:  248
Joined:  2009-02-11
Birmingham, UK
 

That CSS source code needs to go in an external style sheet such as boxes.css - I have no idea why it’s appearing there on your shop, it makes no sense. Don’t put it in any html or phtml files, it needs to go in a style sheet which is linked up to the pages.

 
Magento Community Magento Community
Magento Community
Magento Community
 
johnson m
Jr. Member
 
Total Posts:  13
Joined:  2009-06-17
 

Thanks for your help - fresh pair of eyes on it this evening and i spotted the error straight away - cheers

 
Magento Community Magento Community
Magento Community
Magento Community
 
johnson m
Jr. Member
 
Total Posts:  13
Joined:  2009-06-17
 

I now have this working perfectly thanks - does anyone know if it’’s possible to add a second category image for use in this listing? I read earlier in this thread about it, but someone mentioned it didn’t work on v.1.3+.

Anyone had any experience with this? Any help gratefully received.

 
Magento Community Magento Community
Magento Community
Magento Community
 
Contenda
Jr. Member
 
Total Posts:  10
Joined:  2009-03-07
 

Hi Guys,

I have started a similar thread to this one for Magento V.1.3.2.4 +++

I’m not being rude, it’s just that I feel that this thread, although very useful is not directed at Magento version 1.3 onwards.

The follow-up thread is here:

http://www.magentocommerce.com/boards/viewthread/70702/

 
Magento Community Magento Community
Magento Community
Magento Community
 
elfling
Enthusiast
 
Avatar
Total Posts:  901
Joined:  2008-10-21
 

Anyone help.

This use to work, but since upgrading to 1.3.2.4 it no longer works.

<?php 
$_main_categories
=$this->getStoreCategories();
if(
$_main_categories->count()):
    
$cnt=0;
    
    foreach (
$_main_categories as $_main_category):
        if(
$_main_category->getIsActive()):  
?>
    
        
                    <?php
                    $cur_category
=Mage::getModel('catalog/category')->load($_main_category->getId());
                    
$layer Mage::getSingleton('catalog/layer');
                    
$layer->setCurrentCategory($cur_category);                    
                    if(
$cnt==0)
                    
{
                    ?>                
                    
<div class="gallery-heading" >
                     <
table ><tr><td>
                         
            <
div class="pinkbox"><span class="whitetext"><?php echo $this->getCurrentCategory()->getName();?></span></div>            
            
            <
div class="imgbox">
                                    <
a href="<?php echo $this->getCurrentCategory()->getUrl()?>">
                                    
<?php if($_imageUrl=$this->getCurrentCategory()->getImageUrl()):?>
                                        
<img width="144px" height="145px" src="<?php echo $_imageUrl?>alt="<?php echo $this->getCurrentCategory()->getName();?>">
                                    
<?php else:?>
                                        
<img src="<?php echo $this->getSkinUrl('images/add-01.gif')?>" alt="<?php echo $this->getCurrentCategory()->getName();?>">
                                    
<?php endif;?>
                                    
</a>
                         </
div>
                         </
td>
                   
<? } else if ($cnt==1{ ?>
                       
<td>               
            
            <
div class="graybox"><span class="whitetext"><?php echo $this->getCurrentCategory()->getName();?></span></div>            
            
            <
div class="imgbox">
                       <
a href="<?php echo $this->getCurrentCategory()->getUrl()?>">
                       
<?php if($_imageUrl=$this->getCurrentCategory()->getImageUrl()):?>
                       
<img width="144px" height="145px"  src="<?php echo $_imageUrl?>alt="<?php echo $this->getCurrentCategory()->getName();?>">
                       
<?php else:?>
                       
<img src="<?php echo $this->getSkinUrl('images/add-01.gif')?>" alt="<?php echo $this->getCurrentCategory()->getName();?>">
                       
<?php endif;?>
                       
</a>
                </
div>
                         </
td>
        
<? } else  { ?>                         
              
<td>      
                  
            <
div class="darkbox"><span class="whitetext"><?php echo $this->getCurrentCategory()->getName();?></span></div>            
            
            <
div class="imgbox">
                       <
a href="<?php echo $this->getCurrentCategory()->getUrl()?>">
                       
<?php if($_imageUrl=$this->getCurrentCategory()->getImageUrl()):?>
                       
<img width="144px" height="145px"   src="<?php echo $_imageUrl?>alt="<?php echo $this->getCurrentCategory()->getName();?>">
                       
<?php else:?>
                       
<img src="<?php echo $this->getSkinUrl('images/add-01.gif')?>" alt="<?php echo $this->getCurrentCategory()->getName();?>">
                       
<?php endif;?>
                       
</a>
                </
div>
                        </
td>        
                        </
tr></table>
                        </
div>
                 
<? } ?>
<?php
    $cnt
++;
    if(
$cnt==3)
        
$cnt=0;
        endif;
    endforeach;
    
    
    if(
$_main_categories->count()%3!=0)
    
{
        
if($_main_categories->count()%==1)
            echo 
'<td><div class="whitebox"></div></td><td><div class="whitebox"></div></td>';
    if(
$_main_categories->count()%==2)            
        echo 
'<td><div class="whitebox"></div></td>';
                         
        echo 
'</tr></table></div>';
    
}
endif; 
?>
 
Magento Community Magento Community
Magento Community
Magento Community
 
seanbreeden
Member
 
Avatar
Total Posts:  74
Joined:  2010-02-12
Cincinnati, OH
 
Weezers Gifts - 14 November 2008 09:12 AM

clorne - 31 October 2008 10:21 AM
I’ve just come across this thread as I needed to add images to sub-categories.

Brendan’s code works very well for me, many thanks for posting but, and this may be blindingly obvious, to get a return from

$_category->getImageUrl()

you have to add

->addAttributeToSelect('image')


to the function getCurrentChildCategories() in

app\code\core\Mage\Catalog\Block\Navigation.php

as

$collection->addAttributeToSelect('url_key')
            ->
addAttributeToSelect('name')
            ->
addAttributeToSelect('is_anchor')
            ->
addAttributeToSelect('image')
            ->
addAttributeToFilter('is_active'1)
            ->
addIdFilter($category->getChildren())
            ->
setOrder('position''ASC')
            ->
joinUrlRewrite()
            ->
load();

Sorry if this has already been mentioned

edit

This change to the core code may be overwritten when you update!

Per this post this is what my code looks like:

$collection->addAttributeToSelect('url_key')
            ->
addAttributeToSelect('name')
            ->
addAttributeToSelect('is_anchor')
            ->
addAttributeToSelect('image')
            ->
addAttributeToFilter('is_active'1)
            ->
addIdFilter($category->getChildren())
            ->
setOrder('position''ASC')
            ->
joinUrlRewrite()
            ->
load();

In Magento 1.4 the location is:  /app/code/core/Mage/Catalog/Model/Resource/Eav/Mysql4/Category.php instead of \app\code\core\Mage\Catalog\Block\Navigation.php.

It is located in: function getChildrenCategories($category)

Mine looks like this:

$collection->addAttributeToSelect('url_key')
            ->
addAttributeToSelect('name')
            ->
addAttributeToSelect('all_children')
            ->
addAttributeToSelect('image')
            ->
addAttributeToSelect('is_anchor')
            ->
addAttributeToFilter('is_active'1)
            ->
addIdFilter($category->getChildren())
            ->
setOrder('position''ASC')
            ->
joinUrlRewrite()
            ->
load();
        return 
$collection;

-Sean

 
Magento Community Magento Community
Magento Community
Magento Community
 
palerain1216
Jr. Member
 
Avatar
Total Posts:  11
Joined:  2010-02-05
Dhaka
 

These articles are working nicely. I think display the category image is good. Thanks for your help.

 
Magento Community Magento Community
Magento Community
Magento Community
 
brucelim3000
Jr. Member
 
Total Posts:  3
Joined:  2010-02-20
 

I actually didn’t use static block because with all the stuff I had to add onto the page, it was just easier for me to update the XML file.

For people that does not want to use static block, simply follow the known method, such as changing the Navigation.php file on the core, and making up subcategory_listing.phtml inside “..\template\catalog\navigation\”

But skip the step that changes the category to only view static,
but just add this to “..layout\catalog.xml” file:

<block type="catalog/navigation" name="subcategoryListing" template="catalog/navigation/subcategory_listing.phtml"/>
This depends on where you want it to appear on page, but for example, it can look somethinng like..
<reference name="content">
            <
block type="catalog/category_view" name="category.products" template="catalog/category/view.phtml">
                <
block type="catalog/product_list" name="product_list" template="catalog/product/list.phtml">
                  <
block type="catalog/navigation" name="subcategoryListing" template="catalog/navigation/subcategory_listing.phtml"/>
                  ....
                  ....
Then you add
<?php echo $this->getChildHtml('subcategoryListing');?>
inside “../template/catalog/product/list.phtml”, where ever you want to put it. Doing this method will allow your products to show, unless you edit your phtml file.

This is awesome and it saved me lot of times, thanks everyone for the help. Works great on Ver 1.4

 
Magento Community Magento Community
Magento Community
Magento Community
 
Felipe Molina
Jr. Member
 
Total Posts:  2
Joined:  2010-04-22
 

I dont know why dont work for me.... Just show the category title but not the sub categorys

 
Magento Community Magento Community
Magento Community
Magento Community
 
Jawwad Alam
Jr. Member
 
Total Posts:  1
Joined:  2010-03-23
 

Brendan, Thanks a lot for your detailed instructions smile

 
Magento Community Magento Community
Magento Community
Magento Community
Magento Community
Magento Community
Back to top