Jump to content

Demitry

Members
  • Content count

    288
  • Joined

  • Last visited

  • Days Won

    8

Everything posted by Demitry

  1. @Tsimi just tested it and it's not working. Thinking about it, ..the class files are for structuring the the dynamic categories menu list, but I had added more menu options to it and those had <li class="divider"></li> tags, which were not showing up. So, the class file missing that divider code was not the issue.
  2. @Tsimi yep, I found it, right after I made that last post. lol
  3. @Tsimi hey Lambros, I am almost finished with those two menu modules and my site header is looking really great! I'm having a problem with the divider not displaying in the XS version. I added the insert statement to function install() and the MODULE_CONTENT_HEADER_CATMENU_XS_DIVIDER to the function keys() array in /includes/modules/content/header/cm_header_catmenu_xs.php ..then checked in admin and it shows the divider as enabled. However, it is not displaying in the actual menu. Do you know what it could be? did I miss something? btw, I found this javascript fix for when the dropdown-menu goes off screen, ..in case you want to use it. I just added it to the script in /includes/modules/content/header/templates/catmenu.php bottom of page. // fix for when the dropdown menu goes off screen $(document).on('shown.bs.dropdown', function () { OffsetDropdown() $(window).on('resize.bs.dropdown', function () { OffsetDropdown() }) }) $(document).on('hide.bs.dropdown', function() { $(window).off('resize.bs.dropdown') }) var OffsetDropdown = function() { var dropdown = $('.open>.dropdown-menu') if (dropdown.length == 0) return var rightOffset = dropdown.offset().left + dropdown.width() var browserWidth = $('body').innerWidth() var neededLeftOffset = dropdown.position().left - (rightOffset - browserWidth) if (neededLeftOffset < 0) { dropdown.css({ left: neededLeftOffset - 3 }) } else { dropdown.css({ left: 0 }) } }
  4. @Tsimi Lambros, Thanks man! That really helps... I've modified the catmenu_xs.php templates to include the header buttons and a hamburger menu icon for tablets and mobile. For some reason I thought the end of the class file was the way to go because the list structure is defined there, but I'll def use the template files instead. Thanks again. Demitry
  5. @Tsimi Right, that's what I thought. I don't think it should be a problem. I think it's just adding some <li></li> links code towards the end of the related class files. I'll have to take a look and see.
  6. @Tsimi hey Lambros, How do I add pages to the menu for both modules? Pages like About Us, Contact, FAQ, etc., I looked for something in the admin area - kind of like WordPress has where you add pages and add them to the menu, but could not find it. Or do I need to hard code them into both modules? I should add that I will be using the menus for more than just categories.
  7. Ok, so I solved the issue of placing the header buttons module in the Horizontal Categories Menu module (for tablet screen size) ..by setting the sort-order higher for the header buttons module and then setting its margin-bottom to -34px (height of the button group) and bottom to -10px. See attached screenshot. I did not nest the modules, but just applied a CSS fix. However, I’d still like to hear from one of the experts, if there is a simple way to nest a module inside another? My new challenge is with including some of the sub-modules from the navigation bar in the Horizontal Categories Menu module as part of the menu.
  8. is there a simple way to nest a module inside another? I installed the Horizontal Categories Menu and want to use the header buttons module inside of it, but nothing seems to work. I tried including the template, and then added the code inside that menu module template, but this is just kicking back errors.
  9. @Tsimi Lambros, no worries man, ..there's no need to change it, I was just making a suggestion. I installed BS Edge about a month and half back and am learning the new osC structure all over again. It's good stuff, though it's not a turn-key solution and contrary to Burt and other top contributors, ..I believe it should be.
  10. @Tsimi one minor correction: in change #1 of my aforementioned post above,… removed class hidden-sm on line 18… fantastic contribution! ..should really be a default or integrated option for osC BS Edge. If there is one thing I’d suggest is to minify and combine the two javascript files into one and add the css from /ext/menu_xs/css/component.css and the css code in /includes/modules/content/header/templates/catmenu.php to the user.css file. This would reduce the number of resources called in /includes/modules/content/header/templates/catmenu_xs.php file from three to one and help with page loading speed. However, I realize that these changes would also add an extra step to the installation (via the user.css file addition) and make it slightly more technical for the non-techie user.
  11. @Tsimi hey Lambros, I appreciate the follow-up. Actually, I did not need to change any of the CSS for that. The default state of the navbar collapse break-point is 992px (I think). And I needed it to be 767px. So, I resolved it by making the following two changes. 1) /includes/modules/content/header/templates/catmenu.php removed class hidden-sm on line 17, so that it looks like this: echo '<div id="catMenu" class="col-sm-12 hidden-xs">'; 2) /includes/modules/content/header/templates/catmenu_xs.php removed class visible-sm on line 20, so that it looks like this: <div id="dl-menu" class="dl-menuwrapper visible-xs" style="z-index:10000;"> That's it! Works awesome! ...and btw, I love that it is two separate modules, because this way I can just change the sort order and make the XS menu display at the top of the page for mobile devices. Thank you for all your help. Demitry
  12. @Tsimi cool, ..thanks Lambros somehow I had to write three paragraphs to say that I needed to change the brake-points for when the navbar collapses. lol I'll take a look at these links now.
  13. @Tsimi hey Lambros, ..thank you for the reply. yeah, I thought that containing span tag was unnecessary, but I figured I'd stay consistent with the rest of the contribution because /includes/classes/catmenu.php has the same nested span set on line 70. I'll remove them in both files. As far as the other thing, I'm a bit new to BS and I did not want to alter that BS grid structure for XS and SM. I'll take a look at that file today. I redesigned the header layout and was looking to have the horizontal menu change to the compact mobile version, but at a screen width that would accommodate my layout design. That change needs to be made where the screen width is smaller than the one controlled by the BS grid for XS and SM. So, I need to find a solution to somehow manage that switch, ..whether from the user.css file or some other place. Is there a specific file and code block where I could change it so that it responds to my own setting for screen width to switch over to the compact mobile version menu? Thanks.
  14. @Tsimi Also, I found a minor error: in /includes/classes/catmenu_xs.php line 64 is missing an opening <span> tag for the nested span set. It should be: $root_link_title = '<strong><span><span class="fa fa-list fa-lg"></span>&nbsp;' . $link_title . '</span></strong>';
  15. @Tsimi Hi, ..very nice contribution! I know the instructions file says that XS menu will only show in SM and XS viewport however, I was wondering if there is a way to have this altered to respond to media screen width instead?, ..or perhaps there is another responsive menu module that I could use with the Horizontal Categories Menu?
  16. @frankl that's just the Chrome browser, right? I use their development tools console, but I've never seen a place to test for different mobile devices.
  17. @frankl Hi Frank, What software are those screenshots from (to test a site in different type of mobile browsers)? I use Opera Mobile Emulator, but the mobile versions available for testing are outdated. Thanks.
  18. @burt Hi Burt, Thank you for that explanation and it certainly make it easier, however, I seem to be missing one piece here. This is likely a dumb question,.. but ordering the sort-order of these loaded elements is performed in the admin section, so how do you add a new module to that? I was thinking of possibly adding a couple of new elements and the only way to do that without having it managed as a module in the admin area, is to code it into one of the existing module templates. Because BS-Edge strives to be a modular design where developers can add their own modules as contributions, is there any documentation on requirements/guidelines for structuring new modules that would abide by the osC design and code integrity?
  19. @BrockleyJohn John, thank you ...that helps a little bit, though there is still the issue of how to insert an element in between other elements. @Druid6900 Unless someone has a better solution, here is a simple CSS hack that will work, though you have to test it on mobile as well. In the user.css file add the following line: .storeLogo { top:0; left:50%; margin-left:-100px } Then change the margin-left value to whatever the width of your logo is divided by half. I used the width of the osCommerce logo, which is 200px, and divided by half is 100px. Though I have to add that centering your logo is not a good idea for page layout because it leaves a lot of empty white space to the left & right of the logo. And everything above-the-fold is valuable page real estate.
  20. @BrockleyJohn John, so where do I alter this sequence?
  21. Hi, After getting past the installation issues, I am trying to redesign the layout of the header (first) and having some problems with it. I found a great source of information regarding how the Bootstrap CSS grid is designed: https://getbootstrap.com/docs/3.3/css/ However, I am having a tough time finding where all the sub-modules and elements are structured within the header. If I know this piece, then I can use CSS based on the grid to position them where I need them. The /includes/template_top.php file requires the /includes/header.php file, which calls $oscTemplate->getContent('header'); I get that all the 5 header templates for the header are located via /includes/modules/content/header/templates/... However, where are all these header sub-modules / elements / templates,.. structured into the actual header? There has to be a file where these elements are all compiled to form the header. Any help would be greatly appreciated.
  22. Demitry

    [Addon} Theme Switcher

    ok Jim, I do have the latest version and my version is arranged the same way, but the ../navbar_modules/templates/ all have to do with that black bar at the top of the page and not the rest of the header. I understand that this thread is support for the Theme Switcher addon, and I am trying to change the theme layout,.. hence, why I posted here. However, I will try the 2.3.4-BS-Edge forum. Thank you for your help. Demitry
  23. Demitry

    [Addon} Theme Switcher

    @kymation Jim, That file cm_navbar.php is not the header module. It is one of the sub-modules that the header is composed of. It is that top black bar that contains the osCommerce link on the left and the shopping cart link on the right (by default). So, /includes/template_top.php requires the /includes/header.php file, which calls $oscTemplate->getContent('header'); I get that all the header templates for the header are located via /includes/modules/content/header/templates/... However, where are all these header sub-modules / elements / templates,.. structured into the actual header? There has to be a file where these elements are all compiled to form the header.
  24. Demitry

    [Addon} Theme Switcher

    @kymation @frankl I found this online and it's of great value in regards to how Boostrap is structured via CSS, but I am still a bit at a loss as how to move these elements around in 2.3.4-BS-Edge. https://getbootstrap.com/docs/3.3/css/ For example the header has 5 templates of elements, but I cannot figure out where these are constructed to form the header. If I know this piece, then I can use CSS based on the grid to position them where I need them. It seems like there are so many files to construct each element and section of the page that it gets a bit confusing. Once I figure this out, it should be fine, and I will make appropriate CSS adjustments where needed for each of the 4 browser resizing points. I just need to know how this is all constructed. If there is any documentation on this, that would certainly help. Thanks.
×