# How do I format part of a field if it is the same as another field?

**URL:** <https://forums.ankiweb.net/t/how-do-i-format-part-of-a-field-if-it-is-the-same-as-another-field/35528>\
**Category:** Card Design\
**Created:** [October 8, 2023, 4:24pm UTC](https://forums.ankiweb.net/t/how-do-i-format-part-of-a-field-if-it-is-the-same-as-another-field/35528 "2023-10-08T16:24:57Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![suiyuan](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/suiyuan/32/20938_2.png) [@suiyuan](https://forums.ankiweb.net/u/suiyuan)\
**Post date:** [October 8, 2023, 4:24pm UTC](https://forums.ankiweb.net/t/how-do-i-format-part-of-a-field-if-it-is-the-same-as-another-field/35528/1 "2023-10-08T16:24:57Z")

</div>

For a deck I have, there is an Expression field with a word or words to study and a Sentence field with an example sentence including the Expression.

Is it possible to make Anki format the expression in the sentence field? Maybe underlining it or changing the color, etc. automatically?

So if I have:  
Expression - out of the blue  
Sentence - He just appeared out of the blue.

Can I format the “out of the blue” in the sentence based on it being the same as the Expression?

Thanks!

---

<div class="post-metadata">

**Author:** ![jcznk](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/jcznk/32/15215_2.png) [@jcznk](https://forums.ankiweb.net/u/jcznk)\
**Post date:** [October 8, 2023, 10:20pm UTC](https://forums.ankiweb.net/t/how-do-i-format-part-of-a-field-if-it-is-the-same-as-another-field/35528/2 "2023-10-08T22:20:54Z")

</div>

Maybe you could try something like this:

Front/Back template:

```auto
<div id="sentence_input" hidden>{{Sentence}}</div>
<div id="sentence_output"></div>

<script>
   var original_sentence = document.getElementById("sentence_input").innerHTML;

   var formatted_sentence = original_sentence.replace(/{{text:Expression}}/g, '<span class="styled-text">{{text:Expression}}</span>');

   document.getElementById("sentence_output").innerHTML = formatted_sentence; 
</script>

```

Styling section:

```auto
.styled-text {
   text-decoration: underline;
   color: red;
}

```

---

<div class="post-metadata">

**Author:** ![suiyuan](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/suiyuan/32/20938_2.png) [@suiyuan](https://forums.ankiweb.net/u/suiyuan)\
**Post date:** [October 9, 2023, 1:56pm UTC](https://forums.ankiweb.net/t/how-do-i-format-part-of-a-field-if-it-is-the-same-as-another-field/35528/3 "2023-10-09T13:56:02Z")

</div>

Great, jcznk! It’s working as expected. I really should up my game to scripts, I’m always needing help with those.

---

<div class="post-metadata">

**Author:** ![suiyuan](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/suiyuan/32/20938_2.png) [@suiyuan](https://forums.ankiweb.net/u/suiyuan)\
**Post date:** [October 9, 2023, 2:16pm UTC](https://forums.ankiweb.net/t/how-do-i-format-part-of-a-field-if-it-is-the-same-as-another-field/35528/4 "2023-10-09T14:16:44Z")

</div>

EDIT: Ok, I got it, just added another div class. Don’t worry about it! Thanks again!

One more thing. Do you know how I can style the rest of the sentence?

I am trying to apply the original style to .sentence\_output in the CSS, but it is not working (tried .sentence\_input as well, just in case).

---

<div class="post-metadata">

**Author:** ![suiyuan](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/suiyuan/32/20938_2.png) [@suiyuan](https://forums.ankiweb.net/u/suiyuan)\
**Post date:** [October 21, 2023, 9:32pm UTC](https://forums.ankiweb.net/t/how-do-i-format-part-of-a-field-if-it-is-the-same-as-another-field/35528/5 "2023-10-21T21:32:43Z")

</div>

I got another questions regarding this. :S The script is working perfectly, however, some of the “Expression” fields have different alternatives marked with a `/` (like `abrir/cerrar los ojos`).

I guess extracting this from the field to format the other field might be too complicated (especially since the alternative can be anywhere and consist of any number of words), but that is not a problem. I can live with these sentences not highlighting the expression, the functionality of the card remains.

However, the script is not returning the unformatted sentence when there is a slash in the Expression. How could I make it so that even in that case, the sentence appears? Otherwise the place where it should be remains blank and the card becomes pointless for the user.

---

<div class="post-metadata">

**Author:** ![jcznk](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/jcznk/32/15215_2.png) [@jcznk](https://forums.ankiweb.net/u/jcznk)\
**Post date:** [October 22, 2023, 12:40pm UTC](https://forums.ankiweb.net/t/how-do-i-format-part-of-a-field-if-it-is-the-same-as-another-field/35528/6 "2023-10-22T12:40:40Z")

</div>

The script is indeed a bit simplistic, and is not well equipped to deal with special characters (`.^$*+?|[]()\`).

This one seems to fare better:

```auto
<script>

var original_sentence = document.getElementById("sentence_input").innerHTML;

var regexText = String.raw`{{text:Expression}}`;

var formatted_sentence = original_sentence.split(regexText).join('<span class="styled-text">' + regexText + '</span>');

document.getElementById("sentence_output").innerHTML = formatted_sentence;

</script>

```

The only exception, hopefully quite rare, is that it does not work correctly when the fields end with an odd number of backslashes  
(e.g. `abrir/cerrar los ojos \`, or `abrir/cerrar los ojos \\\`.  
`abrir/cerrar los ojos \\` should instead work fine)

For more info: [javascript - Why can't String.raw end with a backslash? - Stack Overflow](https://stackoverflow.com/questions/61416857/why-cant-string-raw-end-with-a-backslash)

---

<div class="post-metadata">

**Author:** ![suiyuan](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/suiyuan/32/20938_2.png) [@suiyuan](https://forums.ankiweb.net/u/suiyuan)\
**Post date:** [October 22, 2023, 1:08pm UTC](https://forums.ankiweb.net/t/how-do-i-format-part-of-a-field-if-it-is-the-same-as-another-field/35528/7 "2023-10-22T13:08:18Z")

</div>

Great as always, @jcznk! Now all sentences are appearing!

None of them have a backslash, so that’s totally fine. Thank you very much again!

---

<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:** [November 21, 2023, 1:08pm UTC](https://forums.ankiweb.net/t/how-do-i-format-part-of-a-field-if-it-is-the-same-as-another-field/35528/8 "2023-11-21T13:08:20Z")

</div>

Closed on November 21, 2023, 1:08pm UTC

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