Hide elements

You can choose to hide the application's elements

a list of elements you can hide on demand.

📘
Hide elements

Header

Origin and destination information

Delivery Code Information

Chat Tab With Driver (Only when the Job is in "Going to Destination" Step")

Delete Product Button (Only in "received")

Payment State

Order Map

Help Center

Decimals

Taxes

Order Help

Cancel Order

Products

Order Number

Shipping
-Discounts

Payment Method

Order Detail

Comment Help Text

Add products

Order Late

Hide chat with picker

Comment Form

Hide chat with support

Hide curbside parking place

Hide change products replacement suggestions

Specific configuration parameters

📘
Hide elements value

Beware that as for now, values are logically inverted.

in order to display the element you set the string 'true', in order to hide, you set the value string 'false'.

Notice also that values are a string, not a boolean

Parameter	Description
hideElements.header	allows you to choose not to render the order header element of the application default: "true" options: "false: \|\| "true
hideElements.originDestination	Allows you to choose not to render the order origin-destination element of the application default: "true" options: "false: \|\| "true"
hideElements.deliveryCode	Allows you to choose not to render the delivery Code element of the application default: "false" options: "false: \|\| "true"
hideElements.chatWithDriver	Allows you to choose not to render the Driver Tab Chat during the specific step "Going To Destination" NOTE: This Param does not affect the visualization of the chat in any other steps. default: "true" options: "false: \|\| "true"
hideElements.productDelete	Allows you to choose not to render the Delete Product Button in the product's list default: "false" options: "false: \|\| "true"
hideElements.paymentStatus	Allows you to render or hide the payment status. default: "false" options: "false: \|\| "true"
hideElements.orderMap	Allows you to show or hide the map component. default: "false" options: "false: \|\| "true"
hideElements.helpCenter	Allows you to show or hide the help center component. default: "false" options: "false: \|\| "true"
hideElements.decimals	Allows you to show or hide the decimals in OrderDetails component. default: "false" options: "false: \|\| "true"
hideElements.taxes	Allows you to show or hide taxes in OrderDetails component. default: "false" options: "false: \|\| "true"
hideElements.orderHelp	Allows you to show or hide order Help section default: "false" options: "false: \|\| "true"
hideElements.cancelOrder	Allows you to show or hide the cancel order button in the CommentForm component default: "false" options: "false: \|\| "true"
hideElements.products	Allows you to show or hide the products in Products component. default: "false" options: "false: \|\| "true"
hideElements.orderId	Allows you to show or hide the order number in the header default: "false", options: "false: \|\| "true"
hideElements.shipping	Allows you to show or hide the shipping in the order details default: "false", options: "false: \|\| "true"
hideElements.discounts	Allows you to show or hide discounts in the order details default: "false", options: "false: \|\| "true"
hideElements.paymentMethod	Allows you to show or hide payment method in the order details default: "false", options: "false: \|\| "true"
hideElements.orderDetail	Allows you to show or hide Order Detail section default: "false", options: "false: \|\| "true"
hideElements.commentHelpText	Allows to show or hide the help text comment default: "false", options: "false: \|\| "true"
hideElements.productsAdd	Allows you to show or hide the button Add Product component products. default: "true" options: "false: \|\| "true"
hideElements.orderLate	Allows you to show or hide the component Order Late default: "true" options: "false: \|\| "true"
hideElements.chatWithPicker	Allows to show or hide the chat with the Picker default: "false" options: "false: \|\| "true"
hideElements.comments	Allows to show or hide the Comment Form component default: "false" options: "false: \|\| "true"
hideElements.chatWithSupport	Allows to show or hide the chat with the Support default: "false" options: "false: \|\| "true"
hideElements.curbsideParkingPlace	Allows to show or hide the parking place input default: "false" options: "false: \|\| "true"
hideElements.hideChangeProductsReplacementSuggestions	Allows you to show or hide the buttons to increase or decrease the amount of the suggestion default: "false" options: "false: \|\| "true"

Usage Example

Consider the following examples:

Hiding Header

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {             
            header: 'false', 
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

You will see the following content

Hiding Origin Destionation Information

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {             
            originDestination: 'false', 
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

You will see the following content

Hiding Delivery Code Element

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {             
            deliveryCode: 'false' 
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Hiding Driver Chat While in "Going To Destination" Step

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {             
            chatWithDriver: true
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Allowing Delete Product Button

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {             
            productDelete: true
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Hiding Payment Status

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {             
            paymentStatus: true
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Hiding Map Component

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {             
            orderMap: true
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Hiding Help Center Component

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {             
            helpCenter: true
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Hiding Decimals in Order Details Component

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {             
            decimals: true
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Hiding Taxes in Order Details Component

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {             
            taxes: true
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Hide the section to understand the charges for the order

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {             
            orderHelp: true
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Hide cancel order button from CommentForm component

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {             
            cancelOrder: true
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Hide Products Component

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {             
            products: true
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Hide order number

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {             
            orderId: true
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Hide shipping

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {             
            shipping: true
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Hide discounts

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {             
            discounts: true
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Hide payment method

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {             
            paymentMethod: true
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Hide order detail

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {             
            orderDetail: true
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Hide help text comment

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {
          commentHelpText: true
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Hide Button Add Product

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {
          productsAdd: true
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Hide Order Late

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {
          orderLate: false
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Hide chat with picker

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {
          chatWithPicker: true
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Hide Comment Form

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {
          comments: true
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Hide chat with support

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {
          chatWithSupport: true
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Hide curbside parking place

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {
          curbsideParkingPlace: true
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>

Hide change products replacement suggestions

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/lsw.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",       
        hideElements: {
          changeProductsReplacementSuggestions: true
        },
    }
    window.instaleap.lsw.render(params)
</script>
</html>