1

I've been using Craft CMS for a while, but haven't seen any way to get the following done:

Looking to create a page with a large image on it. The image would be overlayed with buttons that pop-out a text box or overlaid image. I'd like to place the pop-out boxes/graphics all over the image in specific places, but the creation interfaces I've seen only let me put one image after another in a list, or rectilinear fashion. I'm hoping to create a map of a neighborhood where clicking on different buildings/elements pops out another window with more information regarding that area/element.

I hope this is understandable, if more clarity is needed please let me know.

Any insight would be greatly appreciated.

Thanks

Improve this question
3
  • Sounds like you'll need a mixture of things that work together. Backend wise you could add a matrix field for adding multiple text or images, inside of each would be a couple of extra entry fields for X & Y placement according to where you want it on the image e.g TextBox1 would have 20% from left, 70% from top. – Dr_Codswallop Feb 19 '19 at 19:59
  • Getting them working in your template is more CSS specific. In your template you'll grab the X & Y's for each block in your matrix and use them as inline CSS properties on absolute positioned div's over the background image. Making them 'pop' when buttons are clicked would be some custom javascript. – Dr_Codswallop Feb 19 '19 at 20:00
  • Thanks for the insights. – K M Mar 13 '19 at 15:50
2

Whilst this mainly seems like a front-end development question, and Dr_Codswallop has perfectly summed up some steps in the comments to tackle that, as an answer for the Craft CMS specific side of the question there is a plugin I have used in the past that is very helpful, but it is only for Craft 2.x:

Donkeytail

I have had a look through the plugin store and I can't find an alternative plugin for Craft 3.x, so it looks like you will need to follow Dr_Codswallops instructions and build up something manually if you are running this version of Craft.

Improve this answer
1
  • Cool, this looks like what I could use. Do you know if I can do more than just dots, add pop-ups with text/graphics? Or group multiple dots so that they all light up if I roll over one of them? – K M Mar 13 '19 at 15:52

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.