So, I’ve been creating some custom write.as blog themes and the Custom CSS and Custom Javascript editors on the Customize page of write.as are just too dang small. I’m using a chrome extension to modify the CSS to make them bigger and easier to type in/scroll through/parse. I know it’s a tiny quality of life improvement, but can we make these a bit bigger?
Here’s the CSS I modified:
OLD:
.ace_editor {
height: 12em;
width: 100%;
NEW (aka my version):
.ace_editor {
height: 25em;
width: 125%;
There’s probably a better way to make these changes, but I just needed something temporary to make these bigger. I’d also not be opposed to having the little bar in the bottom right corner to drag and resize those editors.
Thanks for recommending this @quiethabits! I’d be curious to know what extension you are using to make the editors bigger.
Now you have me thinking about creating something for Write.as similar to what we have with HTML house - a way to edit CSS (and maybe JS) within a bigger/easier editor while also being able to see what the results look like within a Write.as blog template. What do you all think of somethin like that?
I use Stylebot to inspect and edit the CSS and then I can make it persistent every time I visit the site.
I think something like HTML house would be above and beyond what I’m looking for and would be pretty amazing. I imagine it’d be overkill for most people, but would be an awesome feature to have.
Yes, thank you, I second quiethabit’s request and add to it the ability to make the custom CSS and Javascript input boxes sizeable by being able to drag the lower right-hand corner of the box to the desired size.
What do you think of the above idea of a separate app with a bigger/easier editor where you can preview CSS (and maybe JS) of a Write.as blog template @bugbuster?
Personally, I wouldn’t use Stylebot, because in general I want to minimize the number of browser extensions used. The standard html <textarea> input is sizeable by dragging the lower right corner, so it should be easy to implement this.
I don’t think @cjeller1592 was referring to the Chrome extension, I think he’s asking if you’d rather have a bigger/expandable text area or if you’d rather have a separate tool that looks like the one he linked above called HTML House. Personally I think these would be two separate ideas: one for a bigger expandable text area and one for having a separate linked tool from that page that gives you a live preview.
For my purposes, the expandable text area would be 1st choice. The separate tool could also be useful, but if it’s an either/or I’d really like to have that expandable text area.
@bugbuster I fully agree, I’d much rather have the expandable area! (and I think it would be a much easier/quicker change than creating a full page tool with built-in preview)
I did a little research on what’s technically needed here and found that while it’ll be complicated to make the editor resizable by dragging the corner, we can change it to automatically resize (especially up to a maximum height).
What do you all think of the experience with the textareas on this page?
I do like that solution. For my purposes, this is just as good as dragging to resize. I can’t speak for anyone else, but this is completely acceptable as a solution.
That’s what he’s referring to @bugbuster! The inputs currently use Ace, an embeddable JS code editor, so we have to work within the options that Ace can give us.
Personally I think those editors would work well. Because for me, it was always the height that was the problem, not the width of the editor. This auto-expanding solution takes care of the height problem.
Makes me wonder if, to complement this change, the Post by Email box should then go above the Custom CSS/JS inputs, right below Text Rendering. But then again I don’t think this is too drastic of a change to affect anything else on this page (unless I am missing something).
Glad the auto-expanding text box would solve this particular issue for everyone. We’ll definitely get this changed – currently tracking development here: writefreely.org/tasks/708.
Just wanted to bump this topic because @matt pushed a recent change to Write.as that will automatically resize the CSS/JS editors depending on how much code you add to them. This makes the editors a lot easier to work with.