Player responsive settings

Hello, we are experiencing difficulties with the Player Settings on mobile devices with small screens. We would need to control the features available (for example the Play or Stop button) with higher priority than others which are available on larger screens. Active Presenter is cutting automatically Player features but the result is not optimal (sometimes totally wrong). As a consequence the final user usability is negatively impacted. Is there a way to tell the priority of the Player Settings if some shall be sacrificed because of resolution? Thanks for help and kind regards.

Hi maxsot,

You can do this by editing the Player Skin layout file. For example, with Modern template, you need to open the file at C:\Program Files\ATOMI\ActivePresenter\templates\html5\skin\Modern\player\layouts\bottombar.html

Then, set the data-priority attribute to a desired value (higher value has higher priority) and save the file.

<div class="ap-toolbar ap-toolbar-bottom" role="toolbar" tabindex="0">
	<div class="ap-button ap-tool-restart" data-priority=15 ></div>
	<div class="ap-button ap-tool-first" data-priority=4 ></div>
	<div class="ap-button ap-tool-prev" data-priority=6></div>
	<div class="ap-button ap-tool-play" data-priority=8></div>
	<div class="ap-button ap-tool-next" data-priority=7></div>
	<div class="ap-button ap-tool-last" data-priority=5></div>
	<div class="ap-button ap-tool-speed" data-priority=3></div>
	<div class="ap-label ap-tool-position" data-priority=9>00:00</div>
	<div class="ap-slider ap-tool-progress" style="flex-grow: 1;" data-priority=14></div>
	<div class="ap-label ap-tool-duration" data-priority=9>00:00</div>
	<div class="ap-button ap-tool-sound" data-priority=12></div>
	<div class="ap-slider ap-tool-volume" data-priority=13></div>
	<div class="ap-button ap-tool-cc" data-priority=2></div>
	<div class="ap-button ap-tool-about" data-priority=1></div>
	<div class="ap-button ap-tool-setting" data-priority=20></div>
	<div class="ap-button ap-tool-displaymode" data-priority=1></div>
	<div class="ap-button ap-tool-toc" data-priority=10></div>
	<div class="ap-button ap-tool-sidebar" data-priority=10></div>
	<div class="ap-button ap-tool-exit" data-priority=16 ></div>


Great, this was exactly what I was looking for. Thanks