Implementing a '2 More' Message for Messenger Photo Uploads: Seeking Advice

Hello everyone,

I want to implement a feature in a messenger where if a user adds more than 4 photos, they see a message that says “2 more” (or any appropriate number) along with the preview of the first 4 photos. I am attaching an example below. Does anyone know how to achieve this?

In the example you have provided, they are using a repeating group. It has 2 fixed columns and 2 fixed rows. With those settings, you should only see 4 items, but if you would like to play it safe, add “items until 4” when writing your search function in the repeating group.

  1. You would now have to add a group to the repeating group with background type Image. NOTE: Do not use an image element to display your image, it is important to use a group with background type image.
    For the data source of the background image, set it to the images that were sent in the message.

  2. Inside that group, add a text element, that is not visible on page load, collapse it when hidden, 100% height and width. In that text’s conditions, add a when: current cell’s index is 4, → this element is visible.

  3. To display the “2 more” on that text, copy the data source from the repeating group and paste it in the text element. Get its count and minus 3. So it calculates the total images in that message except for the 3 that are already visible. (Some images display -4 instead of -3, but it’s -3. A small mistake :slight_smile: )

  4. To get that dark background effect on the “2 more”, just add a flat color background type to the text element. Make the color completely black with an 80% opacity.

In my example, I am using playlists.
The repeating group:

The group inside the repeating group with the background image:

The Text data source and conditional:

It should look like this.

Thank you so much!)

1 Like


Hi there! I have a follow-up question about the file uploader. Perhaps you’ve come across this issue before: I’ve set restrictions on the file formats that can be uploaded (in my case, only jpeg, jpg, png, heiv, and heic), but for some reason, it’s not allowing me to upload iPhone formats. If I don’t set any restrictions, these formats can be uploaded without a problem. Do you know how to fix it? thank you so much for your help

Hmmm, not sure.
How is your workflow setup to accept only certain file types?

Here it is. Now everything working fine when I try to upload from the iPhone but from Mac I am able to upload but images is empty. After I add those formats it become possible, but I’m not sure I need it all (heic,heif,hej2k,hsj2,ief,jls,jp2,jpeg,jpg,jph,jphc,jpheic,heif,hej2k,hsj2,ief,jls,jp2,jpeg,jpg,jph,jphc,jp)

I have not seen that window before. Are you using a specific plugin that only allows certain file extensions?

I use this one File & MultiFile Uploader · BEP Plugin | Bubble
For me it is much better/faster then multifile uploader.

Oh okay, I see. I am unfamiliar with the plugin so unfortunately, I can’t help you here. Maybe you could create a new forum post asking for help. Someone else may know the answer to your question!

If you have any other questions related to Bubble’s built-in functions, let me know.

Cheers and good luck :slight_smile:

1 Like

This topic was automatically closed after 70 days. New replies are no longer allowed.