Customized Editor

You can add the custom documentation URL for your application website. To do so, navigate to demo_site > clientview > dist > index.html file and update the value of DOC_DOMAIN. If you don't provide a custom documentation URL, the help icon ('i' icon) is not displayed in the UI.

You can customize the behavior of the back button. To do so, navigate to demo_site > clientview > dist > assets > js > custom-editor.js file and make relevant changes in the editorBackButtonClicked() function.

Sample code to configure back button

function editorBackButtonClicked(operation) {
	var a = window.location.pathname.split("/")
	var pid = null;
	for(let i = 0; i < a.length-1; i++){
    if(a[i]==="projects"){
        pid = a[i+1];
    }
	}
	var route = null;
	if(operation && operation === "logout") {
		route= "/login"
	}
	if(pid) {
		if(operation) {
			route= "/build-your-own-workflow/project/"+pid+"?error="+operation
    } else {
			route= "/build-your-own-workflow/project/"+pid;
    }
	} else {

			if(operation) {

			route= "/build-your-own-workflow"+"?error="+operation

			} else {

			route= "/build-your-own-workflow";
   }
	}
		return route;

	}

You can apply custom styling based on your branding requirements to your workflow editor in the application website.

To do so, navigate to demo_site > clientview > dist > assets > css > custom-editor.css file and make changes in the relevant classes associated with the respective components you want to customize.

Sample code for applying custom css on a Save Workflow button.

	.btn.btn-primary.save_flow_btn.right.primary-btn{

	background: #000 !important;

	}

The following tables provide more information about the workflow editor components and their associated classes. You can make changes in these classes to apply custom styling.