Posts by Tejaswini


You can easily embed Google Maps inside the WordPress Post Tabs content area. Generally, Google Maps and jQuery Tab causes issue with the positioning of the highlighted place in the maps and that’s why we have provided a fix for the same. You need to add few extra lines in the standard Google Maps IFRAME embed code before pasting the same in In-active Tab content area. Below is an example of standard Google Maps embed code highlighting a direction between ‘San Francisco’ and ‘Los Angles’, <iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps?f=d&source=s_d&saddr=San+Francisco,+CA,+United+States&daddr=Los+Angeles,+CA,+United+States&hl=en&geocode=FVJmQAIdKAe0-CkhAGkAbZqFgDH_rXbwZxNQSg%3BFYqYBwIdm77z-CkT2ifcXcfCgDH0CEYlb98v4g&aq=0&oq=san,+United+States&sll=37.0625,-95.677068&sspn=58.598104,135.263672&mra=ls&ie=UTF8&ll=35.939954,-120.330998&spn=3.775181,4.176866&t=m&output=embed"></iframe><br /><small><a href="https://maps.google.com/maps?f=d&source=embed&saddr=San+Francisco,+CA,+United+States&daddr=Los+Angeles,+CA,+United+States&hl=en&geocode=FVJmQAIdKAe0-CkhAGkAbZqFgDH_rXbwZxNQSg%3BFYqYBwIdm77z-CkT2ifcXcfCgDH0CEYlb98v4g&aq=0&oq=san,+United+States&sll=37.0625,-95.677068&sspn=58.598104,135.263672&mra=ls&ie=UTF8&ll=35.939954,-120.330998&spn=3.775181,4.176866&t=m" style="color: #0000ff;">View Larger Map</a></small> Now if you are embedding the same code inside a tab content area, you need to add some extra lines highlighted in the green color, <iframe class="gmap" width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" data-src="https://maps.google.com/maps?f=d&amp;source=s_d&amp;saddr=San+Francisco,+CA,+United+States&amp;daddr=Los+Angeles,+CA,+United+States&amp;hl=en&amp;geocode=FVJmQAIdKAe0-CkhAGkAbZqFgDH_rXbwZxNQSg%3BFYqYBwIdm77z-CkT2ifcXcfCgDH0CEYlb98v4g&amp;aq=0&amp;oq=san,+United+States&amp;sll=37.0625,-95.677068&amp;sspn=58.598104,135.263672&amp;mra=ls&amp;ie=UTF8&amp;ll=35.939954,-120.330998&amp;spn=3.775181,4.176866&amp;t=m&amp;output=embed"></iframe><br /><small><a href="https://maps.google.com/maps?f=d&amp;source=embed&amp;saddr=San+Francisco,+CA,+United+States&amp;daddr=Los+Angeles,+CA,+United+States&amp;hl=en&amp;geocode=FVJmQAIdKAe0-CkhAGkAbZqFgDH_rXbwZxNQSg%3BFYqYBwIdm77z-CkT2ifcXcfCgDH0CEYlb98v4g&amp;aq=0&amp;oq=san,+United+States&amp;sll=37.0625,-95.677068&amp;sspn=58.598104,135.263672&amp;mra=ls&amp;ie=UTF8&amp;ll=35.939954,-120.330998&amp;spn=3.775181,4.176866&amp;t=m" style="color:#0000FF;text-align:left">View Larger Map</a></small> Important – You only need to edit the embed code of Google Maps when pasting the same in hidden or In-active tab. No change required in case of active tabs. For example, there is no edit or change for ‘Map 1’ embed in below example. Here is how the map inside a tab content will...

Read More