Smarty‘s curly braces syntax is used to render PHP code into Smarty template file. The curly braces syntax is the default syntax comes with Smarty framework. Almost every PHP variable or loop wears this opening and closing braces.

Until and unless you use custom code other than Smarty, you do not even notice it could be an issue. Most of the time developers appends a Javascript functions or CSS snippet within a Smarty template file (.tpl). And the issue comes into picture!

Smarty does not allow you to directly use their curly braces structure other than Smarty code.

But Smarty knows this problem and has given two solutions over it!

Solution 1: {literal}

{literal}
<script type="text/javascript">
  (function($){
    // your jQuery code
    // you can use {$smarty.variable} within {literal} block
  })(jQuery);
</script>
{/literal}
{literal}
<style type="text/css">
  #someid { property: value}
  #someclass { property: value}
</style>
{/literal}

Advantage: {literal} is used at block level and allow you to execute your block level code as expected. Mostly it is used around Javascript or CSS blocks where {curly braces} used as syntax delimiter. It displays your code as-is.
Disadvantage: But you cannot use {literal} if there is an objects in your HTML/TPL with curly braces.

Solution 2: {ldelim}, {rdelim}

<div id="mapLocation" data-location="{id: 1, {lan: -25.23562, lat: 14.24563}, category: 'books-stores'}">
  <!-- map code -->
</div>

{ldelim} and {rdelim} are simply means ‘left delimiter‘ and ‘right delimiter‘ and are used for escaping template delimiters, default they are { and }.

In above example we can directly use {ldelim} for left brace and {rdelim} for right brace.

<div id="mapLocation" data-location="{ldelim}id: 1, {ldelim}lan: -25.23562, lat: 14.24563{rdelim}, category: 'books-stores'{rdelim}">
  <!-- map code -->
</div>

Advantage: Allows you to escape the left and right curly braces individually. Works well where {literal} doesn’t! It does not require ‘close’ tags like {/ldelim}. As the Smarty code executes, it replaces {ldelim} and {rdelim} with their respective curly braces and your HTML code works flawlessly!

Disadvantage: Requires to put for every right-left curly braces. Does not have block level support.