I’m really interested converting our website in webflow and taking advantage of Collection List and Pages, but I’m thinking they may not be versatile enough.
So we have 80 or so products and most of them have pretty much the same type of content: Image, bullet points, description, directions, faq, but some have extra information. For example sometimes in the directions section, there is a table and in that case it goes from one column to two columns. On other pages, in the directions section there is tabbed content with directions in one tab and a calculator in the other tab. And an in even other situations, a product page is completely different from all the rest.
Is it even possible to display an extra table in those cases when the directions feature a table. I’m thinking I would have to have a rich text collection field with the code for the table that only displays on those pages. That means I’m including an extra text field but just for like 5 products. I think I may also need to make a secondary template that has two columns vs one for pages with no tables…
I can’t figure out how I could have tabbed content other than making a third template then also having another rich text field for the calculator code.
The third problem of dealing with product pages that are unique…I think I would just have to have those as static pages. But then it won’t/can’t be part of a list that is dynamic. Is there anyway to connect a static page to a collection? So if I want to have a page that has links to all collection pages of a certain category, say all products in Hardware, but this one hardware item is not in the collection list because it is a unique static page.
So I guess my main questions is, if I am going to have jump though all these hoops to make it work, is it worth it? Should I just create static pages for everything? Or are there other solutions tha could make this work?
This can be a little bit complicated and tricky but doable. To manage the varied product pages in Webflow, you can create a comprehensive CMS structure that includes all possible content fields, such as images, bullet points, descriptions, tables, and tabbed content, allowing you to handle different product layouts dynamically. By using Webflow’s conditional visibility, you can ensure that only relevant content is displayed on each product page, without cluttering the design with unnecessary elements. For example, if a product requires a table in the directions section, you can set up a field for this and display it only when the content is available, adjusting the layout from one column to two as needed. Similarly, for products with tabbed content, you can use conditional visibility to display a tabbed interface only when the appropriate content fields are filled, incorporating different tabs for directions and a calculator, for instance.
In cases where certain products require a completely unique layout that doesn’t fit within the CMS, you can create static pages for these products while still linking them to your CMS collection through custom fields, allowing them to be included in dynamic listings, such as a category page. For more advanced content, like tables or calculators, though Webflow doesn’t support embedding custom HTML or JavaScript directly within Rich Text fields. However, you can use the Embed component to insert custom code on the page or within a Collection item, ensuring that the necessary elements are displayed where needed. Alternatively, custom attributes and JavaScript can be applied outside of the Rich Text field to enhance interactivity.
That decision is always a judgement call. At 20 products, the static approach is probably reasonable, with heavy components use. Over 40 products where the pages are mostly consistent, I would personally always choose the CMS and accept the flexibility tradeoff costs.
The main reason is that to make the content navigable, you’ll need directories, related products lists, featured products lists, and all of that is 100x more difficult to build and maintain without a CMS.
That said with the CMS, those article-specific exception pieces can be challenging, but can be overcome with a combination of tooling and custom code work.
For elements that you use frequently in your pages, Finsweet PRT is good since you can “share” the component. You can also pull components from other pages, so you could e.g. have a components page where you create something like a table ( using custom elements ), and then reference that into your article content at a specific position from your product pages.
I’m a dev so one of my preferred approaches is to use Embed elements in the rich text, where I place the content I need for my embedded item. It could be raw HTML, Markdown or JSON, and then I use that to construct my embedded piece with code.
If you want to get really advanced, my favorite approach is to reverse-proxy a client’s site and then use external services for parts of the content management. For example an embedded table in your CMS content might come from a Google Sheet. It’s much easier to manage updates and the article’s content is all in one set of “files.”