How to Upload Your Own Code or Template

How to Upload Your Own Code or Template


How to Upload Your Own Code or Template

Import a template or paste in code


Just as tinyEmail gives you the world's most powerful and yet convenient Drag & Drop email editor, we also provide you with a flexible and unique custom code editor for your email designs. You can either code directly into the tool, paste your code, import an  HTML template file, or try a hybrid between code and visual components. Let's run you through all the different options when you want to BYOC to tinyEmail! 


Paste or type in your code

Start by navigating to your dashboard and from there, go into your templates library from the left-hand navigation panel. Here, you will find the usual array of different types of pre-designed, branded and basic templates. 

Click on the Custom code tab and then select the Paste your code card. 

This will open up the split view code editor with a preview on top and HTML and CSS sections below. You can paste in your HTML code and see a real-time preview generated above. 


tinyEmail paste in code


Don't forget the CSS pane where you can put in your CSS code if you'd like to keep your HTML header clean. tinyEmail will automatically insert the CSS code inside the <head></head> section of your code. 


add CSS


teh work is autosaved


Import an HTML template file

You can also import an HTML file directly into tinyEmail. To do that, go back to your template library and click on the Custom code tab. This time, click on the Import HTML card to open up the file upload modal. 


Browser your local computer and upload your HTML file. 


The HTML template, if formatted correctly will render itself in these same preview, HTML and CSS panels as we described above. 



Use the hybrid builder as a framework (beta) 


You can use our visual template layout to help you code from scratch. Even better — using our framework-based code editor keeps your template compatible with our Drag & Drop editor. Now you truly have the best of both worlds. 

How it works: Hover over the different sections, rows and columns in the boilerplate template section above the code panels. As you click around the different modules, the code associated with those specific modules is made available to you. You can make changes to the code and customize the template here.

To get into the hybrid framework, click on Create template in the main template library. 


Note that this is a feature in BETA and should be used cautiously.


From there, select HTML. This will load the boilerplate template along with the code panels at the bottom. 


edit html code


That's all.


We are constantly working to build more intuitive, more powerful and useful solutions that help you communicate better with your audience. And there's a ton more to come!


    • Related Articles

    • How to Add Video to an Email Template

      How to Add Video to an Email Template Increase reader engament There are so many reasons to inject video into your email marketing campaign. Tell a story. Show your brand. Demonstrate social proof. Get clicks. Yes, research suggests that email ...
    • Save Campaign Template Design Changes

      Save Campaign Template Design Changes Understanding our streamlined workflow We spend a lot of time rethinking the user experience. How can we help the user (qua you) get from A to B with the fewest jumps, hurdles, and interruptions? Along that ...
    • Create a New Email Template

      Create a New Email Template Build beautiful templates in 3 minutes Fun fact about time allocation. Before tinyEmail, we were spending about 75% of our email marketing time playing around with email design tools and 25% of the time crafting meaningful ...
    • Customize the general settings of your email template.

      Customize the general settings of your email template. Say hello to the world's most powerful and intuitive email editor. Here's how to create stunning emails on tinyEmail Do not throw away the manual! We at tinyEmail are a big believer in ...
    • Upload an Audience File to tinyEmail

      Upload an Audience File to tinyEmail Bulk importing subs has never been easier Manual data imports just got a lot less manual. Our AI-assisted bulk import tool automatically matches labels and detects errors. This must-try time saver is essential if ...