# Is there a way to make cloze deletions invisible?

**URL:** https://forums.ankiweb.net/t/is-there-a-way-to-make-cloze-deletions-invisible/54928
**Category:** Card Design
**Created:** [January 27, 2025, 3:33am UTC](https://forums.ankiweb.net/t/is-there-a-way-to-make-cloze-deletions-invisible/54928 "2025-01-27T03:33:50Z")
**Posts on this page:** 14
**Page:** 1

<div class="post-metadata">

### Author: ![RRomeroJr](https://avatars.discourse-cdn.com/v4/letter/r/df788c/32.png) [@RRomeroJr](https://forums.ankiweb.net/u/RRomeroJr)
#### Post date: [January 27, 2025, 3:33am UTC](https://forums.ankiweb.net/t/is-there-a-way-to-make-cloze-deletions-invisible/54928/1 "2025-01-27T03:33:50Z")

</div>

Instead of:

> **Put into the sentence:** “the”  
> Paris is […] capital of France

You do something like:

> **Put into the sentence:** “the”  
> Paris is capital of France

---

<div class="post-metadata">

### Author: ![Anon\_0000](https://avatars.discourse-cdn.com/v4/letter/a/c67d28/32.png) [@Anon\_0000](https://forums.ankiweb.net/u/Anon_0000)
#### Post date: [January 27, 2025, 3:51am UTC](https://forums.ankiweb.net/t/is-there-a-way-to-make-cloze-deletions-invisible/54928/2 "2025-01-27T03:51:02Z")

</div>

# Option 1

You could add `visibility: hidden;` into the `.cloze` style. This will hide the word but preserve the spacing:

## Before

![anki](https://us1.discourse-cdn.com/flex002/uploads/anki2/original/3X/e/2/e28b7a8930971179afce1bdf39c86e2e1bc881a5.png)

## After

![anki](https://us1.discourse-cdn.com/flex002/uploads/anki2/original/3X/b/d/bd0238da9dd50a303aa4a728342aea09ba7d8b71.png)

# Option 2

You can also remove it completely without having a spacing (in the front template):

```html
<script>
	// get all clozes
	var element = document.getElementsByClassName("cloze");
	
	// hide them
	for (var i = 0; i < element.length; i++) {
		element[i].innerHTML = "";
	}
</script>

{{cloze:Text}}

```

## After

![anki](https://us1.discourse-cdn.com/flex002/uploads/anki2/original/3X/f/7/f7618e9e30754e93b8b9adefa1ed653f8903aeef.png)

## Backside

![anki](https://us1.discourse-cdn.com/flex002/uploads/anki2/original/3X/3/1/317746218bfb9db0b720104b7bb60d5a46f3bf8a.png)  
The “backside” and “before” are the same for both options.

Also: A bit more explaination on what you currently have and what you want is generally a good idea. It makes helping much much easier.

---

<div class="post-metadata">

### Author: ![RRomeroJr](https://avatars.discourse-cdn.com/v4/letter/r/df788c/32.png) [@RRomeroJr](https://forums.ankiweb.net/u/RRomeroJr)
#### Post date: [January 27, 2025, 4:06am UTC](https://forums.ankiweb.net/t/is-there-a-way-to-make-cloze-deletions-invisible/54928/3 "2025-01-27T04:06:02Z")

</div>

That second option worked beautifully.

Out of curiosity I wondered if I can do this for the inactive clozes as well. I tried:

```auto
<script>
	// get all clozes
	var element = document.getElementsByClassName("cloze");
	
	// hide them
	for (var i = 0; i < element.length; i++) {
		element[i].innerHTML = "";
	}

       element = document.getElementsByClassName("cloze-inactive");
	
	for (var i = 0; i < element.length; i++) {
		element[i].innerHTML = "";
</script>

```

But it doesn’t seem to work the same way.

For some context I’m trying to memorize different parts of this definition but i only want to reveal certain information when I test a particular cloze

> vestragon(consonant-final, perfect participle vestreta)
> 
> 1. to say somthing (accusative) to someone (dative)
> 2. to tell someone (dative) something (accusative)
> 3. to speak
> 4. (with impersonal subject and subjunctive) to seem,  
> Hae hunē kirine Zaldrīzdōrot īlō vestretas.
> 5. seems to someone (dative)  
> Zāliapossa buqō ynot vestras.

Also some times simply knowing that there is more information gives away the answer for me

```auto

```

---

<div class="post-metadata">

### Author: ![RRomeroJr](https://avatars.discourse-cdn.com/v4/letter/r/df788c/32.png) [@RRomeroJr](https://forums.ankiweb.net/u/RRomeroJr)
#### Post date: [January 27, 2025, 4:10am UTC](https://forums.ankiweb.net/t/is-there-a-way-to-make-cloze-deletions-invisible/54928/4 "2025-01-27T04:10:51Z")

</div>

Stach all that made a typo

ty, tyvm @Anon_0000

---

<div class="post-metadata">

### Author: ![Anon\_0000](https://avatars.discourse-cdn.com/v4/letter/a/c67d28/32.png) [@Anon\_0000](https://forums.ankiweb.net/u/Anon_0000)
#### Post date: [January 27, 2025, 4:13am UTC](https://forums.ankiweb.net/t/is-there-a-way-to-make-cloze-deletions-invisible/54928/5 "2025-01-27T04:13:12Z")

</div>

Glad it works for you!

> [@RRomeroJr](#):
>
> For some context I’m trying to memorize different parts of this definition but i only want to reveal certain information when I test a particular cloze

For that, maybe you want to look at the following snippet too:

> [@Help with Incremental Cloze Reveal](https://forums.ankiweb.net/t/help-with-incremental-cloze-reveal/54788/2):
>
> You have a function that gets called onclick named revealCloze(i);. This same function could also hide the cloze again. For that you would: add an if statement checking if the .cloze had been revealed, change the cloze’s text back to what it was before revealing and then declare that the cloze is not revealed anymore: function revealCloze(i) { if (!revealed[i]) { elements[i].innerHTML = clozes[i]; revealed[i] = true; } else if (revealed[i]) { elements[i].innerHTML = "[...]"; …

---

<div class="post-metadata">

### Author: ![RRomeroJr](https://avatars.discourse-cdn.com/v4/letter/r/df788c/32.png) [@RRomeroJr](https://forums.ankiweb.net/u/RRomeroJr)
#### Post date: [January 27, 2025, 5:08am UTC](https://forums.ankiweb.net/t/is-there-a-way-to-make-cloze-deletions-invisible/54928/6 "2025-01-27T05:08:01Z")

</div>

Actually there is a slight issue. The script only fires 1 time and it’s the 1st time I look at the frontside of the 1st card

Every time after that nothing happens

---

<div class="post-metadata">

### Author: ![Anon\_0000](https://avatars.discourse-cdn.com/v4/letter/a/c67d28/32.png) [@Anon\_0000](https://forums.ankiweb.net/u/Anon_0000)
#### Post date: [January 27, 2025, 5:16am UTC](https://forums.ankiweb.net/t/is-there-a-way-to-make-cloze-deletions-invisible/54928/7 "2025-01-27T05:16:37Z")

</div>

It seems to work fine for me with the script you provided [above](https://forums.ankiweb.net/t/is-there-a-way-to-make-cloze-deletions-invisible/54928/3) (though I added the missing `}` from the for loop).

Can you give me steps to reproduce (as detailed as possible) please?

---

<div class="post-metadata">

### Author: ![RRomeroJr](https://avatars.discourse-cdn.com/v4/letter/r/df788c/32.png) [@RRomeroJr](https://forums.ankiweb.net/u/RRomeroJr)
#### Post date: [January 27, 2025, 5:30am UTC](https://forums.ankiweb.net/t/is-there-a-way-to-make-cloze-deletions-invisible/54928/8 "2025-01-27T05:30:45Z")

</div>

Here’s what I got. Sorry it’s slightly different now.  
I’m trying out some ideas so I changed it around.  
Now I want to hide an “cloze-inactive” but only if it doesn’t contain the cloze.

Ex from the docs

> {{c1::Canberra was {{c2::founded}}}} in 1913  
> I don’t want to hide c1 here if c2 is the cloze

here is my code:

```auto
// Frontside
<script>
// Find inactive clozes
let elements = document.getElementsByClassName("cloze-inactive");

// Hide them if they don't have a child with the class "cloze"
for (let i = 0; i < elements.length; i++) {
    if (!elements[i].querySelector(".cloze")) {
        elements[i].innerHTML = "";
    }
}
</script>
{{cloze:Text}}

```

```auto
// Backside
{{cloze:Text}}

```

---

<div class="post-metadata">

### Author: ![Anon\_0000](https://avatars.discourse-cdn.com/v4/letter/a/c67d28/32.png) [@Anon\_0000](https://forums.ankiweb.net/u/Anon_0000)
#### Post date: [January 27, 2025, 5:33am UTC](https://forums.ankiweb.net/t/is-there-a-way-to-make-cloze-deletions-invisible/54928/9 "2025-01-27T05:33:08Z")

</div>

I see. I won’t be able to test it right now but maybe the following solves your issue already:  
Switch `let` to `var` (`let` doesn’t work the way you’d expect).

---

<div class="post-metadata">

### Author: ![RRomeroJr](https://avatars.discourse-cdn.com/v4/letter/r/df788c/32.png) [@RRomeroJr](https://forums.ankiweb.net/u/RRomeroJr)
#### Post date: [January 27, 2025, 5:37am UTC](https://forums.ankiweb.net/t/is-there-a-way-to-make-cloze-deletions-invisible/54928/10 "2025-01-27T05:37:09Z")

</div>

Yup that was it. Dang man thanks so much

Sorry I’m not a JS person. I just made chat gippty do it for me and copy pasted 💯%

---

<div class="post-metadata">

### Author: ![RRomeroJr](https://avatars.discourse-cdn.com/v4/letter/r/df788c/32.png) [@RRomeroJr](https://forums.ankiweb.net/u/RRomeroJr)
#### Post date: [January 27, 2025, 6:20pm UTC](https://forums.ankiweb.net/t/is-there-a-way-to-make-cloze-deletions-invisible/54928/11 "2025-01-27T18:20:29Z")

</div>

For anyone interested I came up with a convenient way to change inactive clozes based on the current cloze #  
Basically works like this

> {{c1::First’s stuff}} {{c2::Second’s stuff!c1!c3)) ((c3:: Third’s stuff}}

> On card #1:  
> […] [.] Third’s stuff

> On card #2:  
> First’s stuff […] Third’s stuff

> On card #3  
> First’s stuff [.] […]

As long as you append the hide tags to the end it seems to work great.

Here’s the script. I don’t javascript very well so please forgive me.

```auto
// On the Front
<script>
var cloze = document.getElementsByClassName("cloze");
var inactives = document.getElementsByClassName("cloze-inactive");
function MarkTags(ele)
{
    var eleInner = ele.innerHTML;
    var eleData = eleInner.split(/!c/);
    console.log(eleData.join(','))  
    var eleVals = [];
    while(eleData.length > 1)
    {
        eleVals.push(eleData[eleData.length - 1]);
				eleData.pop();
    }
    ele.setAttribute("hide-values", eleVals);
    ele.innerHTML = eleData;
}
for (let i = 0; i < inactives.length; i++)
{
    MarkTags(inactives[i]);
}

function TryReplace()
{
    var clozeOrdinal = cloze[0].getAttribute("data-ordinal");
    for (let i = 0; i < inactives.length; i++)
    {
        var hides = inactives[i].getAttribute("hide-values");
        if(!hides)
        {
            continue;
        }
        var hideVals = hides.split(',');
        if (hideVals.indexOf(clozeOrdinal) > -1) {
            inactives[i].innerHTML = "[.]";
        } 
    }
}
TryReplace();
</script>

```

```auto
// On the back
<script>
var cloze = document.getElementsByClassName("cloze");
var inactives = document.getElementsByClassName("cloze-inactive");
function MarkTags(ele)
{
    var eleInner = ele.innerHTML;
    var eleData = eleInner.split(/!c/);
    console.log(eleData.join(','))  
    var eleVals = [];
    while(eleData.length > 1)
    {
        eleVals.push(eleData[eleData.length - 1]);
				eleData.pop();
    }
    ele.setAttribute("hide-values", eleVals);
    ele.innerHTML = eleData;
}
for (let i = 0; i < inactives.length; i++)
{
    MarkTags(inactives[i]);
}
MarkTags(cloze[0]);
</script>

```

---

<div class="post-metadata">

### Author: ![RRomeroJr](https://avatars.discourse-cdn.com/v4/letter/r/df788c/32.png) [@RRomeroJr](https://forums.ankiweb.net/u/RRomeroJr)
#### Post date: [January 27, 2025, 6:46pm UTC](https://forums.ankiweb.net/t/is-there-a-way-to-make-cloze-deletions-invisible/54928/12 "2025-01-27T18:46:14Z")

</div>

One might wonder  
“Couldn’t you just use nested clozes?”

I could but I found out that you can only go 3 levels of nesting deep. And I actually had some cards that went deeper than that.

Additionally if you cloze more than 1 thing on the same number anki default styling will highlight them both.

While studding my eyes naturally look for the highlighted thing to answer the card and when there is more than 1 it’s annoying, even if I add a hint.

---

<div class="post-metadata">

### Author: ![Anon\_0000](https://avatars.discourse-cdn.com/v4/letter/a/c67d28/32.png) [@Anon\_0000](https://forums.ankiweb.net/u/Anon_0000)
#### Post date: [January 27, 2025, 6:53pm UTC](https://forums.ankiweb.net/t/is-there-a-way-to-make-cloze-deletions-invisible/54928/13 "2025-01-27T18:53:28Z")

</div>

> [@RRomeroJr](#):
>
> I could but I found out that you can only go 3 levels of nesting deep. And I actually had some cards that went deeper than that.

This limit will be removed in the next stable release (the release candidate is already in testing).

> [@RRomeroJr](#):
>
> Additionally if you cloze more than 1 thing on the same number anki default styling will highlight them both.
> 
> While studding my eyes naturally look for the highlighted thing to answer the card and when there is more than 1 it’s annoying, even if I add a hint.

You can also remove the styling completely or change it to something less distracting.

---

<div class="post-metadata">

### Author: ![system](https://us1.discourse-cdn.com/flex002/uploads/anki2/original/1X/8f1279ababc5879d54e4838989f606cfe55af8c7.jpeg) [@system](https://forums.ankiweb.net/u/system)
#### Post date: [February 26, 2025, 6:53pm UTC](https://forums.ankiweb.net/t/is-there-a-way-to-make-cloze-deletions-invisible/54928/14 "2025-02-26T18:53:58Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.
