All Collections
Advanced
Editing the store pickup “More information” pop-up
Editing the store pickup “More information” pop-up
Jelizaveta avatar
Written by Jelizaveta
Updated over a week ago

You can now customize the More information table for our pickup widget with HTML.

  1. In Zapiet - Pickup + Delivery, click Locations.

  2. Select a location you want to edit.

  3. Add the following code to More information field in the Advanced section.

    This is the example HTML that you will need to modify according to your business needs.

    <style>
    table.OverarchingTable {
    width: 100%;
    background-color: #b5cbbb;
    border-width: 1px;
    border-color: #000000;
    border-style: dotted;
    color: #000000;
    }
    table.OverarchingTable td, table.OverarchingTable th {
    border-width: 1px;
    border-color: #000000;
    border-style: dotted;
    padding: 3px;
    }

    table.AlbionTable {
    width: 100%;
    background-color: #ffffff;
    border-collapse: collapse;
    border-width: 1px;
    border-color: #000000;
    border-style: dotted;
    color: #000000;
    }

    table.AlbionTable td, table.AlbionTable th {
    border-width: 1px;
    border-color: #000000;
    border-style: dotted;
    padding: 3px;
    }

    table.AlbionTable thead {
    background-color: #88ab92;
    }
    </style>

    <table class="OverarchingTable">
    <thead>
    <tr>
    <th><b> Lemongrass and Coconuts </b></th>
    </tr>
    </thead>
    <tbody>
    <tr>
    <td>15 Queensdale Avenue<br>
    Toronto <br>
    M4J 1X9 <br>
    </td>
    </tr>
    </tbody>

    <table class="AlbionTable">
    <thead>
    <tr>
    <th>Day</th>
    <th>Opening Hours</th>
    </tr>
    </thead>
    <tbody>
    <tr>
    <td>Monday</td>
    <td>07:30am to 04:30pm</td>
    </tr>
    <tr>
    <td>Tuesday</td>
    <td>07:30am to 04:30pm</td>
    </tr>
    <tr>
    <td>Wednesday</td>
    <td>07:30am to 04:30pm</td>
    </tr>
    <tr>
    <td>Thursday</td>
    <td>07:30am to 04:30pm</td>
    </tr>
    <tr>
    <td>Friday</td>
    <td>07:30am to 04:30pm</td>
    </tr>
    <tr>
    <td>Saturday</td>
    <td>07:00am to 04:00pm</td>
    </tr>
    <tr>
    <td>Sunday</td>
    <td>09:00am to 03:00pm</td>
    </tr>
    </tbody>
    </table>

With this code added, when your customers click More information under pickup location in Zapiet - Pickup + Delivery widget, they will see a customized table with location's address and opening hours.

Notes

  • This is an example HTML code you can use on your store. Unfortunately, as a small team, we're unable to help with custom code implementation. We would recommend hiring a Shopify Expert or a Shopify Developer to help with this feature.

Did this answer your question?