• Resolved paulogoes

    (@paulogoes)


    Hi,
    I want a small window to appear when i click in a region of the image, with an image and 2 lines of text.
    I added a link to the image, chose popover, and selected an image. Then I edited the html, and added the 2 lines of text into the <p></p> tags. It works!
    Is this right way of doing this?
    The popover works great, but it has a scroll bar, which is not very functional in this case. Is there a way to increase the height of the popover?
    Thank you.

    • This topic was modified 3 months, 1 week ago by paulogoes.
    • This topic was modified 3 months, 1 week ago by paulogoes.
Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author Avirtum

    (@avirtum)

    Can you provide a sreenshot? It will be helpfull for me .)

    Thread Starter paulogoes

    (@paulogoes)

    Here you can see the need to scroll the popover to see the text. I would like to control the popover height to avoid scrolling and scrolbars:

    https://ibb.co/s3rKQyt
    https://ibb.co/J2jt2Dh

    The previous images are from the preview window. When I put the shortcut on a page, the popover window looks much smaller, and I don′t know how to change this (it′s not a “zoom with map” setting):

    https://ibb.co/ZV453w6

    These are my popover and image settings:

    https://ibb.co/vxHWMcN
    https://ibb.co/WGw8Vxv

    I would like to have more control of the popover window:
    – control its width and height
    – configure the background color
    – better centralize the image (they have the aligncenter CSS attribute, but are not centralized). I could centralize the text, but not the image.

    Is any of this possible (even using CSS)? If yes, how can I achieve this popover appearance control?

    Thanks in advance for your assistance in this.

    Plugin Author Avirtum

    (@avirtum)

    This is because you are using the tooltip type for the popup data. But we can use CSS if we want to change the look of the defalt.

    1) We need to add a new class to our popovers and enable “width from CSS” parameter, in principle you can work without this new class, then the styles apply to all popovers.

    https://ibb.co/Hp7V5w7

    2) Set styles

    https://ibb.co/kKf3nmw

    .vision-map .vision-popovers .vision-popover.mypopover .vision-form {
    width: 300px;
    max-height: none;
    background: #ff0000;
    }

    3) Check the result

    https://ibb.co/ScqdkCS

    Thread Starter paulogoes

    (@paulogoes)

    That worked wonderfully, thank you very much! And it even works with Zoom with map! Perfect!!!

    Tho only thing that remained, as you can see in the first image, is that the image, although centered, is a little offset to the left side. But this was easily corrected by adding padding to the CSS class you provided (2nd image). I tell you that because maybe there is an error on your default CSS.

    https://ibb.co/C82hr1b

    https://ibb.co/TcrxG2N

    Well, I tried all the hotspot plugins I could put my hands to, like 8 or 9. They where either too expensive or not as functional as yours (some were very disappointing). Yours is truly the best, I can assure this. And your support is very responsive too!

    I wish you success. Keep up the good work!

    Paulo

    Plugin Author Avirtum

    (@avirtum)

    I got it, I’ll check out your comment on the css part. Also I would be very grateful if you could leave some feedback on my plugin. If you have a moment, I would greatly appreciate it if you could share your experience by rating it here – https://www.ads-software.com/support/plugin/vision/reviews/#new-post.
    Your feedback is very important to me.

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