Customizing Items and Item Layout

Hello, I am creating customized DJ Catalog layouts using layout overrides. It appears that DJ Catalog is inserting height to the "djc_subcategory_bg" class. When I inspect the div in Chrome, it has the following css: {
height: 277px;

If I had to guess, I would say that DJ Catalog is using javascript to make these divs equal height. But my goal acheive equal height with flexbox/bootstrap4 instead.

Is there a way to disable divs being assigned pixel height values?

Thank you for your assistance!


  • Also, since I am creating a catalog site, I do not need a cart. I have disabled the cart in the configuration, but DJ Catalog is still loading javascript for a cart modal/popup (which is adding the divs "#djc_cart_popup_loader" and "#djc_cart_popup" on every page). How can I diable this?

  • UPDATE: I removed

    <?php echo $colClassName; ?>

    From line 41 of /items/default_subcategories.php

    And that stopped fixed height being added to the ".djc_subcategory_bg" div

    (Still haven't found how to disable the cart popup script, though)
  • Hi,

    1. The script responsible for setting equal height for divs is inside theme.js file inside your theme. If you don't have such file then default one is used instead (themes/default/js/theme/js).
    You will find DJCatMatchBackgrounds() function in which DJCatMatchModules() is being called in order to set the height of thumbnails, items and categories.

    2. Cart modal container is harmless even if you don't use cart on your website, so I don't see a reason why would you want to remove it. But you will find it in the same theme.js file if you need.
  • Thank you for the information. The theme.js inserts a div with a small button/box (#1) beneath the footer of my home page (#2 is what it looks like when inspected in Chrome).

    On pages other than the homepage, when I inspect in Chrome there is a javascript error (#3)

    I wish to eliminate these. Especially #1 because it's adding an unwanted div to the home page design.

    I will look into disabling/editing the theme,js in order to resolve these. Thanks!
  • Hi,

    1. You can see, even on your screen-shots that the modal element uses "hide" class which in Bootstrap framework is meant to hide elements. So either your template doesn't support Bootstrap v2 or does it not fully properly.
    2. It seems that Magnific Popup library is not included. Please contact us via helpdesk regarding this problem as you will need to send us URL and Super Admin access to your website. Two most likely reasons:
    a) Not all component files have been installed during update/installation, that is the ones inside /media/djextensions/ directory.
    b) Sometimes various JS script optimizers (merging tools) tend to "optimize" too much.
Sign In or Register to comment.