Options
IconSet
Line Formatting
Normal
Mouse-Over
Preview
Optional CSS
By default the TSViewer background-color is transparent and the width/height dynamic, meaning only the necessary height and maximum width (of the parent element) will be used for the rendering. Here you can change that.
HTML Code
Place this code in your site HTML. The TSViewer will be shown at the selected placement.
Additional Informations
Code Structure
The <div> is an placeholder for the TSViewer. The first <script> loads the TSViewer Loader, the second <script> controls the Loader and contains in the long URL your Viewer settings. The Loader loads the TSViewer and does place him into the placeholder <div>.
Code placement optimizationoptional
If possible, place just the <div> at the correct spot in your HTML. Whereas both <script> tags at the end of your HTML (but before </body>). That way the TSViewer Loader will be loaded just after your site has been fully received and rendered by your browser.
Functional principle
The TSViewer gets generated from the live data of your TeamSpeak 3 server. At each call of the TSViewer the TSViewer.com server does gets queried. The server queries your TeamSpeak 3 server (max 1x/minute) and generates the TSViewer tree. If the TSViewer gets called more often than 1x/minute, it will return the most recently generated tree.