Hey there!
I’d like to know if there’s a way I can connect a Grid Product Gallery by Wix Stores to my Dynamic Collection List Page.
I have got a solution to get the currentItem to the Collection List, as you guys can see in the code below:
`let collectionData = $w(“#collectionDataset”).getCurrentItem();
let gridGallery = $w(“#gridGallery”)
$w.onReady(function () {
console.log(collectionData);
});`
And it returns:
link-collections-all:
"/collections/"
name:
**"Shapewear"**
mainMedia:
"wix:image://v1/614034_103e8f4ab0ae4536a38b319d3eb437ed~mv2.png/missing-media.png#originWidth=500&originHeight=500"
_id:
"05ebaafb-bf46-29a9-6ce9-9098774e21b1"
link-collections-1-name:
"/linhas/shapewear"
slug:
"shapewear"
categoryPageUrl:
"/category/shapewear"
Which is amazing, cause it’s what I want to get, like, the collection name…
But, when I console.log the “GridGallery” variable, I get as result:
id:
"gridGallery"
role:
"gridGallery"
connectionConfig:
"undefined"
uniqueId:
"comp-lm6yydx1"
parent:
"$w('#section30')"
global:
false
type:
"13afb094-84f9-739f-44fd-78d036adb028"
scrollTo:
"scrollTo(){return new Promise((t=>e.scrollToComponent(n,t)))}"
toJSON:
"toJSON(){return(({role:e,compType:t,isGlobal:n,isRendered:r})=>({id:e,type:`$w.${t}`,global:n(),rendered:r()}))(e.metaData)}"
onMouseIn:
"t=>d(\"onMouseEnter\",e,t)"
onMouseOut:
"t=>d(\"onMouseLeave\",e,t)"
removeEventHandler:
"(t,n)=>{const{getSdkInstance:r}=e;return\"string\"!=typeof t?((0,f.eK)(m.z.error_type({propertyName:\"type\",functionName:\"removeEventHandler\",value:t,expectedType:\"string\"})),r()):\"function\"!=typeof n?((0,f.eK)(m.z.error_type({propertyName:\"handler\",functionName:\"removeEventHandler\",value:n,expectedType:\"function\"})),r()):((e,t,n)=>{const{metaData:r,getSdkInstance:a}=t,[i,o]=l(t),s=i.listeners.filter((t=>u(t.eventName,e)&&t.cb===n&&t.compId===r.compId));for(const e of s)e.unregister();return o({listeners:i.listeners.filter((e=>!s.includes(e)))}),a()})(t,e,n)}"
rendered:
true
effects:
{...}
delete:
"()=>{e.setProps({deleted:!0}),e.remove()}"
restore:
"()=>{e.setProps({deleted:!1}),e.restore()}"
deleted:
false
hide:
"async(a,i)=>{var s;if(c({hidden:!0}),d.collapsed||d.hidden)p({hidden:!0});else{if(u({effectName:a,effectOptions:i,propertyName:\"hide\"})){const e={animationDirection:y.HIDE.suffix,effectName:a,effectOptions:Object.assign(Object.assign({},(null==v?void 0:v[a])||g),i)};await Promise.all([o(e),t?r.runAnimation(e):void 0])}else n(l.getHiddenStyles()),t&&r.setStyles(l.getHiddenStyles());p({hidden:!0}),null===(s=null==e?void 0:e.onViewportLeave)||void 0===s||s.forEach((e=>e()))}}"
show:
"async(a,i)=>{var s;if(c({hidden:!1}),!d.collapsed&&d.hidden){if(u({effectName:a,effectOptions:i,propertyName:\"show\"})){const e={animationDirection:y.SHOW.suffix,effectName:a,effectOptions:Object.assign(Object.assign({},(null==v?void 0:v[a])||g),i)};await Promise.all([o(e),t?r.runAnimation(e):void 0])}else n(l.getShownStyles()),t&&r.setStyles(l.getShownStyles());p({hidden:!1}),null===(s=null==e?void 0:e.onViewportEnter)||void 0===s||s.forEach((e=>e()))}else p({hidden:!1})}"
collapse:
"async()=>{var a;c({collapsed:!0}),d.collapsed||(n(l.getCollapsedStyles()),t&&r.setStyles(l.getCollapsedStyles()),p({collapsed:!0}),d.hidden||null===(a=null==e?void 0:e.onViewportLeave)||void 0===a||a.forEach((e=>e())))}"
expand:
"async()=>{var a;if(c({collapsed:!1}),d.collapsed){const i=Object.assign(Object.assign({},l.getExpandedStyles()),{visibility:d.hidden?\"hidden\":null});n(i),t&&r.setStyles(i),p({collapsed:!1}),d.hidden||null===(a=null==e?void 0:e.onViewportEnter)||void 0===a||a.forEach((e=>e()))}}"
collapsed:
false
hidden:
false
isVisible:
true
isAnimatable:
true
onViewportEnter:
"n=>s(n,\"onViewportEnter\")?(null==e||e(\"onViewportEnter\",(()=>{const e=o({type:\"viewportEnter\"}),t=i();n(e,t)})),c(\"onViewportEnter\",t,n)):a()"
onViewportLeave:
"n=>s(n,\"onViewportLeave\")?(null==e||e(\"onViewportLeave\",(()=>{const e=o({type:\"viewportLeave\"}),t=i();n(e,t)})),c(\"onViewportLeave\",t,n)):a()"
on:
"on(e,t,n){s.on(e,t,n)}"
off:
"off(e,t){s.off(e,t)}"
once:
"once(e,t,n){s.once(e,t,n)}"
**setCollection**:
"async t=>{if(this.setVeloInputs({collectionId:t,productIds:void 0}),this.galleryStore)return this.initializeVeloDataAfterStoreCreated()}"
setProducts:
"async t=>{if(this.setVeloInputs({productIds:t,collectionId:void 0}),this.galleryStore)return this.initializeVeloDataAfterStoreCreated()}"
onInitialize:
"t=>{this.initializeCallback=t}"
onItemSelected:
"function(t,r){if(void 0===r&&(r={preventNavigation:!1}),e.setVeloInputs({onItemSelected:{callBack:t,options:r}}),e.galleryStore)return e.initializeVeloDataAfterStoreCreated()}"
It has an option that is “SetCollection”, but I don’t know how to access that…
I’d like to know if there’s a way I can link them…
I’d like to know if you guys can help me out with that!
I appreciate it! ^^