Map Bubble

This topic contains 7 replies, has 2 voices, and was last updated by  Kor 8 years, 1 month ago.

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

Open Support Ticket

Tagged: 

  • Author
    Posts
  • #304110

    timgtheo
    Full Member
    Post count: 211

    Hi there

    When I asked previously about how to customise the map bubble I was sent a link to a page that frankly I don’t understand as it’s for developers.

    I simply wish to change the background colour at the top and the text colour, as the default combination is difficult to read, and possibly the height of the box. I assume that you do this with some css code. Can you provide some code that I can edit with my choice of colours etc.?

    Regards
    Tim

    #304183

    Kor
    Moderator
    Post count: 16516

    Hi Tim,

    Try out the custom CSS code below and see if it helps.

    
    
    .geodir-bubble_desc h4 {
        background-color: #000!important;/* Change BG color */
        font-size:20px; /* Change font size */
        height: 50px; /* Change box height */
     }
    
    .geodir-bubble_desc h4 a{
        color:#fff!important; /* Change font Color */
     }

    Thanks!

    #304192

    timgtheo
    Full Member
    Post count: 211

    Hi Kor

    I’ve attached my challenge, so what would the CSS code actually say to achieve this?

    Regards
    Tim

    #304196

    Kor
    Moderator
    Post count: 16516

    Hi Tim,

    You mean the custom CSS I’ve provided earlier did not work for you? Kindly, 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.

    #304235

    timgtheo
    Full Member
    Post count: 211

    Hi Kor

    No I’ve not tried the CSS code yet because I don’t know what to add to get the results I want. That’s why I asked you to give an example based on the image I attached.

    If I just add your code above I don’t know what result to expect.

    Regards
    Tim

    #304543

    Kor
    Moderator
    Post count: 16516

    Hi Tim,

    Thanks for your reply. Alright, let me just help you with this. If you apply the custom CSS code below into your Website, it will look something like the attached screenshot. Is this what you’re looking for?

    
    
    .geodir-bubble_desc h4 {
        background-color: #3498db!important;/* Change BG color */
        font-size:15px; /* Change font size */
        height: 40px; /* Change box height */
     }
    
    .geodir-bubble_desc h4 a{
        color:#fff!important; /* Change font Color */
     }
    #304640

    timgtheo
    Full Member
    Post count: 211

    Hi Kor

    That works thanks. It would be good to know what each element of the code means so that I could make changes in the future if needs be.

    Maybe you could add a section on the website with a brief video walkthrough so that everyone could benefit.

    Regards
    Tim

    #304809

    Kor
    Moderator
    Post count: 16516

    Hi Tim,

    I’d like you to check out this documentation that explains how to work with custom CSS https://wpgeodirectory.com/docs/customizing-your-style/

    Thanks!

Viewing 8 posts - 1 through 8 (of 8 total)

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

Open Support Ticket
20% Discount Offer
Hurry! Get your 20% discount before it expires. Get 20% Discount