Smart Buttons - Make Button Grey of URL Not Populated in Collection

Question:
I want to create a repeater containing links to external (internet) content that would include Apple Music, Spotify and YouTube content. Originally I was going to have an entry with links to the same content on each service (not all content would be on all services in each case). The issue is, the button to jump to link would be there even if a piece of content was not on one of the three platforms. Is there a way to somehow indicate to the user by showing button as grey?

Product:
Editor X

What are you trying to achieve:
Noted above.

What have you already tried:
Nothing as I do not know how - I currently do not know how to code.

Additional information:
None

Ok, so I found some sample code and modified for my page. Each item in the CMS collection has three potential links. One for Apple Music, one for Spotify and one for YouTube. I want to only show related button if the field is populated with a URL. The code runs w/o errors but the three buttons never show even though they all have a URL in the collection.

Well, I thought I had it working … it partially does. but it is not behaving per record. This is to show or hide three buttons per record being shown in the dataset and should be making the decision as each record is displayed. But it now shows or hides same buttons for all records … here’s the current code.

Check for a true value instead of the opposite. This means set your element to be hidden in load.

The opposite may return one of multiple results causing errors or inconsistencies.

if (currentItem.applelink)

Then if you want to run your code each time the record / dynamic page changes to the next item just trigger it with this API

#codequeen

Thank you QC!

With some revamped code from chat GPT modified based on your recommendation to test for true vs. false the below code is now working with two test records!

I seem to now be getting a related issue where I am using collapsable text for descriptions and the Read More button is not working.

1 Like

QC, I updated my last post – the Read More button on the related collapsable text item in the same repeater does not work - I assume this has something to do with the fact I am using code on the page.

Any thoughts on how to get the collabsable text element to behave normally? Thank you!

Are you using the native collapsible text element?

Or did you create a collapse effect with code?

I have never used the collapsible text element because I usually code “everything”. It could just be glitchy or possibly no compatible with a repeater. I am not sure.

You can add additional code to the same media repeater to expand / collapse any regular text element on a button click.

Thanks will look into these resources. I am using standard collapsible text element and have used before in repeaters with no problem. It is my assumption the other code is somehow impacting the behavior.

CQ - this is resolved. It turns out the expandable text element I had placed in the repeater was defective somehow. I coped one from another page and it is working fine - it was not the page code that was impacting at all… thank you!

1 Like

You are on a roll! Good job in diving into the Velo world and having the patience to troubleshoot as you tackle those small issues.

I really appreciate you helping me into the pool! :grinning: