Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Calendar – Remove thumbnails


Rammy

Question

Hello!

I want to display events using a Calendar.

When there is only one event a day the calendar shows the thumbnail of that event.
When there are more than one event a day the calender shows text.

Is there a way to get rid of the thumbnails altogether and only show the text, even if there is only one event that day?
Removing the event thumbnail is not an option. Making the calendar smaller to hide the thumbnails is what I want to avoid.

The website uses the "Personal" plan, so no custom code except custom CSS.

I tried removing the images with CSS, but it will only show an empty cell without text. I thought about changing the mobile breakpoint of the calendar to trick it into displaying the mobile calendar without the thumbnails, but I'm not sure if that is achivable with CSS.

Any help would be appreciated!

calendar.png

Edited by Rammy
Link to post
  • Answers 6
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

Figured it out! To remove the images in the calendar, use this code: .background.background--iseventscollection { display:none; }   To make the events visible use this: .itemlist

Thank you! It helped me a lot!

Posted Images

6 answers to this question

Recommended Posts

  • 1

Figured it out!

To remove the images in the calendar, use this code:

.background.background--iseventscollection {
  display:none;
}

 

To make the events visible use this:

.itemlist {
  display: block !important;
}

 

Link to post
  • 0

Hi. Rammy, this works great on the desktop view.  But now the mobile calendar gets the text instead o fthe grey block. Is that true for you too?

 

thanks!

Edited by SueF
Link to post
  • 0
On 10/17/2020 at 10:03 PM, SueF said:

Hi. Rammy, this works great on the desktop view.  But now the mobile calendar gets the text instead o fthe grey block. Is that true for you too?

 

thanks!

If you share link to page where you use calendar. We can take a look

You can send your question to my email to get detail answer. / How to Setup Password & Share URL 

-- Pour your heart into it

Link to post
  • 0

HI!

See below.  

I used your code..  great on the laptop or desktop.

site is still under development , will this attachment do?

""To remove the images in the calendar, use this code:

.background.background--iseventscollection {
  display:none;
}
 

To make the events visible use this:

.itemlist {
  display: block !important;
}

""

SQCalendarOnMobileScreenshot 2020-10-19 135806.jpg

Link to post
  • 0

Tuan gave me some new code to keep mobile grey blocks, not elongated.  Working well!

Remove code you used & add new code
/* Calendar */
.background.background--iseventscollection {
    display: none
}
@media screen and (min-width:768px) {
   .itemlist {
    display: block !important
}
}

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...