CMS current layout

Design help General
#1

Hi all,

I’ve posted a question before about the Webflow University player. I’m now using CMS but there’s one thing I just can’t figure out:

How do I change the styling and image for the Current page/item? The Webflow University player has a different ‘play button image’ for the active/current page and a different font-weight and -color.

How can i achieve this?

I have googled and checked the forum but I still can’t figure it out.

Thanks for your help. Loving Webflow! :webflow_heart:

Best,
Ricardo

16
Screenshot 2019-07-29 at 15.59.16.jpg2401×878 291 KB

#2

Good morning @reradus, could you please provide your share link for this project. Not exactly sure what you are referencing?

TIA

#3

Sorry, here it is :slight_smile:

https://preview.webflow.com/preview/koios-final?utm_medium=preview_link&utm_source=designer&utm_content=koios-final&preview=3595423425060438ebdca2dafb24f256&pageId=5d31b43190eed38f50cbc859&itemId=5d31b4b34f388a8354d9fe7c&mode=preview

#4

Hi @reradus,

From what I can gather is that you want to change what the styling is for what is listed as “current” link on the video, correct? If so, then you need to make sure that the link you have choosen is of the same class throughout and you would need to make that link active, which would then show as “current” (in green) in the class field.

From there you can make your styling adjustments.

Hope that helps.

Happy Designing,
Brandon

1 Like
#5

Thanks for your super quick reply, @QA_Brandon :slight_smile:

I think I did that, or at least i tried. But then when I switch to a different item, styling stays the same?

I’d like for example the ‘play icon image’ to change when a user is on the Current page. And font-colour en size needs to change too.

How would I go about making the link ‘active’?

Thanks again :webflow_heart:

#6

Hi @reradus,

For this to work, you would need to create the lessons like categories. Meaning, that when you click on each lesson it jumps to the next one making them active at that point but switch the page to the next lesson. You would use a reference field with the lessons linked there and then add an additional collections lists where you currently have the introductions at.

That way your breadcrumbs would be linked too, to reflect each video.

1 Like
#7

Hi @QA_Brandon, I hadn’t considered using the reference field, let me see if I can figure out how i would go about that.

Will this also be the solution to the styling for the active item?

Thanks again, this is really helpful :slight_smile::webflow_heart:

#8

To be more specific, I mean changing the image…

#9

@reradus, yes this would/could affect the static image as well.

1 Like