I’m interested in developing a component for our front page called “Dagliga vägledning” (Daily Guidance) that automatically updates each day based on content from our CMS collections. Specifically, I want the component to display an image, today’s date, and a short text snippet relevant to that day.
For example, if today is April 13th, the component should display the corresponding image, date, and text. Importantly, I want it to ignore the year and focus on matching the date and month, so it continues to update correctly every day, even in future years like 2025 or 2026.
You can find examples of what I’m envisioning on the “Dagliga vägledning” (Daily Guidance) section of our site using the provided read-only link.
Any advice or suggestions on how to implement this would be greatly appreciated!
hi @ssgi_webb if your page will serve clients only from one timezone the simplest solution is to give each article a number field that will represent day of the year, than you use function that will get number of day in current year and compare it with number of article. You should also count in your logic with leap year.
This function can run every first minute of current day or on page load (all is about number of API cals)
in short, the logic will show only one article if numbers match.
if you are no coder you can try FS filer but I’m not familiar with any of their products but many people use it very often as they have great reviews.
Finsweet filter would require a hidden filter block and additional script to pre-set the filter.
SA5 filter can use CSS selectors directly in the attribute.
Here’s a quick build that does what you’re requesting from the CMS, filtered using SA5 filter.
Note all 366 days have to be loaded into the page, which isn’t ideal even for lightweight text. It also consumes 4 collection lists of your 20 max/page. If I was doing this on a client site I’d probably fetch the day’s data from an external source instead.
Thank you for the quick responses and the demo, Michael!
What is SA5 filter? is it a build in function in Webflow?
My case will contain a image, that would be best to import data from an external source. Can I import data from Google spreadsheet?
The demo you show here, are all those text imported from an external file?
Sygnal Attributes 5, it’s another Webflow-focused attributes solution, complementary to Finsweet’s Attributes. It solves different problems.
It’s in the CMS, have a look at the readonly link I gave.
Yes, if you build a middle tier to retrieve your record e.g. month 4 day 1. You might also be able to use google’s visualization query language to do it directly from the URL.
I don’t generally store images in GSheets, so you’d need to test your approach. Airtable could be better for mixed media.
Neither solution is designed for high-performance hosting, so if you move your data externally and build a bridge, make sure to consider and evaluate platforms based on traffic volume, performance, reliability…
If you’re not a developer, those options may be not be easy for you to research or integrate properly. My demo above was entirely within Webflow, plus the SA5 lib.
I added a few guidances and I don’t know how to showing 1 guidance each day on the day in the front page with using “Display Limits Show: 1 Start at: 1” Then it’s not dynamic anymore . If I do not limit it, it shows all guidances in the front page.
I couldn’t really understand how you made it to https://x-daily-guidance.webflow.io/ ?
Correct, in the designer you’ll see all 366 of them, just as you can see in my readonly.
The script hides them and shows the correct one on the published side.
I don’t see the SA5 filter library in your custom code.
In my cloneable, check the custom code for the home page and make certain you have that library in your site also. It needs to be on the pages where you’re running this filter setup.
Ok, I didn’t realized that. I added this code to head of the home page and daily guidance page, I removed all Display limits, however it still not work
Yeah! finally It’s work after added SA5 HTML script. I couldn’t really see where’re those in a read-only site. Then I realized the SA5 so many parts/components.
I also added a Max H to show one guidance space in Designer mode.
It’s solved!
Thanks a lot @memetican for your prompt advices at all time!
. If I do not limit it, it shows all guidances in the front page.
after added SA5 HTML script. I couldn’t really see where’re those in a read-only site. Then I realized the SA5 so many parts/components. 