Streaming live at 10am (PST)

Create toggle button for price list


#1

Hi.

I need to add a "monthly/annualy" button to a price list i'm creating.
Can someone tell me how do I build this button? should I use an HTML embedded code or is there some Webflow built-in solution?

Thank you,
Naama.


#2

Hello @Naama!
If you build the price list within Webflow, I'd use the tabs widget for this occasion - two tab where one shows annual and the other monthly. That's the best solution IMO.


#3

Hello @StevenP,

Your solution is great! I have now 2 problems:
1. when toggling, the whole table is being replaced, and i wanted only specific field to change. Is that doable?
2. For some reason, in the "annual" state, I see both tables - monthly and annual. Do you have any idea why is that happening?

This is the website: http://folloze.webflow.io

Thank you very much,
Naama.


#4

Hi @Naama,
I had the same issue once, and reason of my problem was that I messed up with positions values for tabs. Or there could be issues with interactions.

If you could share read-only link to your project, it would help us to find the problem faster. Guidance how to do this you can find here:
http://forum.webflow.com/t/how-to-enable-a-webflow-share-link/2573

Regards,
Anna


#5

Allright! Well, if you want to keep the tables intact, I'd go for interactions set on the annual/monthly buttons.
It's a bit late here and I need to get up early for work tomorrow, but I'll take a look tomorrow and I'll write you a tutorial what you need to do!


#6

Thank you both @sabanna and @StevenP !!!
This is the link to the website: https://preview.webflow.com/preview/folloze?preview=31edd4359289631f2e1377ff50294f22

Naama.


#7

It is hard to explain with words, so I made this screen cast:
https://drive.google.com/file/d/0B-7cg8BSq1Z_ZmcwSXhWR0VJY2M/view?usp=drivesdk

Cheers,
Anna


#8

Your the best @sabanna!!! It works like a charm...
I really appreciate it.

Naama.


#9

You are welcome :smile: Glad I was able to help


#10

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.