New home › Forums › Pro Add-on › General queries › Category in infowindow
- This topic has 15 replies, 4 voices, and was last updated 2 months, 2 weeks ago by Matthew.
-
AuthorPosts
-
July 21, 2017 at 3:35 pm #28805creawbeMember
Hey, is it possible to have the category by default be placed in every infowindow? i just want it to be there with a specific id in it so that i can style it where i want it to appear! Thanks in advance.
July 21, 2017 at 4:24 pm #28807SupportTeamModeratorHi there,
Thank you for getting in touch with us.
Could do you explain it a bit more? Do you mean adding categories list to every infoWindow with ID? Actually you have the
wpmgza_category
variable inside wp-google-maps-pro\js\core.js file which store categories IDs of specific marker so you only need to fetch the name of the categories to display it in infoWindow. If this is what you want please let me know so I’ll send you some code.Thank you for your time in this.
Best regards,
JarekJuly 21, 2017 at 4:47 pm #28809creawbeMemberHi Jarek,
I think it is what I need yes. I will explain with an image example how it is now and how I want it to be:
(http://imgur.com/a/ePrm6)
- This reply was modified 5 years ago by creawbe.
July 24, 2017 at 9:28 am #28831SupportTeamModeratorHi there,
I apologize for the delay over the weekend.
Please open wp-google-maps-pro\js\core.js file and find the following lines:
var wpmgza_anim = val.anim; var wpmgza_retina = val.retina; var wpmgza_category = val.category; var current_lat = val.lat; var current_lng = val.lng; var show_marker_radius = true; var show_marker_title_string = true;
and add this after that:
if ('0' !== wpmgza_category) { var wpgmza_cats = wpmgza_category.split(','); var wpgmza_names = []; jQuery.each(wpgmza_cats, function (i, v) { wpgmza_names.push(jQuery('#wpgmza_filter_select option[value="' + v.replace(/ /g, '') + '"]').text()); }); wpmgza_title += '<p class="wpgmza_infowindow_cat">' + wpgmza_names.join(', ') + '</p>'; }
Hope that helps. Feel free to reach out if you need anything.
Best regards
July 27, 2017 at 9:12 pm #28972creawbeMemberHey Jarek, Thanks for your answer!
I copied your code, I can see in the HTML inspector that the <p> tag is being added but the value is just empty.I tried debugging a bit (as far as I could), and I can see that the ‘wpmgza_category’ variable is correct, but the wpgmza_names variable remains empty.
Just for information this is how my checkboxes for filtering look like in HTML (im not sure if this has anything to do with it):<div class="wpgmza_filter_container" id="wpgmza_filter_container_5"> <div class="wpgmza_cat_checkbox_holder wpgmza_cat_checkbox_5"> <div class="wpgmza_cat_checkbox_item_holder_first"> <input type="checkbox" class="wpgmza_checkbox form-control" id="wpgmza_cat_checkbox_0" name="wpgmza_cat_checkbox" mid="5" value="0"> <div> <label for="wpgmza_cat_checkbox_0">All</label> </div> </div> <div class="wpgmza_cat_checkbox_item_holder"> <input type="checkbox" class="wpgmza_checkbox form-control" id="wpgmza_cat_checkbox_5" name="wpgmza_cat_checkbox" mid="5" value="5"> <div> <label for="wpgmza_cat_checkbox_5">Particulier</label> </div> </div> <div class="wpgmza_cat_checkbox_item_holder"> <input type="checkbox" class="wpgmza_checkbox form-control" id="wpgmza_cat_checkbox_6" name="wpgmza_cat_checkbox" mid="5" value="6"> <div> <label for="wpgmza_cat_checkbox_6">Professioneel</label> </div> </div> </div> </div>
July 28, 2017 at 8:42 am #28978SupportTeamModeratorHi there,
I’m so sorry for this. I assumed you have dropdown list not checkbox. Please change the code I’ve sent you before to this one:
if ('0' !== wpmgza_category) { var wpgmza_cats = wpmgza_category.split(','); var wpgmza_names = []; jQuery.each(wpgmza_cats, function (i, v) { wpgmza_names.push(jQuery('.wpgmza_cat_ul input#wpgmza_cat_checkbox_' + v.replace(/ /g, '') ).next('label').text()); }); wpmgza_title += '<p class="wpgmza_infowindow_cat">' + wpgmza_names.join(', ') + '</p>'; }
Hope that helps.
Kind regards
July 28, 2017 at 9:47 am #28982creawbeMemberHey Jarek,
Thank you very much, this works!
July 28, 2017 at 10:39 am #28987SupportTeamModeratorThis reply has been marked as private.March 23, 2022 at 10:15 am #72529eckertwParticipantHi there,
it seems core.js has been made redundant, but I would still like to add categories to the infowindow – is there another way to do this?
Thank youMarch 30, 2022 at 2:32 pm #72610eckertwParticipantAnybody able to support, please?
March 30, 2022 at 4:27 pm #72613bsamarketingParticipantdid you get an answer s I am looking to do a similar thing
March 31, 2022 at 8:55 am #72620StevenModeratorHi there,
Unfortuantely, this is not currently supported, however, might be achievable with a custom script.
If I could kindly ask you to navigate to -> Maps -> Settings -> Advanced Settings -> please copy the script from the gist below and paste this in the custom JS field:
https://gist.github.com/StevenDeBeer/c86e819a23f812f747e807279170e229
Once done, please save the settings.
This should work, however, this was tested locally at my end so failing this, if I could kindly ask you to create a ticket via our support desk(https://www.wpgmaps.com/contact-us/) so that one of our agents can more directly take a look.
Kindest Regards,
Steven De BeerApril 4, 2022 at 10:56 am #72732eckertwParticipantThx Steven,
I couldn’t get it to work and will open a support ticket
Best regardsApril 14, 2022 at 9:05 am #72838eckertwParticipantThis reply has been marked as private.June 1, 2022 at 7:56 am #73240MatthewModeratorHi all,
Matthew here from the WP Google Maps team, and thought I’d share this if anyone needed.
Here is some custom JS code (Maps -> Settings -> Advanced Setting) that will add the category to the marker infowindow:
jQuery(function($){ $(document).on('infowindowopen.wpgmza', function(event){ var marker = event.target.googleObject; var categoryIDs = marker.categories; for(var id of categoryIDs){ var category = WPGMZA.categories.getCategoryByID(id); if($('.wpgmza-infowindow .wpgmza_infowindow_category_custom').length < 1){ $('.wpgmza-infowindow').append('<p class="wpgmza_infowindow_category_custom">'+category.name+'</p>'); } } }) })
Please note that the above code was written with the default marker infowindow styling in mind, thus it may need to be altered if you are using a different infowindow style.
I hope this helps?
Kindest Regards,
Matthew -
AuthorPosts
- You must be logged in to reply to this topic.