This is part 6 of a series of tutorial for the googleDirections - To Here - plugin.
- By default, the Google Map is displayed on the left and the routing directions on the right.
- If you prefer to display the directions below the map, you can use the keyword vertical=1
Directions Below the Map
- Directions on Right
- Directions Below the Map
- Directions Below the Map - Full Width
By default, the direction is displayed on the right.
{googleDir_tohere width=320 height=360 dir_width=275 home_addr="900 N Point St, San Francisco, CA 94109}
Coming from:
|
{googleDir_tohere width=320 height=360 dir_width=275 vertical=1 home_addr="900 N Point St, San Francisco, CA 94109"}
Coming from:
|
You can use width=100%
and dir_width=100%
to automatically expand the width of map and directions to fill the full width of the page.
{googleDir_tohere width=100% height=360 dir_width=100% vertical=1 home_addr="900 N Point St, San Francisco, CA 94109}
Coming from:
|
Tutorials for the googleMaps plugin
- googleMaps plugin Tutorial 01: Getting Started
- googleMaps plugin Tutorial 02: Zoom Level
- googleMaps plugin Tutorial 03: Language
- googleMaps plugin Tutorial 04: Map Type
- googleMaps plugin Tutorial 05: KML Files
Tutorials for the googleDirections plugin
- googleDirections plugin Tutorial 01: Getting Started
- googleDirections plugin Tutorial 02: Specifying Stopover Points
- googleDirections plugin Tutorial 03: Travel Modes
- googleDirections plugin Tutorial 04: Unit Systems - miles or km
- googleDirections plugin Tutorial 05: Display Directions on the Left
- googleDirections plugin Tutorial 06: Display Directions below the Map
- googleDirections plugin Tutorial 07: Display Directions in your Local Language
- googleDirections plugin Tutorial 08: Specifying Stopover Points
Tutorials for the googleDirections_to_here plugin
- googleDirections - To Here - plugin Tutorial 01: Getting Started
- googleDirections - To Here - plugin Tutorial 02: Adding Label to Home Address
- googleDirections - To Here - plugin Tutorial 03: Travel Modes
- googleDirections - To Here - plugin Tutorial 04: Unit Systems - miles or km
- googleDirections - To Here - plugin Tutorial 05: Display Directions on the Left
- googleDirections - To Here - plugin Tutorial 06: Display Directions below the Map
- googleDirections - To Here - plugin Tutorial 07: Display Directions in your Local Language
- googleDirections - To Here - plugin Tutorial 08: Specifying Stopover Points
Comments
thanks
https://lge-ctsmotorsports.com/contact/k2-extra-field-groups/contact
Any ideas?
Disregard, it didn't work on the first 5 refreshes but now it does. Great extension!
1. How do I get the map and directions box to align horizontally side by side?
2. Also is it possible to word wrap the directions to keep within the display width? the directions wrapped Ok on an early version.
Thanks.
(1) In the previous version, I used a standard 2-column HTML table. The map goes on the left and the directions is displayed on the right.
Due to the popularity of mobile phones, most websites are now using responsive design. Google SEO also penalize those websites that do not support responsive design. As such, in the latest version, the plugin now supports responsive design (through the use of CSS). You can try it on an iPad. In the landscape mode, the map and directions are displayed side by side. But in the portrait mode, the map and directions are displayed top and bottom.
(2) The directions are entirely returned by Google. I did not do any formatting before displaying the directions.
For (1), if you require the map and directions to be displayed side by side, you can use back the previous version, or you can change the code yourself back to using HTML table.
Let me know if you need any of the previous version of the plugin, ok?
Warm Regards,
/kksou
Best regards
Jim
Code:
> Well, occasionally there are two copies of the directions shown, one above the other
Do you mean when you go to the backend Extensions: Manage and you see 2 different entries there?
Or do you mean the frontend where the maps and directions are being displayed?
Warm Regards,
/kksou
RSS feed for comments to this post