How can I add a drop down menu to the top boarder?

[Sarra]

Hi there,
I'm using Oxygen XML Author to create a website. The top boarder of the website contains the topic head titles. I have multiple topic heads so the title list exceeds one line (2 lines). I would like to change it to add a drop down menu when the title list exeeds one line.
How can I do that?
I'm using the from the box Oxygen XML Author templates
Thank you

[cosmin_andrei]

Hi Sarra,
Thank you for your feedback!

This could be achieved most probably through a CSS and JS customization. More details on how to add a custom CSS in the WebHelp Responsive output can be found using the following link:
https://www.oxygenxml.com/doc/versions/ ... h-css.html

[sistergibson]

Use Oxygen's element picker tool to identify the class name associated with the topic head titles in your template.
Create a new CSS stylesheet or add the following code snippet to your existing stylesheet (adjust class names and properties as needed)

Code: Select all

CSS
.topicheadtitle {  /* Replace with your actual class name */
  white-space: nowrap; /* Prevent titles from wrapping onto multiple lines */
  overflow: hidden;  /* Hide overflowing content */
  text-overflow: ellipsis; /* Add ellipsis (...) for overflowing text */
}

.topicheadtitle:hover { /* Style on hover (optional) */
  background-color: #eee; /* Change background color on hover */
}

/* Additional styles for dropdown (optional) */
.topicheadtitle-dropdown {
  display: none;
  position: absolute;
  background-color: #fff;
  /* Other dropdown styles */
}

.topicheadtitle:hover .topicheadtitle-dropdown {
  display: block;
  /* Additional hover styles */
}

This code snippet sets the white-space, overflow, and text-overflow properties to prevent titles from wrapping and display ellipsis (…) for overflowing text.
The hover effect changes the background color on hover.
You can add additional styles (commented out) to create a dropdown menu that appears on hover. This would require further customization to populate the dropdown with the full list of titles.

[highwayskiver]

Excellent, I appreciate you describing what you done. We should definitely set aside some time to carry out such actions and compose a brief guide for those who might wish to follow in our footsteps.