Are the Custom Components the only way to use HTML on my Elements site? When I used RW Classic, I had a really nice carousel from 1LD and I put the embed code from essays I wrote on Substack in there to drive subscriptions from the site to Substack. If I can’t do that in Elements that’s a big downgrade. I’m not looking to build/design Custom Components to sell, I just want to migrate over with the same capabilities I had before. I tried creating an HTML CC and once I put the embed code in Elements wouldn’t let me make a second one with different embed code.
You can make as many custom components in a project as you like, as long as you’re using Plus or Pro 
Here’s how to do it:
If you want to get fancy you can create just one component, and use the Elements API (to make it more like the built-in components). If you share the code you want to use, I can help further!
I think I have just the base because I was thinking I’m not a developer. Can I do what you suggest in the video with that? Here’s some examples of embed code I’d be looking to use in Marquee Pro - I did something similar in RWC with a 1LD stack
ESSAY 1
<div class="substack-post-embed"><p lang="en">Staging a High Fantasy Masterpiece Time Forgot by Kevin Ray</p><p>How an overlooked novel from 1926, Nietzschean philosophy, and a grant award launched my most ambitious adventure yet</p><a data-post-link href=" https://kevinrayworks.substack.com/p/staging-a-high-fantasy-masterpiece ">Read on Substack</a></div><script async src="https://substack.com/embedjs/embed.js" charset="utf-8"></script>
ESSAY 2
<div class="substack-post-embed"><p lang="en">NOISE/QUIET: A Cycle of Short Plays by Kevin Ray</p><p>From rejection to resurrection: how two plays became a cycle of sound and silence</p><a data-post-link href=" https://kevinrayworks.substack.com/p/noisequiet-a-cycle-of-short-plays ">Read on Substack</a></div><script async src="https://substack.com/embedjs/embed.js" charset="utf-8"></script>
ESSAY 3
<div class="substack-post-embed"><p lang="en">Learning to Ask "What's Next?" Like a Child by Kevin Ray</p><p>Refections on staging Yevgeny Zamyatin's WE and his 1923 essay "On Literature, Revolution, Entropy, and Other Matters”</p><a data-post-link href=" https://kevinrayworks.substack.com/p/learning-to-ask-whats-next-like-a ">Read on Substack</a></div><script async src="https://substack.com/embedjs/embed.js" charset="utf-8"></script>
ESSAY 4
<div class="substack-post-embed"><p lang="en">Discovering Gratitude Through Grant Writing by Kevin Ray</p><p>On perseverance, perspective, and the unexpected gift that came right before Thanksgiving.</p><a data-post-link href=" https://kevinrayworks.substack.com/p/discovering-gratitude-through-grant ">Read on Substack</a></div><script async src="https://substack.com/embedjs/embed.js" charset="utf-8"></script>
Kevin I have just got Marquee plus and just started playing today so cobbled this together for you to see if it’s what you want, I have just copied essay 1 but you’ll get the drift. Just copy your snippet into the “HTML” part of the script and away you go.
Very basic and no styling but see if it helps?
@mintyfreshsmile The Base version of Elements only supports 3 custom components, and 2 globals.
I’d highly recommend upgrading to the Plus version, that way you can create an unlimited number of custom components (and globals), like I did in the video above. You can easily upgrading your plan in the Element Preferences
If you don’t want to upgrade you could use a custom component that includes a simple text box in the inspector (this is using the Elements API).
You can just copy and paste this component into your project if you want to use it
Hope that helps!
Great! How do I copy it from the project that downloads when I click the link to my project? I see “duplicate” in the dropdown menu but I don’t see how I copy it. Do I paste it by clicking the + in my project?
Press “Command-C” while you have the custom component highlighted in the Editor. Then click back over to the editor of your own project and press “Command P”.
I’m sorry Dan it’s not working. I have it highlighted in Blue in the Editor, I click Command C, then I go back to my project and click Command P and preview opens.
AHA! Scratch that I fixed it. Before I had no HTML Custom created but then when I created one it worked! PS I looked and I did sign up for the Plus subscription.
1 Like
I put the embed code in and it works but they all seem to align center and I want to align them at the stop (which I think is “start”) but I don’t see an option in Marquee Pro to set that. Am I not looking in the right place?
Okay, I’ve taken another look… there’s a couple of tweaks you’ll need to make to the html.
The first line of the substack embed for each item looks like this:
<div class="substack-post-embed">
You’ll need to add self-start to the class, and style="overflow: visible;" just after it, like this:
<div class="substack-post-embed self-start" style="overflow: visible;">
Here’s a sample doc with two of the altered embeds in for your reference: elementsapp://downloadDocument/1tIPKGrxN7rF
btw. If this were me… I’d probably recreate the cards in Elements and just link to the articles on Substack, you’d have much more control over how they look and behaviour that way.
Did you take a look at the project I did for you?
@PMUK I think it was missing the actual embed code, it just had the text…
1 Like
Thanks Dan. I had a feeling it would involve editing the code. I’ll play around as you suggest, but I think you’re right that I’m better off making cards like the other ones I made and make it look similar to what the embed codes produce. Those other cards I made in Marquee Pro look so great!
Thanks just wanted to see so I can learn!