Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

Open discussion on Better Navigation and Categories


burt

Recommended Posts

2. One of the major reasons for wanting to go to Recently Viewed pages is to compare products. Being able to do a split screen (two or even three products side-by-side) to compare would be great. Maybe as frames or iframes (with scroll bars) and Responsive Design to allow them to fit the smaller space? Having reasonably consistent layouts makes comparisons easier. Perhaps you could have a "comparison" page layout that would lay out everything in a consistent manner, adapted for a narrower viewport? Don't forget to make it easy to take one of the products out of the cart and put another in (clearly mark which one(s), if any, are already in the cart).

 

In between osCommerce work that pays the bills, I've been working on some ideas for this subject. I now need feedback on Both Projects;

 

1. Comparison Page. Go to any product page (or category product listing) on http://template.me.uk/testing/ and click "Compare" button. Visit another product page and do the same. See the new infoBox above the Shopping Cart. Click the button in the box.

 

AND

 

2. Better / Worse / Related Products. Go to http://template.me.uk/testing/product_info.php?products_id=9 and you will see new boxes towards the bottom where there are links to other products, here there are 3 options;

  1. Related Products, possibilities (I'm sure you can think of more);
    • Family of Products (eg, buy a wetsuit, also buy a surfboard, leash, rash vest or buy a phone & buy insurance, screen protector, case, etc etc etc)
    • Link Product by a common theme (eg, I linked the films starring Steven Segal)

[*]Alternative Products

  • Better Products (eg an upgrade)
  • Worse Products (eg a more cost effective solution)

 

Feedback on both of these ideas would not only be appreciated, but would be helpful in determining the right way forward for them in relation to releasing them as addons or core.

Link to comment
Share on other sites

  • Replies 161
  • Created
  • Last Reply

@@burt on the Better / Worse Module

 

Is this a replacement for the X-sell contribution and an adjustment to the also purchased module?

Will this be a modular install? (eg a couple of clicks from admin)

 

One problem I have always had with x-sell and also -viewed is that it is hidden off the bottom of the screen (on my computers anyway) and unless a customer scrolls down he will never see them - If there was a way to show them within the main product list area they would maybe get more attention?

 

Thanks

Now running on a fully modded, Mobile Friendly 2.3.4 Store with the Excellent MTS installed - See my profile for the mods installed ..... So much thanks for all the help given along the way by forum members.

Link to comment
Share on other sites

@@burt

Like the comparison page

 

I personally don"t see how "better/worse" label would be a good idea, as it is subjective.

 

The related products I have pretty much as you with thumbnail category browse and family of products.

I display family of products if any, and only show products of the same category when there is no family data.

so the display of one module is dependent on the outcome of another.

Is there an elegant way to do this in standard osc ?

KEEP CALM AND CARRY ON

I do not use the responsive bootstrap version since i coded my responsive version earlier, but i have bought every 28d of code package to support burts effort and keep this forum alive (albeit more like on life support).

So if you are still here ? What are you waiting for ?!

 

Find the most frequent unique errors to fix:

grep "PHP" php_error_log.txt | sed "s/^.* PHP/PHP/g" |grep "line" |sort | uniq -c | sort -r > counterrors.txt

Link to comment
Share on other sites

@@bruyndoncx@@burta quite elegant way to do this is with the Add-This Layers Menue which has the facility to have a Whats-Next and Related items - but my problem with this is that it is not controllable by the shop owner - if it was then it would be a great feature.

Now running on a fully modded, Mobile Friendly 2.3.4 Store with the Excellent MTS installed - See my profile for the mods installed ..... So much thanks for all the help given along the way by forum members.

Link to comment
Share on other sites

@@burt

 

I really like the compare products. I can see that being a very popular addon and it is very simple to use.

 

I can see the potential for the 'Better / Worse / Related Products' but not using words like 'Better or Worse' as that makes me think the worse product should be avoided at all costs. A similar type of thing was tried instore by Iceland and they relabelled the wine bottles with 'good red', 'good white' which did not work.

 

Mark

Link to comment
Share on other sites

1. Comparison. This works, but it's cumbersome and rather ugly. I have to visit several pages to accumulate products to compare, then I have to notice another box has appeared and click another button there. The resulting page is rather lacking in data to compare. I can't see any value in comparing the SKU, Model Number, etc. Specifications or product features would be interesting.

 

The sites that I have seen that do comparisons do it from the Category (Product Listing) page. I can click as many boxes as the site will let me and then click a compare button, all from one page. The resulting page compares intersting and useful data. For an example of this, go look at any computer product category on Newegg.

 

I have implemented something very much like this on osCommerce. It requires Product Specifications (to have something to compare) and a modular Categories page. Anybody who wants it can have the code for the asking. Just don't expect a fancy Addons package -- I don't have the time.

 

2.1 Equivalent Products. If this is other products in the same category, this would be easy to do and useful. Maybe have the option of showing products with similar prices (Return products in category ordered by price, then pick 2 cheaper and 2 more expensive.) Or do something similar but ordered by popularity. Or ordered by the default product order in the category. Many possibilities here.

 

Family of Products. This is what I use the Xsell addon for. A bit of a pain to maintain, but a great idea for increasing sales.

 

2.2 Alternative Products. How is this different from Equivalent Products? Some other way of setting up what's equivalent?

 

These are all good ideas. I've used all of them in one form or another on one or more sites. PM me if you want to see examples or if you want the code.

 

Regards

Jim

See my profile for a list of my addons and ways to get support.

Link to comment
Share on other sites

@@kymation - the compare button also exists on the category listing pages. Clicking it does not change the page, so can click as many as you like. Of course there is no value in comparing the SKU etc, but please tell what other data I can look at in a standard osCommerce install ;) What the page compares is unimportant, the idea behind it is more important. I could go and add specifications, or extra product fields or whatever...but then that make the system unsuitable for any standard shop, the point is to alow the user to add in whatever data they want to compare.

 

