# Fullscreen slides

**URL:** <https://tainacan.discourse.group/t/fullscreen-slides/1151>\
**Category:** Dúvidas\
**Created:** [Novembro 11, 2022, 12:08pm UTC](https://tainacan.discourse.group/t/fullscreen-slides/1151 "2022-11-11T12:08:28Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![Vedran\_Serbu](https://yyz2.discourse-cdn.com/free1/user_avatar/tainacan.discourse.group/vedran_serbu/32/218_2.png) [@Vedran\_Serbu](https://tainacan.discourse.group/u/Vedran_Serbu)\
**Post date:** [Novembro 11, 2022, 12:08pm UTC](https://tainacan.discourse.group/t/fullscreen-slides/1151/1 "2022-11-11T12:08:28Z")

</div>

Where can I change the backgoundcolor of the fullscreen slides, and remove the tittle of the image?

---

<div class="post-metadata">

**Author:** ![mateus.m.luna](https://yyz2.discourse-cdn.com/free1/user_avatar/tainacan.discourse.group/mateus.m.luna/32/3_2.png) [@mateus.m.luna](https://tainacan.discourse.group/u/mateus.m.luna)\
**Post date:** [Novembro 11, 2022, 7:59pm UTC](https://tainacan.discourse.group/t/fullscreen-slides/1151/2 "2022-11-11T19:59:40Z")

</div>

Hi @Vedran_Serbu!

If you are talking about the Slideshow view mode, you can achieve this with some css. Lets say you want to make it some dark gray (#333333) instead of black and hide the items title:

```css
.theme-items-list.is-fullscreen {
   background-color: #333 !important;
}
.theme-items-list.is-fullscreen .tainacan-slides-list .slide-title-area {
   display: none;
}

```

This leads to this:

 ![image](https://global.discourse-cdn.com/free1/uploads/tainacan/original/2X/f/f595141c194a6524419d68d335caf5aaf886619a.jpeg)

If you want to use a bright color scheme, then we would have to tweak other places to ensure right contrast to some icons.

Is this what you where looking for?

---

<div class="post-metadata">

**Author:** ![Vedran\_Serbu](https://yyz2.discourse-cdn.com/free1/user_avatar/tainacan.discourse.group/vedran_serbu/32/218_2.png) [@Vedran\_Serbu](https://tainacan.discourse.group/u/Vedran_Serbu)\
**Post date:** [Novembro 12, 2022, 7:39pm UTC](https://tainacan.discourse.group/t/fullscreen-slides/1151/3 "2022-11-12T19:39:38Z")

</div>

Tnx, I’ll try it first thing monday morning and let you know how it works, but I think this should do it, thank you so much 👍

---

<div class="post-metadata">

**Author:** ![Vedran\_Serbu](https://yyz2.discourse-cdn.com/free1/user_avatar/tainacan.discourse.group/vedran_serbu/32/218_2.png) [@Vedran\_Serbu](https://tainacan.discourse.group/u/Vedran_Serbu)\
**Post date:** [Novembro 14, 2022, 7:11am UTC](https://tainacan.discourse.group/t/fullscreen-slides/1151/4 "2022-11-14T07:11:15Z")

</div>

> [@mateus.m.luna](#):
>
> ```auto
> .theme-items-list.is-fullscreen {
> background-color: #333 !important;
> }
> .theme-items-list.is-fullscreen .tainacan-slides-list .slide-title-area {
> display: none;
> }
> 
> ```

For some reason, it is not working for the background color.

I opened site for the moment (it is behind “hide my site” plugin for the time being).

You can check it on:

[https://zbirkaleko.dad.hr/24-zeljeznica/](https://zbirkaleko.dad.hr/24-zeljeznica/)

When I click on slides, the caption is gone (which is good) but the background color is still black.

I used #FFF for the white? I even tried #FFFFFF and rgba(255, 255, 255, 1) but it won’t work.

---

<div class="post-metadata">

**Author:** ![mateus.m.luna](https://yyz2.discourse-cdn.com/free1/user_avatar/tainacan.discourse.group/mateus.m.luna/32/3_2.png) [@mateus.m.luna](https://tainacan.discourse.group/u/mateus.m.luna)\
**Post date:** [Novembro 14, 2022, 12:01pm UTC](https://tainacan.discourse.group/t/fullscreen-slides/1151/5 "2022-11-14T12:01:15Z")

</div>

Uhmm ok, we’ll have to be more specific for the classes

> [@Vedran\_Serbu](#):
>
> When I click on slides, the caption is gone (which is good) but the background color is still black.

Here are you referring to the bottom section where the clickable slides are present? If so, targeting the `.tainacan-slides-list` should do it.

Try it now:

```css
.theme-items-list.is-fullscreen:not(.tainacan-modal) {
   background-color: #fff !important;
}
.theme-items-list.is-fullscreen:not(.tainacan-modal) .tainacan-slides-list {
   background-color: #fff !important;
}
.theme-items-list.is-fullscreen:not(.tainacan-modal) .tainacan-slides-list .slide-title-area {
   display: none;
}

```

I know this is not quite intuitive, we should have an option for this. TBH, There are thousands of tweaks that I can think of, not only to this view mode, but also to others such as masonry (number of columns) and table (fixed rows). The problem is that right now we don’t have a place decided to where to store this information. It could affect different levels, such as user preferences, collections settings, etc…

---

<div class="post-metadata">

**Author:** ![Vedran\_Serbu](https://yyz2.discourse-cdn.com/free1/user_avatar/tainacan.discourse.group/vedran_serbu/32/218_2.png) [@Vedran\_Serbu](https://tainacan.discourse.group/u/Vedran_Serbu)\
**Post date:** [Novembro 14, 2022, 12:04pm UTC](https://tainacan.discourse.group/t/fullscreen-slides/1151/6 "2022-11-14T12:04:26Z")

</div>

It’s working, thank you so much 👍

---

<div class="post-metadata">

**Author:** ![mateus.m.luna](https://yyz2.discourse-cdn.com/free1/user_avatar/tainacan.discourse.group/mateus.m.luna/32/3_2.png) [@mateus.m.luna](https://tainacan.discourse.group/u/mateus.m.luna)\
**Post date:** [Novembro 14, 2022, 12:06pm UTC](https://tainacan.discourse.group/t/fullscreen-slides/1151/7 "2022-11-14T12:06:05Z")

</div>

On a personal side note, I would advise you to not use two sidebars in the same page… the filters panel there with the links kinda squish things a lot… are you aware that you can disable the sidebar only for this page using Blocksy special settings in the Gutenberg editor?

---

<div class="post-metadata">

**Author:** ![Vedran\_Serbu](https://yyz2.discourse-cdn.com/free1/user_avatar/tainacan.discourse.group/vedran_serbu/32/218_2.png) [@Vedran\_Serbu](https://tainacan.discourse.group/u/Vedran_Serbu)\
**Post date:** [Novembro 14, 2022, 12:11pm UTC](https://tainacan.discourse.group/t/fullscreen-slides/1151/8 "2022-11-14T12:11:39Z")

</div>

I know I have customized sidebar with the structure of the collection. The other sidebar is - filters?

Also, is there any way I can remove name of the files from the masonry view?

---

<div class="post-metadata">

**Author:** ![mateus.m.luna](https://yyz2.discourse-cdn.com/free1/user_avatar/tainacan.discourse.group/mateus.m.luna/32/3_2.png) [@mateus.m.luna](https://tainacan.discourse.group/u/mateus.m.luna)\
**Post date:** [Novembro 14, 2022, 12:16pm UTC](https://tainacan.discourse.group/t/fullscreen-slides/1151/9 "2022-11-14T12:16:30Z")

</div>

Yes!

You can tweak this in the block settings:

 ![image](https://global.discourse-cdn.com/free1/uploads/tainacan/original/2X/d/d5da30864d02c7929ca618ed5d95f46993ad8d29.png)

---

<div class="post-metadata">

**Author:** ![mateus.m.luna](https://yyz2.discourse-cdn.com/free1/user_avatar/tainacan.discourse.group/mateus.m.luna/32/3_2.png) [@mateus.m.luna](https://tainacan.discourse.group/u/mateus.m.luna)\
**Post date:** [Novembro 14, 2022, 12:19pm UTC](https://tainacan.discourse.group/t/fullscreen-slides/1151/10 "2022-11-14T12:19:17Z")

</div>

Depending on your purpose for this page, you can also disable some other things such as the “View as…” button and more advanced pagination options 😉

---

<div class="post-metadata">

**Author:** ![Vedran\_Serbu](https://yyz2.discourse-cdn.com/free1/user_avatar/tainacan.discourse.group/vedran_serbu/32/218_2.png) [@Vedran\_Serbu](https://tainacan.discourse.group/u/Vedran_Serbu)\
**Post date:** [Novembro 14, 2022, 12:32pm UTC](https://tainacan.discourse.group/t/fullscreen-slides/1151/11 "2022-11-14T12:32:14Z")

</div>

I did it, thx, I removed the second sidebar 🙂

Just, I failed to see where I can remove filename from masonry view? I see where I can remove thumbnail, but not filename.

---

<div class="post-metadata">

**Author:** ![mateus.m.luna](https://yyz2.discourse-cdn.com/free1/user_avatar/tainacan.discourse.group/mateus.m.luna/32/3_2.png) [@mateus.m.luna](https://tainacan.discourse.group/u/mateus.m.luna)\
**Post date:** [Novembro 14, 2022, 12:36pm UTC](https://tainacan.discourse.group/t/fullscreen-slides/1151/12 "2022-11-14T12:36:51Z")

</div>

Not possible indeed, it is a required metadata for this view mode in particular. Again CSS can save you, just not sure if this would affect the Masonry height calculation:

This would hide the title only:

```css
.theme-items-list #items-list-area #items-list-results .tainacan-masonry-container .tainacan-masonry-item .metadata-title p {
    display: none !important;
}

```

This would hide the section where the title is but… would remove also the icon that opens the slideshow from it:

```css
.theme-items-list #items-list-area #items-list-results .tainacan-masonry-container .tainacan-masonry-item .metadata-title {
    display: none !important;
}

```

---

<div class="post-metadata">

**Author:** ![Vedran\_Serbu](https://yyz2.discourse-cdn.com/free1/user_avatar/tainacan.discourse.group/vedran_serbu/32/218_2.png) [@Vedran\_Serbu](https://tainacan.discourse.group/u/Vedran_Serbu)\
**Post date:** [Novembro 14, 2022, 12:44pm UTC](https://tainacan.discourse.group/t/fullscreen-slides/1151/13 "2022-11-14T12:44:32Z")

</div>

Perfect! 🙂
