VvvebJs

Drag & Drop Website Builder Javascript library


Drag & Drop Website Builder Javascript library

This article is about Drag & Drop Website Builder JavaScript Library “VvvebJs” In this post, you learn how to make JavaScript drag and drop library for your website.

Features of VvvebJs:

  • Components and blocks/snippets drag and drop.
  • Undo/Redo operations.
  • One or two panels interface.
  • File manager and component hierarchy navigation.
  • Add a new page.
  • Live code editor.
  • Image upload with example PHP script included.
  • Page download or export HTML or save the page on the server with example PHP script included.
  • Components/Blocks list search.
  • Bootstrap 4 components.
  • Youtube, Google maps, Charts.js, etc widgets.

Code of VvvebJs:

<!– jquery–>
<script src=”js/jquery.min.js”></script>
<script src=”js/jquery.hotkeys.js”></script>

<!– bootstrap–>
<script src=”js/popper.min.js”></script>
<script src=”js/bootstrap.min.js”></script>

<!– builder code–>
<script src=”libs/builder/builder.js”></script>
<!– undo manager–>
<script src=”libs/builder/undo.js”></script>
<!– inputs–>
<script src=”libs/builder/inputs.js”></script>
<!– components–>
<script src=”libs/builder/components-bootstrap4.js”></script>
<script src=”libs/builder/components-widgets.js”></script>

<script>
$(document).ready(function()
{
Vvveb.Builder.init(‘demo/index.html’, function() {
//load code after page is loaded here
Vvveb.Gui.init();
});
});
</script


 

Leave a Reply

Your email address will not be published. Required fields are marked *