Category in infowindow

New home Forums Pro Add-on General queries Category in infowindow

Viewing 15 posts - 1 through 15 (of 15 total)
  • Author
    Posts
  • #28805
    creawbe
    Member

    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.

    #28807
    SupportTeam
    Moderator

    Hi 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,
    Jarek

    #28809
    creawbe
    Member

    Hi 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:

    image example

    (http://imgur.com/a/ePrm6)

    • This reply was modified 5 years ago by creawbe.
    #28831
    SupportTeam
    Moderator

    Hi 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

    #28972
    creawbe
    Member

    Hey 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>
    #28978
    SupportTeam
    Moderator

    Hi 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

    #28982
    creawbe
    Member

    Hey Jarek,

    Thank you very much, this works!

    #28987
    SupportTeam
    Moderator
    This reply has been marked as private.
    #72529
    eckertw
    Participant

    Hi 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 you

    #72610
    eckertw
    Participant

    Anybody able to support, please?

    #72613
    bsamarketing
    Participant

    did you get an answer s I am looking to do a similar thing

    #72620
    Steven
    Moderator

    Hi 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 Beer

    #72732
    eckertw
    Participant

    Thx Steven,
    I couldn’t get it to work and will open a support ticket
    Best regards

    #72838
    eckertw
    Participant
    This reply has been marked as private.
    #73240
    Matthew
    Moderator

    Hi 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

Viewing 15 posts - 1 through 15 (of 15 total)
  • You must be logged in to reply to this topic.