# \[Answered\] Conditional Elements

**URL:** <https://forum.wixstudio.com/t/answered-conditional-elements/30420>\
**Category:** Ask the community\
**Tags:** wix-stores, code, question\
**Created:** [December 26, 2017, 8:13pm UTC](https://forum.wixstudio.com/t/answered-conditional-elements/30420 "2017-12-26T20:13:37Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![edgar-koster](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/edgar-koster/32/1352_2.png) [@edgar-koster](https://forum.wixstudio.com/u/edgar-koster)\
**Post date:** [December 26, 2017, 8:13pm UTC](https://forum.wixstudio.com/t/answered-conditional-elements/30420/1 "2017-12-26T20:13:37Z")

</div>

Hey guys. This is a bit of an advanced question. I’ll try to describe what I’m intending to do. Now I don’t know if it is possible with Wix. The idea is coming up from other stuff I program where I can do something like that.

I’m wanting to make a collection of parameters, maybe in a table, which will effect specific site elements. The first ‘test’ I’ll be trying to make is show a specific image I place in the header. When shown, it will link to a page. The thing is, I don’t want it shown always. The link is to a specific page I only need to show once or twice per month. I don’t want to keep adding/removing the image to the header. I prefer setting some value ‘true/false’.

Looking into the code, I think I could add a ‘wixData.query’ to a data collection ‘site\_settings’ and then store that in something I can reference anytime (like a vuex store, if it is not already possible). Then with the ‘$w.Element’ I could get it. Then I would perhaps be able to hide it too. But, hidden elements are not the same as not rendered.

So as you may read above, I have a rough idea of steps I could take, but has someone a different approach?

Thanks for the input.

---

<div class="post-metadata">

**Author:** ![roi-bendet](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/roi-bendet/32/1283_2.png) [@roi-bendet](https://forum.wixstudio.com/u/roi-bendet)\
**Post date:** [December 27, 2017, 10:13am UTC](https://forum.wixstudio.com/t/answered-conditional-elements/30420/2 "2017-12-27T10:13:28Z")

</div>

Hi [Edgar Koster](https://www.wix.com/code/home/members/edgar-koster) ,  
Welcome to Wix Code 🙂  
I like your suggestion, I would approach it like this:

1. Creating a Boolean field type in Database collection.
2. Adding a dataset to the page and connect it the the Database collection
3. Adding a Checkbox element to page and check in properties “Hidden on load”
4. Connect the Checkbox to the dataset and the boolean field.
5. In code:

```javascript
$w.onReady(function () {
	$w('#yourDataset').onReady(() => {
		 if ($w('#yourCheckBox').checked) {
		 	$w('#yourImage').show();
		 }
	});
});

```

Good luck!

---

<div class="post-metadata">

**Author:** ![edgar-koster](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/edgar-koster/32/1352_2.png) [@edgar-koster](https://forum.wixstudio.com/u/edgar-koster)\
**Post date:** [December 27, 2017, 11:48am UTC](https://forum.wixstudio.com/t/answered-conditional-elements/30420/3 "2017-12-27T11:48:35Z")

</div>

Hi Roi. Thanks for the tip. I will try this out tonight. It seems doable and straight forward. When that works, I’ll try making it something system wide so you don’t need to add the same dataset each time. I’ll post my results here.

---

<div class="post-metadata">

**Author:** ![edgar-koster](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/edgar-koster/32/1352_2.png) [@edgar-koster](https://forum.wixstudio.com/u/edgar-koster)\
**Post date:** [December 27, 2017, 8:14pm UTC](https://forum.wixstudio.com/t/answered-conditional-elements/30420/4 "2017-12-27T20:14:07Z")

</div>

Did some fiddling and have this running. I don’t like non used elements so I skipped the checkbox, sorry Roi. What I have done now is

import wixData from ‘wix-data’;  
$w.onReady(function () {  
// Get Site Settings and adjust site accordingly  
wixData.query(“site\_settings”)  
.eq(“setting\_code”, “venture\_the\_trails”)  
.find()  
.then((oSiteSettings) =\> {  
if (!oSiteSettings.items[0].setting\_sos) {  
$w(‘#image3’).hide();  
}  
});  
});

So what I did was place this code in the ‘site code’. I bet, I’m going to get issues with having ‘image3’ on a different page, but we’ll see about that. Anyway, I query a ‘site\_settings’ table for a row where my ‘setting\_code’ is going to be ‘venture\_the\_trails’ (still looking for best practice on data structure). Then if the column ‘setting\_sos’ is ‘false’ I hide the image.

So thanks for you help. I do have a new question now (two) but will post them else where as not to pollute this thread.
