PPMP Online Bookings

Installation

HTML/CSS coding experience required. You will need a website developer to install the book now button.

• Step 1: Ensure you have registered with PPMP to receive an online booking URL provided by PPMP staff.


• Step 2: Place the below stylesheet code within the head of your pages required for the book now button.
<link rel="stylesheet" href="https://ppmp.com.au/ob/cdn/online-booking-style.css">
Copy stylesheet code


• Step 3: Place the below button code within the body (at the start of the body) of your pages.
<!-- Start PPMP Online Booking, place within body of website--><div class="ppmponlinebooking"> <!-- Blue, Orange, Red, Green, Black, Grey, Orange, Purple, Turquoise, White, Yellow colors available, change color in class below to activate --> <div class="corner-ribbon top-left sticky blue ribbonbutton" onclick="document.getElementById('id01').style.display='block'" style="z-index:99999;"> Book Online Now! </div> <div class="scroll-wrapper ppmp-modal" id="id01" style="display:none;"> <div class="ppmp-modal-content ppmp-card-4 ppmp-animate-zoom"> <div class="ppmp-closebtn" onclick="history.go(0)" VALUE="Refresh"> ✖ </div><!--Replace # with URL link provided by PPMP Online Bookings migration wizard--> <iframe class="iframe-container" id='ppmpsrcUrl' src='#' style='width:100%;height:100%;-webkit-overflow-scrolling: touch; overflow: auto;' frameBorder="0"></iframe> </div> </div> </div><!-- End PPMP Online Booking, place within body of website-->
Copy stylesheet code


• Step 4: Within the button code, replace # with your online booking URL provided by PPMP staff.
<iframe class="iframe-container" id='ppmpsrcUrl' src='#' style='width:100%;height:100%;-webkit-overflow-scrolling: touch; overflow: auto;' frameBorder="0"></iframe>
• Step 5: Within the button code, replace the class blue to change the ribbon color.
<div style="z-index:99999;" class="corner-ribbon top-left sticky blue ribbonbutton" onclick="document.getElementById('id01').style.display='block'">Book Online Now!</div>
• Color options below

• Your practice website should now have a ribbon on the top left corner of your website which will popup online bookings linked directly to your diary. Patients will only be able to book if the time slots are empty in your PPMP diary (Cannot book if notes/reserved slots/already booked). As soon as the patient books an appointment, they will receive a notification email with login details to book again in the future. The practice will also get a notification email as well as the diary auto-populating the appointment within the PPMP diary. Book now button image can be altered with custom HTML/CSS by a web developer and placed anywhere on the pages if desired.
• PPMP Online Bookings is viewable on mobile only if the website applied on is optimized to be mobile friendly.
• Multiple online bookings can be created, create another button and repeat step 3 (use id attribute id02 instead of id01 for the second button). This will allow you to have two different buttons for multi-diary (multi-location) bookings. The second button and second modal should now have the id attribute id02.