Display Lock to Access Dataset when user not logged in

arun · 2020-12-01T20:08:24.537Z

Hi Everyone,

I am building the following functionality

I have 4 sections (repeating groups) laid one below the other
Each repeating group has either images or Video
I want to show only 4 images or Video based on user selected criteria from drop down to users who have NOT LOGGED IN
4: To the users who have logged in display all data - Horizontal scroll

Now on point 3 above, after 4th image or video I want to show a image or container which has Text (e.g To access more Signin) and a Button for user to signing

This is similar to what you would see on dribble. But on Dribbble the signing is at the bottom. I want to display it on each section to trigger a clear Call to action.

Please suggest how to best include this container with text and button besides my repeating group.

Also, are there alternatives to Bubble default scroll style? Its not customizable. Are you using any plugin?

Thanks

boston85719 · 2020-12-01T20:31:51.626Z

arun:

Its not customizable. Are you using any plugin?

There is a plugin…search the plugins using the term scrollbar and you should find it

Alternatively you can use HTML to style the scrollbar

arun:

Please suggest how to best include this container with text and button besides my repeating group.

I wouldn’t try to show it next to your repeating group if you are using a horizontal scroll, because you can’t scroll a repeating group and have a group that is next to it come into view based on the scroll…it would need to be in the repeating group.

To set the group that is a call to action in the repeating group, you’d want to set your RG to be datatype of numbers. Then set the datasource to a list of numbers…if you know it will be fixed at 5 (4 images and one call to action group) set a custom state to be a list of numbers on page load and make the list 1,2,3,4,5.

Then create the repeating group…put an image element and make it not visible on page load and create conditionals to show it based on the current cells index being less than or equal to four.

In that same repeating group make a call to action group. Set it to not visible on page load. Set conditionals to show it when current cells index is 5.

To make it so this same RG works for users who are logged in and will view all images, you could on page load set the number list to the count of the list of images…easier could be to add another RG that is used only for logged in users that shows images with a datasource of the image list.