Page 1 of 1
Make entire box clickable
Posted: Mon Dec 05, 2022 9:54 pm
by jonathanm
How can I make the entire box clickable? Currently, only the words are clickable.
image.png
Re: Make entire box clickable
Posted: Tue Dec 06, 2022 2:12 pm
by cosmin_andrei
Hi jonathanm,
The default implementation is based on the following action - when you click on the text/word to open the respective chapter. In order to make the entire box clickable, you can find more details here:
https://github.com/oxygenxml/oxygen-pub ... k-on-tiles
Re: Make entire box clickable
Posted: Thu Dec 08, 2022 11:58 pm
by jonathanm
hi - I added .css information and it worked as far as making it clickable.
Where do I add the href or filename, so it knows to go to the correct topic?
Re: Make entire box clickable
Posted: Fri Dec 09, 2022 1:19 pm
by Costin
Hi Jonathan,
Please note that the "
Click on Tiles" customization includes also an HTML fragment which should be added in your publishing template.
Please make sure that you follow the instructions from the
WebHelp User-Guide to add the fragment into the template.
After you've added both the HTML fragment and the CSS customization, then you should publish the output using the custom publishing template you created.
Regards,
Costin
Re: Make entire box clickable
Posted: Fri Dec 09, 2022 5:18 pm
by jonathanm
I'm getting a red error line using the HTML fragment you provided:
<script type="text/javascript">
<!--
const list = document.querySelectorAll('.wh_tile');
Array.prototype.forEach.call(list, function (tile) {
tile.addEventListener('click', event => {
tile.querySelector('a').click();
});
});
-->
</script>
image.png
image.png
Re: Make entire box clickable
Posted: Mon Dec 12, 2022 12:43 pm
by Costin
Hi,
Please note that is not necessary for the fragment to be a valid HTML.
All that matters is that the fragment should be a well-formed XML, as also mentioned in the
How to Insert HTML Content topic from our User-Guide.
Also, at line 15, in the template's description you did not specify any placeholder.
You should look into the
HTML Fragment Extension Points user-guide topic to identify the correct placeholder you could use.
Regards,
Costin
Re: Make entire box clickable
Posted: Tue Dec 13, 2022 7:22 pm
by jonathanm
Hi Costin,
I added the placeholder and it worked. Thanks!