Jump to content

Taisei

Member
  • Posts

    4
  • Joined

  • Last visited

Everything posted by Taisei

  1. Hi, sorry to ask again. Would you know a CSS or any altering of this code above to remove the categories and tag drop down while only showing the sort by and search elements? Thanks
  2. Unfortunately this didn't fix the filter and sort button. it still stays on the left side...
  3. Thank you for your help, it seemed to work with that. However, on the mobile version, the sort by filter is appearing on the side of the product list rather than at the top. Do you know the CSS code I can enter to fix this so that it can appear at the top?
  4. Site URL: https://www.davebella.com.au/shopall Hi people, Site URL: https://www.davebella.com.au/shopall I recently purchased Universal Filter from SQUAREWEBSITES and injected the code on my site but it doesn't seem to be working or appearing at all. I want the sort by and filtering function on the shop page to work but i'm struggling to see what the problem is. it could be the container targeting that was inaccurate but please, if anyone could help me inject this on to my site, that would be of great help. Thanks <script> window.customFilterSettings = { 'targets': [{ container: 'content', //css selector to target container where you want to place filter items: 'list-grid', //css selector for items you want to filter settings: { position: 'top',//set the position for filter to appear. May be: top, left, right align: 'center',// align filter options, may be: left, center, right, space-between showItemsCount: false, // show (true) or hide (false) Items count itemsCount: { enabled: false, // same as showItemsCount text: '', // set the items text before counter, it is Items: by default and you may set your own text positionOrder: 1 // items counter position, higher means last }, keepDropdownsOpen: true, customClasses: 'lite-dropdowns cf-sort-right', /* Add any custom classes to filter container if you want to have your own to use in CSS styling, available: cf-sort-right (move sorting element right), cf-sort-left (move sort left), lite-dropdowns(gives lighter dropdowns stylings)*/ view: 'dropdowns', // available: dropdowns, breadcrumbs, modern, buttons, buttons-round, buttons-pill, buttons-inline /*----Mobile Panel Section----*/ mobilePanel: {// control if you want to have separate offscreen panel with filters on small screens enabled: true,// if set to false, no filter buttons on mobiles will be showed triggerButtonName: 'Filter & Sort', // trigger button text keepDropdownsOpen: null, // if false it overrides desktop settings, if true - dropdowns opened closeOnSelect: false, // mobile panel closed just after user selected something closeOnSearch: true, // mobile panel closed if user searched something in search field closeOnOutsideClick: true // if true, mobile panel will be closed if user clicks outside it }, /*----Filters Section----*/ filter: {// here you define all filters you need and name them category: true,// disabling default Category dropdown tag: true,// disabling default Tag dropdown items: [{ name: 'Brand',// give the dropdown (fiter entity) name you want multiple: true,// if true, allow to select multiple options // multipleLogic: 'or',// combine each selected category with OR or AND logic getAttr: 'categories'// here you say Filter to look for options in items categories }, { name: 'Features',// give the dropdown (fiter entity) name you want multiple: true,//if true, allow to select multiple options // multipleLogic: 'or',// combine each selected category with OR or AND logic getAttr: 'tags'// here you say Filter to look for options in items tags }] }, sort: {// define the sorters enabled: true,// if false - no sorters visible/working items: [{ name: 'Price',// name your sorter order: 'asc|desc',// define orders hideName: false,// hide the Price name orderTexts: '€ - €€€|€€€ - €'// define orders naming /* If sorter named as Price, you do not need define sort selectors or function: it will work the same like you defined: sort: '[data-price] parseInt' */ }] }, search: { enabled: true,// if false, no Search input will be showed text: '', //set the placeholder to your search field, otherwise Search will be used } } }] }; </script> <script src="//assets.squarewebsites.org/custom-filter/custom-filter.min.js"></script>
×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.