I cant see hover or css options in my web export panel. Why?

Different UI

Can someone help me to know why in my Web Export interface I can’t see the HOVER options or see the CSS. Neither selecting an object nor selecting a workbench I can see what in videos and tutorials looks like a more advanced panel of options. Thank you very much.

I want to see this:

1 Like

Do you mean the element options panel? To show the panel go to the plug-ins menu > Web Export > Element Options.

Your screen scale might be too large. Try to reduce the screen scale until you can see all the options. Or use the scroll bars to bring the options into view.

Or, you might need to select two items for it to appear.

Thank you for your response @webmaker . I mean I don’t see the hover options in the panel, as shown in this screenshot. In tutorials I have seen how these options appear but I can’t see them.

If I change the scale of the screen, the options of this panel are not modified.

Do you know what the problem is?

I also don’t see the button to open the macros so I can’t use any of the methods to make HOVER.

I also don’t see the blue arrows that you see in the tutorial interfaces to go back and forth over the elements.

That’s why I think the problem is the interface, I don’t know why it doesn’t look the same.

Please, I need your help. I just need to know why I don’t see the HOVER options. After “Markup After”, towards the bottom, I can’t see the options that I did put in the first screenshot of this thread.

1 Like

Hmm that doesn’t look right. What operating system and Adobe XD versions are you using?

For the element options panel select the edge and drag it out so it’s wider. See if that shows the export options.

Also, can you open the Plug-in console and check if there are any errors?

Are the selected objects on an artboard or the paste board?

That’s odd. :thinking: It looks like none of the images are showing either. The macros button is an image. If none of above works then can you reinstall the plug-in?

I am using a macOS Big Sur 11.6.5
and XD 50.0.12.14 x64

But…

Finally I see it!!! I had to reinstall the plugin and when loading again I see the whole interface!!!

Thank you very much.

1 Like

I am not seeing the hover effects options either as the OP stated earlier… I’ve tried uninstalling/installing Web Export Pro two times with no luck… I want the hover effect for my email contact hyperlink to change the font color… works fine in XD Desktop Preview…

additionally I have tried to set my email hyperlink target as “_blank” but it continues to work as target “self” or “parent” despite changing it several times…

lastly I prefer hyperlinks to have no text-decoration but have not been able to style this…

thanks in Advance!
~Bobby

Web Export Pro version 8.1.0
macOS 14.4.1

Hi Bobby,

Welcome to the forums!

I will look into this

I will look into this too. You might be able to set the css style using the important flag.

You can add a global style like so:

*, *:hover {
   text-decoration: none;
}

But I’ll see if there’s an easier way to do this. If desktop preview has a different hyperlink style then I think the default export should match that? Thoughts?

Hello Velara and thanks for your reply. I’ll give the global style recommendation a try. I’ll need to double check on my default export matches the desktop preview hyperlink styles too. thanks again and please let me know if you have any new info. ~Bobby

To prioritize a style use the important flag like so:

*, *:hover {
   text-decoration: none !important;
}

If you’d like to send a xd file or add an image of the style you prefer I can work on that.

One thing I do is after export, open the web inspector tools in the browser and then modify the CSS of the element. Then copy those styles into Web Export styles value for the element.

I’m working on a guide to show how to do this. I’ll see if I can prioritize it soon.