Jump to content

Backoffice 1.6, Edit Header bar with prestashop icon/links

Recommended Posts



In the backoffice in the top header, the prestashop name/icon and internal links,  I can't find instructions for either changing the words/icon and links or disabling that function. 


Can someone please provide instructions where to find the file for editing & instructions for editing?


I imagine many people would find this post helpful and if its already been posted before, please provide link to the post. 


Thank you for your time. 

Link to comment
Share on other sites

it's a ADMIN_DIR/themes/default/template/header.tpl file

you can remove there things you mentioned

				<button id="header_nav_toggle" type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse-primary">
					<i class="icon-reorder"></i>

				<a id="header_shopname" href="{$default_tab_link|escape:'html':'UTF-8'}">
					<img src="{$img_dir}prestashop-avatar.png" alt="{$shop_name|escape:'html':'UTF-8'}" />


<li id="employee_infos" class="dropdown">
						<a href="{$link->getAdminLink('AdminEmployees')|escape:'html':'UTF-8'}&id_employee={$employee->id}&updateemployee" class="employee_name dropdown-toggle" data-toggle="dropdown">
							<span class="employee_avatar_small">
								<img class="imgm img-thumbnail" alt="" src="{$employee->getImage()}" width="32" height="32" />
							<span class="string-long">{$employee->firstname} {$employee->lastname}</span>
							<span class="string-short">{l s='Me'}</span>
							<i class="caret"></i>
						<ul id="employee_links" class="dropdown-menu">
								<span class="employee_avatar">
									<img class="imgm img-thumbnail" alt="" src="{$employee->getImage()}" width="96" height="96" />
							<li class="text-center">{$employee->firstname} {$employee->lastname}</li>
							<li class="divider"></li>
							<li><a href="{$link->getAdminLink('AdminEmployees')|escape:'html':'UTF-8'}&id_employee={$employee->id}&updateemployee"><i class="icon-wrench"></i> {l s='My preferences'}</a></li>
							<li class="divider"></li>
							<li><a id="header_logout" href="{$default_tab_link}&logout"><i class="icon-signout"></i> {l s='Sign out'}</a></li>
  • Like 3
Link to comment
Share on other sites

  • 3 weeks later...

Hello, in the same way, I dont find how Prestashop16 back office sidebar menus, links name of controller and his icon, exemple:


<i class="icon-AdminAdmin">


I could understood the use of bootstrap standards icons like


<i class="icon-camera icon-white">


but I dont know how I could change the icon of the controller, especially because I need one for my new module.


thanks in advance

Link to comment
Share on other sites

in this case icons are a part of css styles

for example, icon for dashboard:

.icon-dashboard:before, .icon-AdminDashboard:before, .icon-tachometer:before, .icon-dashboard:before, .icon-AdminDashboard:before { content: "\f0e4"; }

it's a part of /admin3175/themes/default/css/admin-theme.css file


all other icons are also a part of css styles.



each menu item has got own class, class="icon-AdminXXXXXXX" where XXXXXXXXXX is name of controller

  • Like 1
Link to comment
Share on other sites

many thanks for this quickly perfect answer ;-) now I understood 


I let this link for others that explain the mecanism




And... is it possible with javascript to force to collapse automatically the sidebar at the entrance of a module ?


   41   //set main navigation aside
   42   function navSidebar(){
   43: var sidebar = $('#nav-sidebar');
   44   sidebar.off();
   45   $('.expanded').removeClass('expanded')
Link to comment
Share on other sites

  • Create New...