JavaScript Code Snippets for Standard Wingify Editor Operations

Attention: You are viewing documentation for Visual Editor. If you are looking for Visual Editor Next documentation, click here.

For every action you perform inside Wingify Editor, it generates a JavaScript code snippet. You can modify the generated code snippet to implement changes to the element.

The following section lists the editor operations and corresponding JavaScript code snippets generated for the operations:

#Move

vwo_$("elementPath").vwoCss({
  "top": "-92px !important",
  "left": "369px !important",
  "zIndex": "auto !important",
  "position": "relative !important",
  "display": "inline-block !important"
});

#Show/Hide (Visibility)

vwo_$(".top-vwo-logo--white").vwoCss({
  "visibility": "hidden !important"
});

#Remove

vwo_$("elementPath").vwoCss({
  "display": "none !important"
});

#Change Image

vwo_$("elementPath").vwoCss({
  "img": "/url/path !important"
});

#Change URLs

vwo_$("anchorPath").attr({
  "src": "/new/path"
});

#Change CSS (Styling)

vwo_$("elementPath").vwoCss({
  "property1": value1,
  "property2": value2..!important
});

#Content (Edit)

vwo_$("elementPath").html("Content to put");

#Content (Edit HTML)

vwo_$("elementPath").replaceWith("<div>Dummy HTML</div>");

#Change Background Image

vwo_$("elementPath").vwoCss({
  "background-image": "url(/images/vwo_logo.png) !important"
});

#Paste (Before An Element)

vwo_$("elementPath").before("<div>Dummy Existing Element to Paste</div>");

#Paste (After An Element)

vwo_$("elementPath").after("<div>Dummy Existing Element to Paste</div>");

#Rearrange

vwo_$("elementPath").each(function() {
  var destP = vwo_$("#Id-prod-buy-outer"),
    dest = destP.nonEmptyContents().eq(1);

  if (dest.length)
    dest.before(this);
  else
    destP.append(this);
});

#Custom Code to Remove An Element from Your DOM

vwo_$("elementPath").remove();
or
var dev = "xyz@example.com";
alert(dev);

#Need more help?

For further assistance and more information, contact Wingify Support.