Elements Beta 25 (build 23151)

Hello again,

This is a small update to address a number of issues from the previous build (beta 24), thanks for all the feedback :raised_hands:

What’s New in Beta 25?

  • Resolves an issue in the updater where an update wasn’t found for a number of hours
  • Allow shift-click to select text in text editor
  • Fix loading of remote SVG files
  • In the node tree, added an option to duplicate a node without it’s content
  • Fixed a problem on text/typrography where the default text was being published

Reverted

  • Double clicking anywhere in a text component will now enter edit mode — The fix caused a problem with button icons appearing in the wrong place. More investigation required to fix the initial problem.

Get the Update

Elements should prompt you while it’s running to let you know there’s an update. If it doesn’t, you can select the “Check for Updates…” menu option from the “Elements” app menu.

Please note: Sometimes it takes a while for the update to propagate. If you don’t see the update in-app, you can download the latest build of Elements from the confirmation email you received, as that link will ALWAYS give you the latest version.

Give Feedback

If you are using the beta, please post all feedback in the Elements Beta Feedback Forum. You can use the Elements > Send Feedback… menu item to automatically pre-fill the build number into a new topic.

Can I join the Beta?

We’re not taking on any more beta testers at this time; however, you should sign up here to be notified as more places become available.

This has indeed been fixed, but there is a still a problem with these remote SVG files.

When you drag one into an image well,or and SVG component, it does not work, instead of displaying the image it displays the actual code in the file. Well some of the code.

I’m sorry to say I have some mixed news… we’ve looked into this and realised that remote resources can’t work with the SVG Component. I’ll do my best to try and explain why.

SVGs are not like other image formats; they are XML/markup code, which needs to be embedded into the page so it can be styled with CSS.

Here’s an example of how SVGs are displayed in the source code of websites:

<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 256 256">
<path d="M128,82a46,46,0,1,0,46,46A46.06,46.06,0,0,0,128,82Zm0,80a34,34,0,1,1,34-34A34,34,0,0,1,128,162ZM176,26H80A54.06,54.06,0,0,0,26,80v96a54.06,54.06,0,0,0,54,54h96a54.06,54.06,0,0,0,54-54V80A54.06,54.06,0,0,0,176,26Zm42,150a42,42,0,0,1-42,42H80a42,42,0,0,1-42-42V80A42,42,0,0,1,80,38h96a42,42,0,0,1,42,42ZM190,76a10,10,0,1,1-10-10A10,10,0,0,1,190,76Z"></path>
</svg>

If you look at the code above, you’ll notice there’s no path to the SVG file in the code. When you display a JPG or PNG file, there is a link to the file:

<img class="max-w-[100%]" src="resources/monsters-inc/monster.jpg" alt="A monster photo">

While you can link directly to an SVG (like other image formats), this approach doesn’t give you control over styling with CSS or Tailwind, since the SVG is treated as an external image resource. For this reason, it’s not something we can support with the SVG Component.

However, you can use the Image Component and drop a remote SVG into it – you just won’t be able to set the borders/colours for it.

I hope that all makes sense :sweat_smile: Let me know if you have any questions.

Makes sense, and might explain why all of the SVG stacks in Classic rely on you pasting the actual code into the stack.

I guess this means all of my SVG files will be LOCAL and everything else will be REMOTE. At least the SVG files are small so they won’t bloat the project file. I do need to be able to modify the fill and stroke of these files.

One other question I have been meaning to ask.

Will there be a way to import MULTIPLE remote resources, instead of having to add them one at a time. Maybe some way of pointing to a remote folder and then loading the resources from there.

There’s often an issue with this as most servers these days have directory listing off by default. If you load each remote image into a browser, you could drag and drop them, might be slightly quicker…

I use the Repository stack and Classic to manage my warehouse and it has a means of getting the URL for the image so it is a copy and paste process.

Ideally what I would like to see is the ability to paste the URL directly into the inspector for the image. That way remote images do not even need to be in the resources.

I do like the idea of being able to simply paste the url into the inspector for a remote resource, but I wouldn’t mind remote resources also being visible in the resources tab (and denoted/categorised as remote in some way), as it would be easier to manage them there, instead of always having to go page by page.

I agree. It could work the same way as images work currently in Elements. If you drag and image from the Finder into the editor it will automatically add it to the resources.

Likewise it could do the same thing with the remote resource. You paste in the URL in the inspector and Elements adds a reference to it in the resources. Where you can then manage them.

To be even more Mac-like it would be nice to be able to drag resource URLs from a browser/url-bar into Elements and have them available as resources.

1 Like

That would indeed be very handy.