Show category icons on search page (in results)

Ok understood, thanks Guust. I’m not familiar with PHP (only html and CSS) so I wont be able to customise it myself. Shame though as it felt so close. I’ll think of a workaround for now and fix this properly with a developer from your link at a later stage when all road blocks are solved.

I got to work now.. what a long ride. Anyway, here are the steps that I did to make it work and the CSS code for anyone trying to achieve something similar (it’s all about taking AND giving back):

1) in geodirectory -> place settings -> custom fields -> add a checkbox for each category you have
2) within the checkbox settings:
2a) dont enter anything for frontend title
2b) enter HTML variable name which will be relevant for the CSS (e.g. I used parentcategory1)
2c) is active yes
2d) show in listings page
2e) for parent categories that should have text: dont reference a icon link. For sub cats that should have an icon: enter the icon url.
3) add the following code to your child theme style

.geodir_more_info {
    float: left !important;
    clear: both !important;
}

[class*="parentcategory"] {
  clear: both !important;
}

.geodir_parentcategory1 {
  float: left;
  display: inline;
  margin: 0;
  text-align: center;
  visibility: hidden;
}
.geodir_parentcategory1::before {
  content: 'Parent Cat 1:';
  visibility: visible;
}
.geodir_parentcategory2 {
  float: left;
  display: inline;
  margin: 0;
  text-align: center;
  visibility: hidden;
}
.geodir_parentcategory2::before {
  content: 'Parent Cat 2:';
  visibility: visible;

}
.geodir_subcategory1a {
  float: left;
  display: inline;
  clear:none !important;
  margin: 0;
  width: 1.75vh;
  color: transparent;
}

.geodir_subcategory1b {
  float: left;
  display: inline;
  clear:none !important;
  margin: 0;
  width: 1.75vh;
  color: transparent;
}
.geodir_subcategory1c {
  float: left;
  display: inline;
  clear:none !important;
  margin: 0;
  width: 1.75vh;
  color: transparent;
}

.geodir_subcategory2a {
  float: left;
  display: inline;
  clear:none !important;
  margin: 0;
  width: 1.75vh;
  color: transparent;
}

The final result is in screenshot 1

The only problem that remains is that the checkboxes deliver the output “yes”, which is not visible due to the CSS transparent attribute, but its still there (see screenshot2). @guust: is it easily possible to remove the “yes” output?

Yep, I’m aware thanks Guust. Hence, I will have to always replicate and mirror actual categories and the pseudo categories in custom fields.

The code (adjusted for the sub cats) didnt work, it actually just removed the icon and the hidden “yes” was still there.

Code I used:

.geodir_subcategory1a .geodir-i-checkbox {
  display: none;
}