@@PupStar @@bruyndoncx - forget the words, these are just words to show the difference that can be done, the shopowner can use any text in it's place, or no text...

 

@@kymation - in the better/worse scenario, the shopowner can promote 1 product over another, the words "better/worse" don't matter. In equivalent (or alternative) products, the shopowner could sell a mobile phone SIM or case or screen protector on the mobile phone product page. I worded my post incorrectly which might have caused a confusion.

Link to comment
Share on other sites

@@Mort-lemur - the placement on the page of any addon is solely down to the skillset of the person placing it (if you see what I mean). If the page is long, consider having the better/worse/related things in an infobox (like the recently viewed box for example), or to have the product data in tabs. So long as the data is available, it can be placed as one wishes...

Link to comment
Share on other sites

For anyone interested, I based the products_compare page & infobox on the way that Magento do it and Opencart does it. In both of these softwares I noticed that the "add to compare" functionality is more basic than what we have in osCommerce (or will have v. soon).

 

What I do need to work out is some sort of message to tell people that they just added the product to the comparison list, something in your face like this (which is for the cart addition, but gives the general idea of where I'm heading):

Link to comment
Share on other sites

  • 3 weeks later...

Could someone mockup the perfect product info page including other products, similar products, alternative products, and all the other stuff talked about.

 

If store-owners can decide on an end result (that works for most shops), code work can start on making it happen...

 

OR

 

If you know of another cart software that you particularly like the look of the product, page, feel free to link to a demo...

Link to comment
Share on other sites

@@burt I really like the way that the "add-this" layers menu has a pop-up box with the "whats-next" function - but I have disabled this on my site as its content is driven by add-this and not what I may wish to show my site visitors. (I think they have started offering some control on their paid version).

 

If something like this could be developed for OSC with the site owner being able to define the content from admin by the way of x-sell or related products etc that would be awesome. But I think we need to move away from the bog-standard (and ugly) stock osc boxes.

 

Also If this could be tailored, to say show x-sells on the products page, but then change on the checkout pages to say "have you forgotton to buy" items

 

Then after Lunch you could plat some sawdust ? (w00t)

Now running on a fully modded, Mobile Friendly 2.3.4 Store with the Excellent MTS installed - See my profile for the mods installed ..... So much thanks for all the help given along the way by forum members.

Link to comment
Share on other sites

I can see the potential for the 'Better / Worse / Related Products' but not using words like 'Better or Worse' as that makes me think the worse product should be avoided at all costs.

 

Many stores use "good, better, best" rankings for their products (e.g., Tru-Value Home & Garden), or perhaps "budget, value, deluxe". Airlines use "economy/coach, business, first class". You get there just as quickly in any class, but if you are willing to pay more, you can get better service.

 

You don't want to make it sound like any of your products or services should be avoided, but that there's a difference in value (cost vs. quality/features). That lets people shop on cost while watching what features they get.

Link to comment
Share on other sites

  • 1 month later...

Question on "Also Recently Viewed" Module

 

I have installed the above module and it is Fantastic - works great - Thanks to all involved.

 

One small question - is there a way to "tidy-up" the text that is displayed? As you can see from the image below, the text is wrapped and this appears underneath the icon on a new line with a large space which looks rather untidy.

Mort, @@Mort-lemur

if your still using the Recently Viewed v4, try this and let me know if it's better.

/includes/modules/boxes/bm_viewed.php

 

find

 $data = '<div class="ui-widget infoBoxContainer">' .
		 ' <div class="ui-widget-header infoBoxHeading">' . MODULE_BOXES_VIEWED_BOX_TITLE . '</div>' .
		 ' <div class="ui-widget-content infoBoxContents">';
 $products_viewed_query = tep_db_query("select distinct p.products_id, pd.products_name, p.products_image from " . TABLE_PRODUCTS . " p, " . TABLE_PRODUCTS_DESCRIPTION . " pd where p.products_status = '1' and p.products_id IN (" . $viewed . ") and p.products_id = pd.products_id and pd.language_id = '" . (int)$languages_id . "' ORDER BY FIELD(p.products_id, " . $viewed . ") LIMIT 5");
 while ($products_viewed = tep_db_fetch_array($products_viewed_query)) {
	 $data .= tep_image(DIR_WS_IMAGES . $products_viewed['products_image'], $products_viewed['products_name'], SMALL_IMAGE_WIDTH/3, SMALL_IMAGE_HEIGHT/3, 'style="vertical-align: middle;"') . ' <a href="' . tep_href_link(FILENAME_PRODUCT_INFO, 'products_id=' . (int)$products_viewed['products_id']) . '">' . $products_viewed['products_name'] . '</a><br />';
 }

 

Replace with

 $data = '<div class="ui-widget infoBoxContainer">' .
		 ' <div class="ui-widget-header infoBoxHeading"><a href="' . tep_href_link(FILENAME_RECENTLY_VIEWED) . '">' . MODULE_BOXES_VIEWED_BOX_TITLE . '</a></div>' .
		 ' <div class="ui-widget-content infoBoxContents" align="center">';
 $products_viewed_query = tep_db_query("select distinct p.products_id, pd.products_name, p.products_image from " . TABLE_PRODUCTS . " p, " . TABLE_PRODUCTS_DESCRIPTION . " pd where p.products_status = '1' and p.products_id IN (" . $viewed . ") and p.products_id = pd.products_id and pd.language_id = '" . (int)$languages_id . "' ORDER BY FIELD(p.products_id, " . $viewed . ") LIMIT 5");
 while ($products_viewed = tep_db_fetch_array($products_viewed_query)) {
	 $data .= '<div>' . '<a href="' . tep_href_link(FILENAME_PRODUCT_INFO, 'products_id=' . (int)$products_viewed['products_id']) . '">' . tep_image(DIR_WS_IMAGES . $products_viewed['products_image'], $products_viewed['products_name'], '', '60', 'style="vertical-align: middle;"') . '</div>' . '<div><a href="' . tep_href_link(FILENAME_PRODUCT_INFO, 'products_id=' . (int)$products_viewed['products_id']) . '">' . $products_viewed['products_name'] . '</a></div><div class="clear"></div>';

@@burt

Also -

Anyone notice this line does not work:

 

 if (sizeof($products_viewed) > 5) {

 

The button never shows regardless of query limit # or this setting # settings. The button shows (always of course) if I remove the line.

 

I also tried

 if (count($products_viewed) > 5) {

 

but no change.

-Dave

Link to comment
Share on other sites

Link to comment
Share on other sites

@@toyicebear

 

Thanks for the input! Unfortunately no change. Here is the entire function.

 

function execute() {
 global $oscTemplate, $navigation, $languages_id, $PHP_SELF;
 $products_viewed = $navigation->products;
 if (basename($PHP_SELF) == FILENAME_PRODUCT_INFO) {
 unset($products_viewed[0]);
 }
 if (sizeof($products_viewed) > 0) {
 $viewed = implode(",", array_unique($products_viewed));
 $data = '<div class="ui-widget infoBoxContainer">' .
		 ' <div class="ui-widget-header infoBoxHeading"><a href="' . tep_href_link(FILENAME_RECENTLY_VIEWED) . '">' . MODULE_BOXES_VIEWED_BOX_TITLE . '</a></div>' .
		 ' <div class="ui-widget-content infoBoxContents" align="center">';
 $products_viewed_query = tep_db_query("select distinct p.products_id, pd.products_name, p.products_image from " . TABLE_PRODUCTS . " p, " . TABLE_PRODUCTS_DESCRIPTION . " pd where p.products_status = '1' and p.products_id IN (" . $viewed . ") and p.products_id = pd.products_id and pd.language_id = '" . (int)$languages_id . "' ORDER BY FIELD(p.products_id, " . $viewed . ") LIMIT 3");
 while ($products_viewed = tep_db_fetch_array($products_viewed_query)) {
	 $data .= '<div>' . '<a href="' . tep_href_link(FILENAME_PRODUCT_INFO, 'products_id=' . (int)$products_viewed['products_id']) . '">' . tep_image(DIR_WS_IMAGES . $products_viewed['products_image'], $products_viewed['products_name'], '', '60', 'style="vertical-align: middle;"') . '</div>' . '<div><a href="' . tep_href_link(FILENAME_PRODUCT_INFO, 'products_id=' . (int)$products_viewed['products_id']) . '">' . $products_viewed['products_name'] . '</a></div><div class="clear"></div>';
 }
//	 if (sizeof($products_viewed) > 3) {
 if (count($products_viewed_query) > 3) {
	 // button
	 $data .= '<div class="buttonSet">';
	 $data .= ' <span class="buttonAction">' . tep_draw_button(IMAGE_BUTTON_VIEW_ALL, 'note', tep_href_link(FILENAME_RECENTLY_VIEWED)) . '</span>';
	 $data .= '</div>';
	 $data .= '<div class="clear"></div>';
 }
 $data .= ' </div>' .
			 '</div>';

 $oscTemplate->addBlock($data, $this->group);
 }
}

 

seems to be pretty straight forward and should work. I'm using LIMIT 3 and sizeof/count 3 above.

-Dave

Link to comment
Share on other sites

since you have limit set to 3 ... the count will never reach higher than 3...

Link to comment
Share on other sites

@@toyicebear

yep. but the button still does not show. Does it work on your version? anyone else?

the default file had LIMIT 5 / sizeof 5

Trust me I've tried every possible combo 5/4, 4/5, 5/3, 3/5 etc... but no luck. removing the if altogether shows the button, but for some reason it's not working, at least for me.

 

I appreciate your replies. Thanks! I can get by with the LIMIT at 3 and the button always on, looks pretty nice, but It would be better the way its written. I'll keep pluggin at it.

 

also new 2.3.3.4 and php 5.2.17

-Dave

Link to comment
Share on other sites

@@Roaddoctor That works well thank you. Neatens up the Recently Viewed Items.

 

I have no trouble reducing the number of items to 3 - maybe something in your cache?

 

Thanks again

Now running on a fully modded, Mobile Friendly 2.3.4 Store with the Excellent MTS installed - See my profile for the mods installed ..... So much thanks for all the help given along the way by forum members.

Link to comment
Share on other sites

@@toyicebear

yep. but the button still does not show. Does it work on your version? anyone else?

the default file had LIMIT 5 / sizeof 5

Trust me I've tried every possible combo 5/4, 4/5, 5/3, 3/5 etc... but no luck. removing the if altogether shows the button, but for some reason it's not working, at least for me.

 

I appreciate your replies. Thanks! I can get by with the LIMIT at 3 and the button always on, looks pretty nice, but It would be better the way its written. I'll keep pluggin at it.

 

also new 2.3.3.4 and php 5.2.17

 

 

The point being if you have limit 3 ... the count will never be higher than 3.... so > 3 will never be reached.... so you would rather use > 2 or >= 3

Link to comment
Share on other sites

  • 3 months later...

Just a question...

 

I have A, B, C categories on english H, A, Y on other language and 1, 2, 3 sort order values.

 

English - Other - Categories sort order value

A          - H        - 1

B          - A        - 2

C          - Y        - 3

 

Is it a real sort order of the categories on other language? What would be a reason of sort order?

:blink:
osCommerce based shop owner with minimal design and focused on background works. When the less is more.
Email managment with tracking pixel, package managment for shipping, stock management, warehouse managment with bar code reader, parcel shops management on 3000 pickup points without local store.

Link to comment
Share on other sites

  • 3 weeks later...

Nice addon - I like and use it.

 

To fix the error in the execute() function, make the follwing 3 changes:-

 

replace

      $products_viewed = $navigation->products;

with

      $products_viewed      = array_unique($navigation->products);
      $products_viewed_qty  = count($products_viewed);

 

replace

      if (sizeof($products_viewed) > 0) {
        $viewed = implode(",", array_unique($products_viewed));
with

      if ($products_viewed_qty > 0) {
        $viewed = implode(",", $products_viewed);

 

change

        if (sizeof($products_viewed) > 5) {
to

        if ($products_viewed_qty > 5) {

Link to comment
Share on other sites

Just spotted a mistake in my code-fix above:-

 

remove this line

    $products_viewed_qty  = count($products_viewed);

 

and place it after this clause

     if (basename($PHP_SELF) == FILENAME_PRODUCT_INFO) {
     unset($products_viewed[0]);
     }

 

 

Thanks for this neat mod!

Link to comment
Share on other sites

I am trying to achieve something that I can't seem to find already in existance. My client would like each of their top level categories to have it's own background color (see image linked below). I have tried multiple category modifying contributions - but cannot seem to find a way to modify them to give a different background color based on the categories_id. I am guessing my PHP is just too rusty. Has anyone achieved this?

 

My latest attempt is using Advanced Categories Box for osC 2.3 - I am currently running osC 2.3.4  I have not found a contribution thread specifically for this contribution. I have also tried with superfish and 2 other modules. This one seems to be the closest to allowing me to either call a class inside the <li> tag for each category or place a <div> inside the <li> tag for each category that has the background color set in a stylesheet.

 

I have attempted to modify the code this way to check for my first category which happens to be cPath 22 which I believe is the categories_id - looking at the database shows the categories_id to start with 22 as the first category (based on sort order).

 

        while ($categories_top = tep_db_fetch_array($categories_query_top))  {
            if($categories_top['parent_id'] == 0){
                if($i == 0){
                    $output = '<div id="ddsidemenubar" class="markermenu"><ul>';
                }
                if($this->cattreeLeft($categories_top['categories_id'], ($level+1), $categories_top['categories_id']) == "22"){
                    $output .= '<li><div id="id22"><a href="'.tep_href_link(FILENAME_DEFAULT, 'cPath=' . $categories_top['categories_id']).'" rel="ddsubmenuside'.$categories_top['categories_id'].'">'.ucwords($categories_top['categories_name']).'</a></div></li>';
                }else{
                    $output .= '<li><a href="'.tep_href_link(FILENAME_DEFAULT, 'cPath=' . $categories_top['categories_id']).'">'.ucwords($categories_top['categories_name']).'</a></li>';
                }

 

Anyway - when I simply view the page there is no change in color for the first category, and when I inspect the page my <div id="id22"> isn't in the code. So - apparently, I am not correctly getting the category id.

 

Is anyone able to see why my code isn't working?

 

PS - I did remove the background color tags from the markermenu class and there is no #ddsidemenubar settings in any of the css files for this contribution. I did create #id22 with nothing but a background color setting - but the fact the <div id="id22"> isn't even showing up in the source code tells me my attempt at specifying a particular category isn't working.

 

I am grateful for any help anyone can offer on this - I am stumped :(

 

What I am attempting to achieve is:

http://tcdataweb.com/KKTestSite/images/superfish_example.jpg

 

~Tracy
 

Link to comment
Share on other sites

I DID IT!! Woohoo!!

 

So - using the Advanced Categories Box for osC 2.3 I modified the code of bm_categories_menu.php to read this way (changes are on lines 45 and 46 of the file) - it is the addition of the class with categories_id on two lines

 

        while ($categories_top = tep_db_fetch_array($categories_query_top))  {
            if($categories_top['parent_id'] == 0){
                if($i == 0){
                    $output = '<div id="ddsidemenubar" class="markermenu"><ul>';
                }
                if($this->cattreeLeft($categories_top['categories_id'], ($level+1), $categories_top['categories_id']) == ""){
                    $output .= '<li class="CatId'. $categories_top['categories_id'] .'"><a href="'.tep_href_link(FILENAME_DEFAULT, 'cPath=' . $categories_top['categories_id']).'" rel="ddsubmenuside'.$categories_top['categories_id'].'">'.ucwords($categories_top['categories_name']).'</a></li>';
                }else{
                    $output .= '<li class="CatId'. $categories_top['categories_id'] .'"><a href="'.tep_href_link(FILENAME_DEFAULT, 'cPath=' . $categories_top['categories_id']).'">'.ucwords($categories_top['categories_name']).'</a></li>';
                }
                if($i == ($totCat-1)){
                    $output .= '</ul></div>';
                    $output .= '<script type="text/javascript">ddlevelsmenu.setup("ddsidemenubar", "sidebar") //ddlevelsmenu.setup("mainmenuid", "topbar|sidebar")</script>';
                }
                $output .= $this->cattreeLeft($categories_top['categories_id'], ($level+1), $categories_top['categories_id']);
            }else{
                if($i == 0 && $level == 1){
                    $output .= '<ul id="ddsubmenuside'.$categories_top['parent_id'].'" class="ddsubmenustyle blackwhite">';
                }elseif($i == 0 && $level > 1){
                    $output .= '<ul class="innerUi">';
                }
                $output .= '<li>';
                $output .= '<a href="'.tep_href_link(FILENAME_DEFAULT, 'cPath=' . $cPath_tree.'_'.$categories_top['categories_id']).'">'.ucwords($categories_top['categories_name']).'</a>';
                $output .= $this->cattreeLeft($categories_top['categories_id'], ($level+1), $cPath_tree.'_'.$categories_top['categories_id']);
                $output .= '</li>';
                if($i == ($totCat-1)){
                    $output .= '</ul>';
                }            
            }
            $i++;
        }
        return $output;
      }   

 

Then- inside my ddlevelsmenu-sidebar.css I created the CatID classes like so (I still need to work out a hover setting):

 

.CatId27 {
background-color: #666666;
clear: left;
position: relative; /*Preserve this for "right" arrow images (added by script) to be positioned correctly*/
-moz-border-radius: 5px;
border-radius: 5px;
}

~Tracy
 

Link to comment
Share on other sites

  • 11 months later...

@@burt

 

I have a OSC 2.3.4BS store. It is a large store with thousands of products and hundreds of categories. While I think a fly out menu is great for most stores, but having a couple thousand sub-categories would be a hassle for that kind of feat. 

 

I realize most shop owners don't have stores as large as mine so the fly-out or pop-up type menus may better suit their needs. I was thinking for very large stores with thousands of sub-categories should benefit from a pagination system of some kind that will be better organized. Allow me to elaborate a little.

 

You have the categories box in the side panel  with the top level categories. You click on one and led to an expanded second level of categories that display 10 or less sub-categories. That's not so bad but when a customer click on one of the second level categories you're taken to a further defined third level with hundreds or may a thousand sub-categories.

 

What could be done with a mess that huge? My suggestion is this, have a numerical/alphabetical navigation bar. That idea has been thrown around before but I can't find a sound and up-to-date example. 

 

So navigation bar with numbers 0-9 and letters A-Z. Like this 0 | 1 | 2 | 3 |.....| 9 |    then A | B| C| D | E |........| X | Y | Z |. With the CSS styling like the navbar of "Pagination On Index"  from 28 Days of code. It's a simple idea but since I'm not a coder, I can't imagine the amount of coding it will take. Also, maybe it could be modular with little or no tampering with the core code.

 

When a potential customer clicks on a number or letter in the navigation bar, all categories that begin with that number or letter will be displayed in a list. In my opinion, that will be a better and more organized way to present  hundreds of categories to visitors without overwhelming and discouraging them.

 

Just an idea. Your thoughts are welcomed.

 

Thanks for reading

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...