Use your custom icons

---

To change the default icons used in the plugin with your custom icons, the plugin provides several hooks to do so.

Each of the following examples is related to one icon used in the plugin. For example, to change the icon that hides & shows the map, you need to add the code in the example 1 to the file “functions.php” of your child/theme. Note also, that you must change THE_URL_OF_YOUR_CUSTOM_ICON in the code by the URL of your custom icon.

1. Use the hook cspml_collapse_map_img to change the collapse icon. Here’s an example:

add_filter('cspml_collapse_map_img', function($default_icon, $map_id){
   return THE_URL_OF_YOUR_CUSTOM_ICON;
}, 10, 2);

 

2. Use the hook cspml_item_pinpoint_img to change the marker icon that appears in the list items. Here’s an example:

add_filter('cspml_item_pinpoint_img', function($default_icon, $map_id){
   return THE_URL_OF_YOUR_CUSTOM_ICON;
}, 10, 2);

 

3. Use the hook cspml_list_view_img to change the list icon that appears in the top bar. Here’s an example:

add_filter('cspml_list_view_img', function($default_icon, $map_id){
   return THE_URL_OF_YOUR_CUSTOM_ICON;
}, 10, 2);

 

4. Use the hook cspml_grid_view_img to change the grid icon that appears in the top bar. Here’s an example:

add_filter('cspml_grid_view_img', function($default_icon, $map_id){
   return THE_URL_OF_YOUR_CUSTOM_ICON;
}, 10, 2);

 

5. Use the hook cspml_refine_img to change the refine icon that appears in the filter. Here’s an example:

add_filter('cspml_refine_img', function($default_icon, $map_id){
   return THE_URL_OF_YOUR_CUSTOM_ICON;
}, 10, 2);

 

6. Use the hook cspml_toggle_filter_img to change the toggle icon that appears in the filter. Here’s an example:

add_filter('cspml_toggle_filter_img', function($default_icon, $map_id){
   return THE_URL_OF_YOUR_CUSTOM_ICON;
}, 10, 2);

 

7. Use the hook cspml_sort_img to change the sortby icon that appears in the top bar. Here’s an example:

add_filter('cspml_sort_img', function($default_icon, $map_id){
   return THE_URL_OF_YOUR_CUSTOM_ICON;
}, 10, 2);

 

8. Use the hook cspml_sort_arrow_down_img to change the arrows icon that appears in the sortby field in the top bar. Here’s an example:

add_filter('cspml_sort_arrow_down_img', function($default_icon, $map_id){
   return THE_URL_OF_YOUR_CUSTOM_ICON;
}, 10, 2);

 

9. Use the hook cspml_refresh_filter_img to change the arrows icon that appears in the button “Refresh” in the filter. Here’s an example:

add_filter('cspml_refresh_filter_img', function($default_icon, $map_id){
   return THE_URL_OF_YOUR_CUSTOM_ICON;
}, 10, 2);

 

10. Use the hook cspml_filter_search_img to change the filter icon that appears in the button “Filter” in the filter. Here’s an example:

add_filter('cspml_filter_search_img', function($default_icon, $map_id){
   return THE_URL_OF_YOUR_CUSTOM_ICON;
}, 10, 2);

 

11. Use the hook cspml_item_link_img to change the link icon that appears on top of the item image in the list. Here’s an example:

add_filter('cspml_item_link_img', function($default_icon, $map_id){
   return THE_URL_OF_YOUR_CUSTOM_ICON;
}, 10, 2);