custom css or custom js only for a particular map

New home Forums Basic Version General queries custom css or custom js only for a particular map

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #61606
    nicodergrieche
    Participant

    Hi

    As it is now, if I enter something in the advanced settings fields for custom .css or custom .js it is valid for all maps I’ve defined.
    How could I enter custom .css and .js so that it is valid only for a particular map?

    Best regards

    Nico

    #61615
    AbelC
    Moderator

    Hi Nico,

    Thank you so much for getting in touch with us.

    You will be able to target a specific map by replacing “yourMapId” with your preferred map ID in the following code:
    #wpgmza_map_yourMapId

    Example:

    #wpgmza_map_1 .wpgmza_infowindow_title{
    font-size: 15px;
    }

    Alternatively, could you please confirm your preferred map ID and the code you would like to add to this map?

    I will then be able to advise further.

    I hope this helps clarify, and I look forward to hearing back from you.

    Kind Regards,
    Abel

    #61633
    nicodergrieche
    Participant

    Hi Abel and thanks for the fast response.

    What I would like is to have the following function execute only if the map loaded is one of the following: #wpgmza_map_3, #wpgmza_map_5 and #wpgmza_map_6.

    The idea is that on the maps I use as maps of the POIs for my guests, I don’t want the ‘Customerly bubble’ to appear. I have though other pages containing maps, that I would like the ‘Customerly bubble’ to indeed appear on.

    customerly.load({

    // Custom options
    visible: false
    });

    Best regards

    Nico

    #61651
    AbelC
    Moderator

    Hi Nico,

    Thank you for getting back to me.

    Could I kindly ask if you could please navigate to Maps -> Settings -> Advanced -> Custom JS -> Please paste the following code below:

    jQuery(function($){
    
    if(jQuery("#wpgmza_map_6").length > 0 || jQuery("#wpgmza_map_3").length > 0 || jQuery("#wpgmza_map_5").length > 0)
    {
    	// Map ID 3/5/6 is displayed on this page
    }
    else{
    	// Map ID 3/5/6 is NOT displayed on this page
    }
    
    });

    Please do let me know if this is working for you, and I look forward to hearing back from you.

    Kind Regards,
    Abel

    #61663
    nicodergrieche
    Participant

    Hi Abel

    This did the trick.
    Thank you once again for your superb support 🙂

    Nico

    #61684
    AbelC
    Moderator

    Hi Nico,

    Thank you so much for letting me know.

    It is only a pleasure and please do let me know if there is ever anything else that we can assist you with.

    If you ever have two minutes spare, please consider reviewing the plugin on https://wordpress.org/support/plugin/wp-google-maps/reviews/#new-post it would mean the world to me! (If possible, could I ask you to mention both your name and mine (Abel) in the review for administrative purposes.)

    This would be a tremendous help and have a great day!

    Kind Regards,
    Abel

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