Highlighting Price Variation Options
Whilst CabGrid cannot currently automatically update the price based on booking form input, we have some recommendations for drawing your customer’s attention to the price variation buttons…
How to use CabGrid Pro v5 Alt Styles
CabGrid Pro version 5.8.14 includes a new set of built-in styles. Selecting these styles means custom CSS for these styles need not be entered in the custom CSS box. To use these styles, select ‘Alternative Styles v5’ under BASE STYLES in the OPTIONS tab of the CabGrid Pro WordPress admin panel.
Changing the Return/One-Way Icon Button with CSS Styling
CSS code snippets for Cab Grid Pro version 5 and above that change the appearance of the one-way/return button icon shown in the plugin calculator interface. These snippets can be added to the Custom CSS box under the OPTIONS tab in the Cab Grid Pro WordPress admin page.
Disable Floating Price Bar with CSS
How to disable the floating price banner displayed in the footer using CSS
Customise taxi booking form based on user input
Ever needed to hide or show booking form fields based on the destination or passenger numbers selected by your customer? In Cab Grid Pro v5.5 dynamic CSS classes are added to the main Cab Grid element allowing subsequent manipulation of content through CSS.
How to remove the shadow from the new Cab Grid Pro v5 styling
The new version of Cab Grid Pro automatically applies a drop shadow to the taxi price calculator box. This can be disabled by adding a simple line of CSS code to the STYLING CSS box under the OPTIONS tab on the Cab Grid Pro WordPress admin page: .cabGridPro:after {display:none;}
Using Pre-defined Styles in CabGrid Pro
CabGrid Pro version 5.0 provides the ability to select the main stylesheet loaded with the front-end calculator plugin. There are a variety of pre-defined style-sheets available that provide a starting point for any custom CSS.
Changing the Return/One-Way Icon in Cab Grid Pro version 4
s Note The CSS code on this page is geared primarily to Cab Grid Pro version 4 or earlier and may require some further adjustments to be applied to Cab Grid Pro version 5 or later. However, the basic principles remain the same so only minor updates should be...
Style Builder
Currently in beta, the Cab Grid style builder utility helps preview and test out custom CSS styling for the taxi fare price calculator interface. It provides a visual interface for adjusting styles for the Cab Grid calculator.
Language Options for the CabGrid Pro Taxi Price Calculator
Visitors can choose the language for the Cab Grid fare price calculator independently of the language set by WordPress using flag icons shown on the visitor portion of the plugin.
Styling/hiding Price Variation Buttons
In Cab Grid Pro a visitor has the option to select different price variants for a journey using buttons displayed at the top right of the Cab Grid price calculator. (For information on configuring these price variations please see this article.) These buttons can be...
How to troubleshoot CSS styling issues in CabGrid
Common CabGrid CSS styling problems and how to use a web browser Inspector to troubleshoot layout or appearance issues. e.g. Button text not visible or elements overlapping.
Basic Style Changes using CSS
How to change the appearance of the Cab Grid fare price calculator using custom CSS styling. Custom styles cab be added under the OPTIONS tab.
