Solved Templates

customising logo and menu

Asked by University of Mauritius 4 years ago Last activity 4 years ago

hi.. i wish to make the logo bigger and the sub menu horizontal.
Please help...
https://prnt.sc/aPKqJwKSnVB3

Accepted answer

Marked as the solution

Paul Frankowski Senior Staff

4 years ago · edited

Logo - fixed

2nd Menu - also looks normal, horizontal view

11 more replies

Paul Frankowski Senior Staff

4 years ago · edited

Hi,

You Should Know ....

Indeed, those are the basics ;)

about 2nd task, it was described in Helix documenation in "Customization tips" section.

I will take look and change.

University of Mauritius Asked this

4 years ago

thank you.. the logo gets distorted when made bigger from the template customisation.. which is why i turn to you.. :)

University of Mauritius Asked this

4 years ago · edited

Thanks a lot. 2 last things..

can you please help reduce the space between the image and the text of the main menu https://prnt.sc/5AmZEWKzzIUU
and move the search icon below?

https://prnt.sc/p7-KGryelW0I

Paul Frankowski Senior Staff

4 years ago

ad 1) Add this custom CSS

.sp-megamenu-parent > li > a, .sp-megamenu-parent > li > span {
  line-height: 70px; }

University of Mauritius Asked this

4 years ago

thank you.

Paul Frankowski Senior Staff

4 years ago

ad 2) Search icon in menu

.icon-top-wrapper i.search-open-icon {
  color: #293B48; }

    .icon-top-wrapper {
  line-height: 50px;
  margin: 0 0 0 25px;
  width: 36px;
  z-index: 999999;
  position: absolute;
  right: 0;
  padding-left: 10px;
}

But I think the logo "Sus Dev Goals" should be in different position. It doesn't look good in menu row.

University of Mauritius Asked this

4 years ago · edited

another issue with this template is that when you open the site in small screen, the mobile menu shows old logo and the button images are not standard.. please advise where we can change same

University of Mauritius Asked this

4 years ago

thanks for the search icon and the suggestion.. i shall discuss same with the department.

Paul Frankowski Senior Staff

4 years ago · edited

About Themis logo, please find SPPB module published in "offcanvas" position and remove logo image from it.

About icons in Mobile Menu

.offcanvas-inner .menu li.item-179 img { max-width: 52px;}
.offcanvas-inner .menu li.item-115 img { max-width: 72px;}

Those are very basic changes, you should know CSS ...and how to use Code Inspector from Firefox

University of Mauritius Asked this

4 years ago

thank you so much.. i have been looking for the options in the template itself, when it was in modules.