Добавить Charm Bar

Админ Панель-Внешний вид-Ваш стиль-Глобальные-globalTemplate найти:

 <!-- ::: MAIN CONTENT AREA ::: --><div id="content" class="clearfix">

Ниже добавить:

<div class="showcharm" onmouseover="document.getElementById('charmbar').className='charmbar1'" onmousemove="document.getElementById('hidecharm').className='hidecharm1'"> </div><div id="hidecharmmenu" class="hidecharm0" onclick="document.getElementById('hidecharm').className='hidecharm0'; document.getElementById('hidecharmmenu').className='hidecharm0'; document.getElementById('ch1').className='charmmenu0 bodycolor'; document.getElementById('ch2').className='charmmenu0 bodycolor'; document.getElementById('ch4').className='charmmenu0 bodycolor'; document.getElementById('ch5').className='charmmenu0 bodycolor'"> </div><div id="hidecharm" class="hidecharm0" onmouseover="document.getElementById('charmbar').className='charmbar0'" onmousemove="document.getElementById('hidecharm').className='hidecharm0'"> </div><div id="charmbar" class="charmbar0"><div style="display: table-cell; vertical-align: middle; height: 500px"><div class="charm"><a href="https://*****************************************************************'>https://*****************************************************************"target="_blank"><img src="{style_images_url}/XXXXXXXXXX.png" alt="" /></a><br><font color="white">Текст</font></td></tr></tbody></table></a></div><div class="charm"><a href="https://******************************************" target="_blank"></br><img src="{style_images_url}/XXXXXXX.png" alt="" /></a><br><font color="white">Текст</font></td></tr></tbody></table></a></div><div class="charm"><a href="**********************************************************************"><img src="{style_images_url}/XXXXXXXXX.png" alt="" /></a><br><font color="white">Текст</font></td></tr></tbody></table></a></div><br><div class="charm"><a href="http://****************************************'>http://****************************************" target="_blank"></br><img src="{style_images_url}/XXXXXXXXX.png" alt="" /></a><br><font color="white">Текст</font></td></tr></tbody></table></a></div><div class="charm"><a href="http://**********************************" target="_blank"></br><img src="{style_images_url}/XXXXXXXXX.png" alt="" /></a><br><font color="white">Текст </font></td></tr></tbody></table></a></div></div></div>

Админ Панель-Внешний вид-Ваш стиль-css Добавить CSS-файл
Название: charmbar.css.
 

.showcharm {z-index:9999;width:50px;height:100%;left:0px;top:0px;position:fixed;}.hidecharm0 {z-index:-9999;width:0px;height:100%;left:0px;top:0px;position:fixed;}.hidecharm1 {z-index:9996;width:100%;height:100%;left:0px;top:0px;position:fixed;}.charmbar0 {z-index:10000;background: #424242;border-right: 3px solid #e60000;width: 100px;height: 100%;position: fixed;left:-100px;top:0px;vertical-align: middle;display:table;-webkit-transition: all 400ms cubic-bezier(0.000, 0, 0, 1.000);transition: all 400ms cubic-bezier(0.000, 0, 0, 1.000);}.charmbar1 {z-index:10000;background: #424242;border-right: 3px solid #e60000;width: 100px;height: 100%;position: fixed;left:0px;top:0px;vertical-align: middle;display:table;-webkit-transition: all 400ms cubic-bezier(0.000, 0, 0, 1.000);transition: all 400ms cubic-bezier(0.000, 0, 0, 1.000);}.charmitem {width: 100px;height: 100px;vertical-align: middle;font-size: 15px;color: #a0a0a0;}.charm {background: #424242;text-align: center;vertical-align:middle;display: block;width: 100px;height: 100px;}.charm a, .chitem a {text-decoration:none;}.charm:hover {background: #474747;}

Также вы можете добавить изображение, которое привлекает внимание Charm Bar-а.
Картинки:

или

Чтобы поместить изображение выше кода Charmbar-и вставьте код:

<div class="goto_button"><img src="{style_images_url}/goto.png" alt="" /></a></div>

В CS вставьте код:

.goto_button {position: fixed;left: 2px;top: 45%;opacity: 0.5;}

Загрузить выбранное изображение в FTP / public / style_image / ваш стиль