How to move logo from the side of menu to above the menu.

[MrWade]

Yes,
  I am using Classic version 8.2.3 I want to move the logo from the side of the menu to above the menu. Can someone help me with this area please?

Mr Wade

[Nilis]

Hi MrWade,

This can be done by creating a child theme and modify that to fit your needs. I am assuming that you are not using the hook displayNavFullWidth for anything, since i will be using that.

1. Click Backoffice->Improve->Design->Theme & Logo
2. Click tab "Advanced Customization"
3. Click Download theme
4. unzip child_classic.zip
5. copy the original header.tpl from your classic theme to your unzipped child_classic theme:
   copy
   public_html/themes/classic/templates/_partials/header.tpl
   to
   child_classic/templates/_partials/header.tpl
6. Make the following modification:
   Change

   {hook h='displayNavFullWidth'}

   into

   <div class="container">
     {hook h='displayNavFullWidth'}
   </div>

7. zip the child_classic/classic folder in a child_classic.zip file
8. In "Advanced Customization" click step 3 "Upload Child theme"
9. Choose your modified child_classic.zip file
10. Click tab "Theme and Logo"
11. Activate the child_classic theme
12. Click Backoffice->Improve->Design->Positions
13. Click "Position a module"
14. Look for your menu module
15. Select displayNavFullWidth hook

It might require some custom css to get everything to your wishes, but that can be achieved by modifying the custom.css in your child_classic theme (assets/custom.css).

I have attached a basic child_classic.zip that does everything explained above (except the hook positioning ofcourse)

child_classic.zip