Split: Address format in map location bubble

We have moved to a support ticketing system and our forums are now closed.

Open Support Ticket

Tagged: map location bubble

Author

Posts
September 4, 2017 at 8:22 pm #394268

Joy
Buyer

Post count: 1076

Hi, just wondering how I would get the city and region on the same line below the street address. Currently, each element is stacked on top of one another.

Thank you.

September 5, 2017 at 12:24 pm #394351

Giri
Expired Member

Post count: 3155

Hi please provide the page url. So i can provide css.

Thanks

September 5, 2017 at 10:08 pm #394422

Joy
Buyer

Post count: 1076

This reply has been marked as private.

September 6, 2017 at 11:11 am #394474
Giri
Expired Member

Post count: 3155
```
.sd .sd-detail-info .sd-address {
    float: none !important;
}
```
September 6, 2017 at 7:37 pm #394516

Joy
Buyer

Post count: 1076

Sorry, but that doesn’t seem to work.

This is currently how the address is displayed in the map bubble:

Address:
123 Some Street
City
Region
Phone Number: (123) 456-7890

This is how I would like it be display:
Address:
123 Some Stree
City, Region
Phone Number: (123) 456-7890

September 7, 2017 at 6:32 am #394570
Kor
Moderator

Post count: 16516
Hi Joy,

Could you please insert this custom CSS code below and see if it helps?
```
.geodir-bubble-meta-side .geodir_more_info.post_address span[itemprop="addressRegion"] {
   display: inline-block!important;
}
.geodir-bubble-meta-side .geodir_more_info.post_address span[itemprop="addressLocality"] {
   display: inline-block!important;   
}
.geodir-bubble-meta-side .geodir_more_info.post_address span[itemprop="addressLocality"]::after {
   content:",";
   margin-right:5px;
}
```
Thanks!
September 7, 2017 at 7:14 am #394573
Joy
Buyer

Post count: 1076
That didn’t do anything. But this sorta helped. There’s still a bit of a gap between the street address and the city and region. I can see a <br> in the code outside of the css. It’s not critical or anything, but it would be nice if that could be fixed.
```
.geodir-bubble-meta-side .geodir_more_info.post_address span[itemprop="addressLocality"], .geodir-bubble-meta-side .geodir_more_info.post_address span[itemprop="addressRegion"], .geodir-bubble-meta-side .geodir_more_info.post_address span[itemprop="addressCountry"], .geodir-bubble-meta-side .geodir_more_info.post_address span[itemprop="streetAddress"] {display:table:}
```
Thank you.
September 7, 2017 at 7:20 am #394574
Kor
Moderator

Post count: 16516
Hi Joy,

Try replacing it with the below and see if it works. It should look something like this http://prntscr.com/gi444e . If that doesn’t work still, please share Wp temp admin so that I could test the code directly.
```
.geodir-bubble_desc .geodir-bubble-meta-side .geodir_more_info.post_address span[itemprop="addressRegion"] {
   display: inline-block!important;
}
.geodir-bubble_desc .geodir-bubble-meta-side .geodir_more_info.post_address span[itemprop="addressLocality"] {
   display: inline-block!important;   
}
.geodir-bubble_desc .geodir-bubble-meta-side .geodir_more_info.post_address span[itemprop="addressLocality"]::after {
   content:",";
   margin-right:5px;
}
```
September 7, 2017 at 7:23 am #394576

Joy
Buyer

Post count: 1076

I get the same result with the above code. I guess either will produce the same.

But there’s a bigger than normal space between the street address and the city/region. Do you notice that?

September 7, 2017 at 9:49 am #394589

Kor
Moderator

Post count: 16516

Hi Joy,

Please share WP temp admin access to your site so we can take a better look. You can post the details here using the private reply option below.

September 7, 2017 at 1:13 pm #394613
Giri
Expired Member

Post count: 3155
Try this css.
```
.geodir-bubble-meta-side .geodir_more_info.post_address span[itemprop="addressLocality"], .geodir-bubble-meta-side .geodir_more_info.post_address span[itemprop="addressRegion"] {
    display: inline-block !important;
    margin: 0;
    margin-bottom: 5px;
    margin-right: 5px;
}
```
My last reply was for detail page and i misunderstood your request.

Thanks
September 7, 2017 at 9:01 pm #394683

Joy
Buyer

Post count: 1076

This reply has been marked as private.

September 8, 2017 at 2:01 am #394710

Joy
Buyer

Post count: 1076

Sorry hold off on this. I found that I had some conflicting css that I need to clean up. I’ll let you know if I still need help with this. Thank you.

September 8, 2017 at 2:39 am #394712
Joy
Buyer

Post count: 1076
Okay, I’m back.

The last snippet from Giri worked. But now I have another issue. How do I get the street address on a separate line from the “Address” heading?

I also figure out what the problem was. I was using this code, which puts the address on a separate line, but I haven’t been able to figure it out how to tweak it to achieve what I want.
```
/* map bubble address details */
.geodir-bubble-meta-side .geodir_more_info.post_address span[itemprop="addressLocality"], 
.geodir-bubble-meta-side .geodir_more_info.post_address span[itemprop="addressRegion"], 
.geodir-bubble-meta-side .geodir_more_info.post_address span[itemprop="addressCountry"],
.geodir-bubble-meta-side .geodir_more_info.post_address span[itemprop="streetAddress"] {
    display:block!important;
}
```
Thank you.
September 8, 2017 at 2:41 am #394713

Joy
Buyer

Post count: 1076

This reply has been marked as private.
Author

Posts