I cut this together as an idea just for fun. I know there has been talk and some issues opened around code editing UI for Webstudio. The idea with this would be:

• maintaining access to canvas while editing code,
• improved code editing experience,
• access to settings and styling without changing tabs,
• potentially using one of the editing blocks for vars, api stuff, or CSS vars -- again, without popping over the canvas.,
• I wonder about one day having full access to CSS editing in a code editor (like Advanced Mode but a more traditional IDE experience)?,

Drawback is of course screen space. But even at 1440 height, it's totally reasonable. Not sure about 1080. My thought is that you could resize the panes like in dev tools.

I am trying to get a comma between each item in the list. This isn't working. Am i on the right track?
contentfulArtist.data.data.artistsCollection.items[0].artistMediumsCollection.items.map(item => item.artMediumName).join(", ")
This is the artistMediumsCollection array:

I just want to say that CSS paste is amazing. I don't use it often, but when I do I am just impressed with how well it works. Maybe there should be a 'Praise for WS' thread. 🙂 ❤️

Every time a switch pages in the designer I have to refresh to page get get CMS items (from Contentful) to show up. The api gets data as expected, but the page does not display the content until refreshing.
demo video https://vimeo.com/1080328370/44c68cc33d?ts=0&share=copy

Can anyone explain why the content in this grid is pushing outside of the grid? Even if i truncate the content, it continues to push outside... (not truncated right now). I am using the same css tokens on other pages and it's working fine.
https://p-5ff40d73-969b-4c6f-871e-9b6eabd0c41d.apps.webstudio.is/?pageId=Y9oDvKLOAd2emLEbjcRHS&authToken=368aa002-972d-44dc-aa07-94ce0cd7625e&mode=preview

I don't really need help. Just something that's unclear to me.
Sometimes we need to put a var inside ${...} and sometimes we don't?
I am sure this makes total sense to anyone who knows why. But I think it's an example of the type of thing that can be confusing for 'no-coders'.

Well I had to create a bunch of slugs today based on article titles. So I made this. Feel free to use if ever needed. https://poe.com/SLUGify

I am using the classical humanist font collection. Some of the font weights are not available. Is that just a limitation of using this font set, or can they be added?

Handy tool: I've used Iconify in Figma for a long time. But just discovered that you can modify and copy SVG code right from it instead of doing a Figma SVG export of the icon. Cleaner code and faster.

I am getting error "cannot insert box" when I try to add the FAQ component from the Craft library.
Other components seem to work fine.
Tried in multiple projects.

I would rather a client not have access to the clone option. I have just given them editor access.
Share setup: Client view:

When I paste text formatted in a Writer document, spaces before and after formatted text such as Italics, Bold, Underline are removed. Removing all formatting is usually the best option anyway. But sometimes its nice if you can keep some of it. This is pasting into Content Block

I just want to say that the Craft Library is amazing! Really speeds up the build process. I hope I have built my last Client First / Relume project. (Was never a fan of CF to begin with.) Great work WS team!

I am using Formspark and it is working fine for submissions. However, when I enable Botpoison (Formspark's native spam protection) the form does not work. It sends as it should. But does not show up in Formspark as normal (or as spam) and does not filtered by Botpoison. It's like nothing happens.

Share: https://p-0a1701d1-8099-4e99-970d-28a5c4e1b2d9.apps.webstudio.is/?authToken=daecc5cc-3440-4217-92cc-85f5fc4cb2c4&mode=preview

I have a page with various assets / design elements that I want to keep for future use on the website. Other than checking "Exclude from Search Results" and making sure nothing links to the page, are there any other suggestions to keep the page from being discovered by search engines?

I have to copy a bunch of content from a web-page into content blocks. Other than a few things like Bold, there is no formatting. The content has Headings, Paragraphs and Lists (UO). I am left to basically copy every paragraph, heading, and list item individually one at a time. Is there another way? I also tried formatting with Markdown in text editor first. Any other ideas?

I find it difficult to work in the small (narrow) box under the advanced section when editing CSS. Is there a way to connect with an external editor, or do you have plans to be able to expand that box for easier editing (like you have for editing api calls, var, etc)? Even better would be a way to access all css vars to customize values visually.

It would be nice if, when you hover over a style selector it would highlight which token (or local) that style comes from. I know you can hover and wait for the popup, but it's slow and requires more time to read the cascade path. An instant highlight of the token in some would be fast.

Not a big deal, but wondered about collapsing hidden collection items to keep the nav tree a bit shorter. So this:

I see that I am actually following on X. I so rarely use it that I didn't think I had. So that is likely the source. 🙄

I am trying to pick a CMS for a blog site. It needs to be low cost but support images withing blog posts (rich text with images). It looks like wordpress is the only one that checks these boxes. Ghost does not provide api access at their low-cost teir. Baserow and Airtable don't have images in rich text. Am I missing a good low-cost rich text option?

I would love some honest feedback on whether Webstudio is production ready. Are any of you running an agency with it? I am on the pro plan and building my first site. I am proficient with Webflow. I have been watching Webstudio for the past year or so and I am impressed with what has been accomplished. but now with spending a few hours, I am surprised at some buggy UI things, some of the help requests I see in this thread, and just worried in general about switch from Webflow. I spent 45 min trying to figure out how to style HTML elements, like headings, withing the builder. Finally figured out you need to use custom code to do that. I don't see an option to clean up unused CSS.

Pulling from Ghost.
Posts have tags. They are Book, Blog, News.
I have a dynamic tag page that lists whatever tag is passed to it.
Clicking on one of the post items takes to to the single post page.

My challenge is that different post types need different page layouts and styling. Blog posts look different than Book posts.
I assume the best approach is to use conditional visibility on the 'post' page. Depending on what the tag is, different components will be displayed with the different stylings.

Assuming this is the right approach, my main challenge is the expression editor. I've tried following a previous discussion, but not quite understanding it. Given my setup above, how would I compose an expression for 'show' to check for what the tag is. If tag == blog, then show.... type thing.

What's the best way to modify/remove some of the default CSS built into WS like <p> and <h#> elements? I would like to be able to set a global paragraph style without having to add a class to each paragraph.