Snippet Variables?

Question

Is there any way that we can create snippets in Atom with variables (someway like Emmet did in HTML)?

Here's an example that we want to achieve:

From: p4

To: padding: 4% 4% 4% 4%

( From: p[i] to padding: i% i% i% i% ) (the user input p+[i] , i is variable )

Answer 1

To my knowledge you are not able to do that with Atom snippets because they are composed with just CSON (i.e. no scripting). So while you can't do that you can use a single variable and expand it into multiple locations in your snippet, something I learned in this blog that I read here

Taken from that post, here is example CSON to do that:

'.source.css':
   'Padding With Mostly Identical Values':
     'prefix': 'pwmiv'
     'body': 'padding: ${1:num}px ${1:num}$2px ${1:num}$3px ${1:num}$4px;'

Looking at it, it looks like you can also tab through each placeholder to edit any paddings that need to be different.