# How to show text only in static Pluto notebook?

**URL:** https://discourse.julialang.org/t/how-to-show-text-only-in-static-pluto-notebook/110020
**Category:** Pluto
**Tags:** pluto
**Created:** [February 10, 2024, 8:22am UTC](https://discourse.julialang.org/t/how-to-show-text-only-in-static-pluto-notebook/110020 "2024-02-10T08:22:04Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![pzabka](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/pzabka/32/46255_2.png) [@pzabka](https://discourse.julialang.org/u/pzabka)
#### Post date: [February 10, 2024, 8:22am UTC](https://discourse.julialang.org/t/how-to-show-text-only-in-static-pluto-notebook/110020/1 "2024-02-10T08:22:04Z")

</div>

I would like to have a text in a Pluto notebook that would show only if opened in the static version (something like: for interactive version visit website x). Any advice?

---

<div class="post-metadata">

### Author: ![pzabka](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/pzabka/32/46255_2.png) [@pzabka](https://discourse.julialang.org/u/pzabka)
#### Post date: [February 14, 2024, 7:55am UTC](https://discourse.julialang.org/t/how-to-show-text-only-in-static-pluto-notebook/110020/2 "2024-02-14T07:55:06Z")

</div>

I think I have found a solution:

```julia
HTML("""
<div>
This is the interactive version.
</div>
<script>
if (window.pluto_disable_ui){
currentScript.previousElementSibling.innerText = "This is the static version."
}
</script>
""")

```

---

<div class="post-metadata">

### Author: ![disberd](https://avatars.discourse-cdn.com/v4/letter/d/8edcca/32.png) [@disberd](https://discourse.julialang.org/u/disberd)
#### Post date: [February 14, 2024, 8:54am UTC](https://discourse.julialang.org/t/how-to-show-text-only-in-static-pluto-notebook/110020/3 "2024-02-14T08:54:41Z")

</div>

I think in this case it’s cleaner to rely on CSS rather than javascript for the purpose as it will also work in case someone has javascript blocking plugins (though other parts of Pluto might break in that case).

```julia
html"""
<div class='only-static'>This is the text that only appears in static mode!</div>
<style>
	div.only-static {
		display: none;
	}
	body.disable_ui div.only-static {
		display: block;
	}
</style>
"""

```

You can easily have a text changing from interactive to static like in your last example and without using JS like so:

```julia
html"""
<div class='only-static'>This is the text that only appears in static mode!</div>
<div class='only-interactive'>This is the text that only appears in interactive mode!</div>
<style>
	div.only-static {
		display: none;
	}
	body.disable_ui div.only-static {
		display: block;
	}
	body.disable_ui div.only-interactive {
		display: none;
	}
</style>
"""

```

---

<div class="post-metadata">

### Author: ![pzabka](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/pzabka/32/46255_2.png) [@pzabka](https://discourse.julialang.org/u/pzabka)
#### Post date: [February 14, 2024, 11:44am UTC](https://discourse.julialang.org/t/how-to-show-text-only-in-static-pluto-notebook/110020/4 "2024-02-14T11:44:16Z")

</div>

You are right, that is a better solution. Thank you.
