In This Article:

    A Primer on Website Templates and Template Support at Salsa

    In This Article:

      Templates are used all over the internet to keep branded websites consistent. They provide the code, files, images, scripts, fonts, etc. that shape and style the look of a page.

      In Salsa there are two kinds of templates: email blast templates and website templates. We separate templates in this way because emails and websites have distinct browser types, and email browsers just aren’t that good at rendering the fancy scripts that make websites zing. Separating them makes sure your emails and webpages look as good as possible to the most number of users.

      Salsa’s built-in WYSIWYG allows you to create a pretty fancy looking email blast template from scratch using the editing tools or by modifying a stock email template. On the other hand, website templates aren’t editable using Salsa’s WYSIWYG. This is due to the cool and sophisticated things you do can in a website template which not even the best WYSIWYG can handle.

      Hence, creating and editing website templates in Salsa can sometimes be intimidating for the not-so-code-friendly. I’m here to say, have no fear: there are a couple of ways that you can pre-empt common problems that occur with website templates.

      Have a killer website and need to get a template in Salsa?

      If you’ve already got a solidly designed and branded website, you want to be sure Salsa’s pages match. Salsa’s website template extractor is your friend. Basically, this tool scrapes code from your website, saves it in Salsa, and plugs in a little marker where Salsa’s form should go. Sometimes, however, after you extract your template, some things just aren’t... working right.

      This can occur for lots of reasons and largely depends on how your website is set up. Certain scripts may need to be modified or simply removed so that the code will work hosted on Salsa’s end. Here are a couple common issues:
         

      • Lots of CMS’s these days use server-side scripts to load in Twitter, Facebook, or other social media posts automatically. Since these get loaded only when the page loads on your server’s end, they won’t update any more after extraction. If you are using one of these, I recommend using the iframe widget you build in Twitter and on Facebook. You just need to add the resulting code to a spot in your template. These will load even on Salsa.
      • Your fancy drop-down navigation menu used to dynamically drop down when you hovered over them, but now they seem to be broken (or perhaps missing icons that used to show up). In some cases, a drop down menu depends are certain script libraries that might be conflicting with what’s loading from Salsa. If this is the case, go ahead and email support@salsalabs.com and we can help you identify them.
      • The alignment of the spot where Salsa’s form loads in my template is all wonky. This can sometimes be caused simply by choosing the wrong place for Salsa’s form to go in the first step of the extraction process. The simple solution/test is to try re-extracting the page again and choose a different location for the Salsa form, then see how it looks. It might also be that you’ve got some styling in your website that’s acting on Salsa’s form when it loads and causing everything to get a little out of place. If so, Support can help you find out where.


      These are just a couple ways to troubleshoot common issues. You can see others on our Template FAQ.

      Don’t have a website to extract from or just want to create something new?

      If you don’t have a website that you can extract a template from, you can always use Salsa’s  built-in template library, which only requires you to have a banner image handy.

      Additionally, one common question we get asked frequently is what would be a good “blank” template. That is, a template that’s still valid but would only show the Salsa portion of the page. Here’s a sample for you:

      <!DOCTYPE html>
      <html>
      <head>
      </head>
      <body>
      <!-- TemplateBeginEditable name="content" --><!-- TemplateEndEditable -->
      </body>
      </html>

      When creating your template, just choose the “Create Your Own” option and paste in the above code. You’re good to go!

      Halp! I need help!

      Salsa’s support team is here to help you with extracting, securing, and generally getting your template working in Salsa. We want your page to look good using our platform. This includes making sure you are handy with the extractor, find any broken files so you can address them, and help you find and secure elements of your template when you need to use it on a donation page.

      Purely design-oriented adjustments to templates are, however, outside the scope of normal support. We can certainly help you identify portions of Salsa’s built-in styles that you’ll need to override if you want to modify them. But we are not able to write and then execute custom, design-oriented code. This includes custom CSS, JQuery, or other Javascript.

      That said, if customizing your template code isn’t your cup of tea and you would like additional help, our Services team or a Salsa partner can help you execute your design. For example, if you’re hoping to modernize a template and make it as mobile friendly as possible, our friends at Cornershop Creative are ready to jump right in. They are experts at “mobilizing” Salsa forms.

      Was this article helpful?
      0 out of 0 found this helpful
      Have more questions? Submit a request

      Comments

      4 comments
      • The template I'm using is formatted just fine and sync'd with our core website, which is great. The issue, however, is that ALL our salsa content loads to the extreme left side of the page. I'd like to standardize adding some white space to our template but I'm at a loss of how to accomplish this. 

      • Hi Ruth,

        It sounds like your web template could use some content padding. A pretty standard way to do that is to add the following code to the HTML:

        padding.png

        However - if you're not confident in your HTML knowledge do this with caution.  Without seeing the code of your specific web template it's hard to say exactly where this extra bit of HTML should be inserted.  Our support team is always available to help.  When you email them, please include the URL of your web template in Salsa HQ.  A screenshot which illustrates this problem would also be helpful.

      • I am looking for where I can upload a new banner

      • I see it is under the website management tab and then click link "images and files"

      Please sign in to leave a comment.