Home › Toolset Professional Support › [Resolved] Put Map from CPT on Home Page
This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.
Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.
This topic contains 14 replies, has 2 voices.
Last updated by Christopher Amirian 1 year, 10 months ago.
Assisted by: Christopher Amirian.
I have a page where I have a map listing locations from a CPT. I followed the tutorial you provided on your site. It works great. How do I have the same map listed on the home page of my site?
Hi there,
If you created the search functionality inside a view then you can use that view on the homepage by going to the block editor and searching for the View Block and selecting the existing view.
If not, you can add a new view and do the same steps to create map-disance search feature for your homepage.
Thanks.
I forgot to mention that I am using Elementor. When I add the view in my page in Elementor, it duplicates the page, puts the listing of CPT's on the page but with no map. Thoughts?
Hi there,
As you used Elementor it is not compatible with the Block editor in WordPress and it is a separate page builder.
You either need to re-create the CPT and map using Elementor:
Or use the legacy mode to create the CPT and map in Toolset:
- Go to "Toolset > Settings > General".
- Find the "Editing experience" section.
- Check the "Show both the legacy and Blocks interface and let me choose which to use for each item I build" checkbox.
- Reload the browser page.
- Go to the newly added "Toolset > Views" menu.
- There you will be able to edit the views.
For more information:
https://toolset.com/course-lesson/enabling-legacy-version-of-toolset-views/
Add a new view with the legacy modeand after you finish the page you will have a shortcode of the view at hand.
Add that shortcode inside Elementor.
For more information on how to add CPT and maps in legacy mode:
https://toolset.com/documentation/legacy-features/views-plugin/
Thanks.,
I added Elementor Blocks for Gutenberg and added a Google map. I set the location to be a toolset field and set the field to the address field I created. The map does not display. I know that it is not associated with the key or anything as I have another map on the page using the API key. I wam wondering what I am doing wrong?
Hi there,
No, I do not think it is the correct way of doing that.
The context of the Google Map search works inside a View. That is why I asked you to create a view on a legacy method and then use the Toolset > Views link to see ethe associated shortcode for that view and add the view shortcode inside the Elementor.
So the very last section will be adding something in Elementor and most of the search section and the map should be handles in the View.
Please follow the steps mentioned in the previous reply.
Thanks.
Gotcha. I went to toolset -> views and do not see a shortcode. I did create it in Gutenberg blocks like the provided tutorial and it is being used on a page where I created it, but I cannot locate the shortcode. Please advise.
Hi there,
You can use the method below to see the shortcode:
https://toolset.com/documentation/programmer-reference/views/views-shortcodes/#vf-154377
You can use the name of the view you see in the list.
But, I will be happy to check and see if the method is still not working for you regarding the Map, maybe I miss something.
I'd appreciate it if you could give me the URL/User/Pass of your WordPress dashboard after you make sure that you have a backup of your website.
It is absolutely important that you give us a guarantee that you have a backup so if something happens you will have a point of restore.
Make sure you set the next reply as private.
Hi there,
Ok, I have found out what the issue is. As I mentioned in my previous replies Elementor is not Gutenberg (block editor).
The Map and View combination that you added in the Find our Product page is a combination of the View block and the Toolset Map block.
There is no Toolset Map block equivalent in Elementor.
So you add the View portion but it is not possible to add the Maps portion.
To be able to use the feature in Elementor you will need to re-create the view in a classic mode (Legacy) feature which uses shortcode-based functionality and it adds also the map inside that.
To do that you first need to add a classic view:
https://toolset.com/documentation/legacy-features/views-plugin/front-page-filters/
And then use the method below to add a Map shortcode inside the classic view:
https://toolset.com/documentation/legacy-features/maps-plugin/displaying-wordpress-content-on-maps/
Now with this method, you have a shortcode-based view that you can use to add yo Elementor with the Toolset View Elementor widget.
You can not add a Toolset Map block to Elementor.
Thanks.
I attempted to follow the directions and I still am doing something wrong. I can only get the list of CPT records display. I cannot get their address markers to display on a map. Please advise.
Hi there,
According to the documentation:
You had to add the marker of the map inside the view. As you used a Content Template I added the marker there.
Also you added retailer location field instead of the retail address field inside the marker shortcode.
I added the view to the test page below and you can see that it shows ok:
hidden link
Thanks.
Are you saying that I needed to put it inside the ul? I just want to confirm.
Are you also saying I selected the wrong field?
Lastly, is there a way to remove the list from the page, just leave the map and have the markers show the content from the list?
Hi there,
Yes and yes.
You will need to go to Toolset > Views, select the classic view that you have created and in the section that the content is added just keep the marker shortcode and remove the other ones and it should work and show only the map with markers for you.
Thanks.
So to remove the list, would I change this...
<ul class="wpv-loop js-wpv-loop">
[wpv-map-render map_id="map-23" map_height="400px"][/wpv-map-render]
<wpv-loop>
</wpv-loop>
to this...
[wpv-map-render map_id="map-23" map_height="400px"][/wpv-map-render]
Yes that is correct,
You will keep the marker shortcode only there and it should work.