Hi Guys, Im trying to set up a blog app, where users can click on an Article Thumbnail and be taken to that specific article. I spoke to Chat GPT and this is the conversation below however the big problem I’m having is I can get this request code anywhere Current cell's Blog post's unique id
. I cant get “Current Cell” I can get current cells value but that is the only option I have to deal with the current cell… is there a work around or what Can I do to my Current Cell appear in either the parameters or the custom state field?
This is a previous answer it gave me with a new question at the bottom
Toggling Group Visibility Based on URL Parameters
Utilizing URL Parameters:
The idea is to use a unique identifier (e.g., the blog post’s unique ID) as a URL parameter. When a user clicks on a “Read More” button in your RG, you’ll navigate them to the same page (or refresh it) with this unique ID added to the URL as a parameter (e.g., ?blog_id=123).
Setting Up Conditional Visibility:
Select the detailed blog post group and navigate to the “Conditionals” tab in the property editor.
Add a new condition that checks if the URL parameter is present. Use the expression Get blog_id from page URL is not empty (assuming blog_id is the name of your URL parameter).
For this condition, set the property to make the group visible.
Dynamic Data Source Based on URL Parameter:
To display the correct blog post, you need to dynamically set the group’s data source based on the URL parameter.
On the workflow that runs when the page is loaded (or when the URL parameter changes), add an action to “Display data” in the group. For the data to display, use “Do a search for Blogs” where the condition matches the blog’s unique ID with the URL parameter (blog_id).
I will tell you what I have set up so far.
- Group Main blog content - type of content = blog post (all other elements and groups are inside this group)
- Group blog - content type = blog post
- Image blog - Dynamic Image = Parent group’s Blog post’s image
- group blog text - type of content = Blog post
- Text title- Dynamic = Parent group’s Blog post’s Title
- Text categories - Dynamic = Option set = all blog category:each Items Display (but I think this should be a repeating group. Am i correct? )
- Text blog content - Dynamic = Parent group’s Blog post’s Content
- Text Author - Dynamic = Parent group’s Blog post’s Creator’s Username
- Text Created Date - Dynamic = Parent group’s Blog post’s Creation date.
Using my set up can you guide me through in a detailed step by step manner of how to set up the parameters please…
This is the Answer I received.
Given your setup for displaying a detailed blog post in Bubble.io, we’ll walk through how to utilize URL parameters to control the visibility of the Group Main blog content
based on a specific blog post’s unique ID. This approach allows you to dynamically display content for a selected blog post by modifying the page’s URL to include a blog post’s ID as a parameter. Here’s a detailed step-by-step guide tailored to your setup:
Step 1: Preparing the “Read More” Button Workflow
- Identify the “Read More” Button: This button should be inside each cell of your Repeating Group that lists blog summaries or titles.
- Set Up Navigation Workflow:
- Workflow Event: When the “Read More” button is clicked.
- Action to Add: Go to page (select the page you’re working on, often the same page to refresh content).
- Data to Send: Here, you won’t directly send data but will modify the URL.
- URL Parameter: Add a key (e.g.,
blog_id
) and for its value, use the unique ID of the current blog post in the Repeating Group. It should look like this:Current cell's Blog post's unique id
.
Step 2: Using URL Parameters for Conditional Visibility
Given your existing group setup, we’ll use URL parameters to determine which blog post to display.
- Group Main Blog Content:
- Initially, this group should not be visible when the page loads. Make sure the “This element is visible on page load” option is unchecked, and “Collapse this element’s height when hidden” is checked.
- Add a Condition to the Group:
- Go to the “Conditionals” tab in the property editor for
Group Main blog content
. - Add a condition to check if a URL parameter is present. The expression should be:
Get blog_id from page URL is not empty
. - If this condition is true, set this group to be visible.
Step 3: Dynamically Displaying the Blog Post Based on URL Parameter
- Page Load Workflow:
- Event: When page is loaded.
- Action: Display data in
Group Main blog content
.- Data to Display: Do a search for
Blog posts
whereunique id = Get blog_id from page URL
. This expression ensures you’re fetching the blog post that matches the ID in the URL. - Since
Do a search for
can return multiple items, ensure you specify it to return the first item only, as IDs are unique, and there should only be one match.
- Data to Display: Do a search for
- Ensuring Data Integrity:
- The above action dynamically sets the data source for
Group Main blog content
based on the URL parameter, which in turn updates all nested elements (like your image, title, content, etc.) to display data from the correct blog post.
Step 4: Adjusting the Blog Categories Display
- For displaying categories, if you want to list all categories associated with a blog post, using a repeating group is indeed correct.
- Set Up a Repeating Group for Categories:
- Type of Content: Should match whatever type your categories are stored as (this might be an option set or a related data type).
- Data Source:
Parent group's Blog post's Category
. Adjust this path according to how your categories are stored (e.g., if categories are a list on the blog post, this should reflect that). - Inside the Repeating Group, use a text element to display
Current cell's category
.