Jump to content

Top menu subcategory image


Recommended Posts

Hi everyone.

 

i'm new with prestashop.

 

I'd like to have a simple customization for top menu request.

 

i can associate for a category and subcategory an image.

 

Is there a way to display it on topmenu?

 

like this attached menu.

 

 

post-784117-0-33502500-1397463315_thumb.jpg

Link to comment
Share on other sites

hi vekia! thanks for your reply.

 

YES, clicking on Hotel (exampe) you can see the subcaterogies menu: image + subategory name.

 

Now (default) i can see only subcategory name.

 

is there a way to have it?

 

when i create category and subcategory name,

i can add a little image (in this case 120x33), this image i'd like to use on subcategory menu...

Link to comment
Share on other sites

 

 

I'd like to have a simple customization for top menu request.

it will not be as simple as it seems ;)

contents of default block top menu are generated in module .php file

you have to change code there, and include <img> tag with src param based on Link->getCategoryImage function

Link to comment
Share on other sites

oh. thank you!

 

i'll be testing on it.

 

 

and obviously i'll share it to you :)

 

an other question.

for testing, is possible to "duplicate" this module renaming sql queries and mysql table? :S

 

or my idea is not permitted from PS license ?

Link to comment
Share on other sites

  • 3 weeks later...
  • 5 months later...
  • 4 weeks later...
  • 11 months later...

Hi !

In PS 1.6 we are this function but this add in sub menu too.

protected function generateCategoriesMenu($categories, $is_children = 0)
    {
        $html = '';

        foreach ($categories as $key => $category) {
            if ($category['level_depth'] > 1) {
                $cat = new Category($category['id_category']);
                $link = Tools::HtmlEntitiesUTF8($cat->getLink());
            } else {
                $link = $this->context->link->getPageLink('index');
            }

            /* Whenever a category is not active we shouldnt display it to customer */
            if ((bool)$category['active'] === false) {
                continue;
            }

            $html .= '<li'.(($this->page_name == 'category'
                && (int)Tools::getValue('id_category') == (int)$category['id_category']) ? ' class="sfHoverForce"' : '').'>';
            $html .= '<a href="'.$link.'" title="'.$category['name'].'">'.$category['name'].'</a>';

            if (isset($category['children']) && !empty($category['children'])) {
                $html .= '<ul>';
                $html .= $this->generateCategoriesMenu($category['children'], 1);

                if ((int)$category['level_depth'] > 1 && !$is_children) {
                    $files = scandir(_PS_CAT_IMG_DIR_);

                    if (count(preg_grep('/^'.$category['id_category'].'-([0-9])?_thumb.jpg/i', $files)) > 0) {
                        $html .= '<li class="category-thumbnail">';

                        foreach ($files as $file) {
                            if (preg_match('/^'.$category['id_category'].'-([0-9])?_thumb.jpg/i', $file) === 1) {
                                $html .= '<div><img src="'.$this->context->link->getMediaLink(_THEME_CAT_DIR_.$file)
                                .'" alt="'.Tools::SafeOutput($category['name']).'" title="'
                                .Tools::SafeOutput($category['name']).'" class="imgm" /></div>';
                            }
                        }

                        $html .= '</li>';
                    }
                }

                $html .= '</ul>';
            }

            $html .= '</li>';
        }

        return $html;
    }
Link to comment
Share on other sites

  • 1 month later...
  • 2 years later...

Hello, is it too late to give you the answer at this time ? :D  Here i explained how to show subcategories images on Prestashop menu for Prestashop 1.7 :

https://www.prestasoo.com/blog/how-to-show-subcategories-images-in-prestashop-s-top-menu.html

I don't want to talk about Prestashop 1.5 & 1.6 because they are too old.

Edited by PrestaSOO
typing mistake (see edit history)
Link to comment
Share on other sites

  • 1 year later...
  • 4 months later...
On 4/14/2014 at 9:15 AM, Fanto said:

Hi everyone.

 

i'm new with prestashop.

 

I'd like to have a Speed Test Scrabble Word Finder Solitaire simple customization for top menu request.

 

i can associate for a category and subcategory an image.

 

Is there a way to display it on topmenu?

 

like this attached menu.

 

 

post-784117-0-33502500-1397463315_thumb.jpg

Hey i want the exactly the same thing. I like to place a small picture next to each sub-category either the Picture or the thumbnail for that subcategory.

Edited by diondlemarcu (see edit history)
Link to comment
Share on other sites

  • 3 years later...
On 4/13/2018 at 3:42 AM, PrestaSOO said:

Hello, is it too late to give you the answer at this time ? :D  Here i explained how to show subcategories images on Prestashop menu for Prestashop 1.7 :

https://www.prestasoo.com/blog/how-to-show-subcategories-images-in-prestashop-s-top-menu.html

I don't want to talk about Prestashop 1.5 & 1.6 because they are too old.

Hello, thank you PrestaSoo for this article (both in french and english 😍).

As I don't have the Magic menu yet, the code as it is in the article didn't work for me.

However it's structure helped me get to this if which did work to show a thumbnail next to the name of the subcategory on prestashop 1.7.8:

                {if $node.image_urls|count}
                  {foreach from=$node.image_urls item=image_url}
                    <img src="{$image_url}" width="30">
                  {/foreach}
                {/if}

I leave it here in case it could help someone else.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...