There are 2 Ways top menu’s content:
One is install an extension which adds information pages to the top menu, or
the Second is use manually edit catalog/view/theme/default/template/common/header.tpl
For Example, if you want to add any information page on the top menu, you can to to header.tpl file
and find <div id=”menu”>
Add underneath
<li><a href=”yourinfomationpagelink”>Information page name</a></li>
To modify color:
please edit : catalog/view/theme/YOURTHEME/stylesheet/stylesheet.css
Look for the:
#menu {
background: To change the background colour
And
#menu > ul > li:hover {
background: To change the hover colour
To modify fonts, fonts color or fonts size:
please edit: catalog/view/theme/YOURTHEME/stylesheet/stylesheet.css
To change the Nav. bar text & colour :
#menu > ul > li > a {
font-size: 13px; (change for text size)
color: #FFF; (change for text colour)
font-family: ‘FuturaBook BT’, serif; (change for text fonts)
Use google fonts to your opencart:
Add this code to your header.tpl, before “<body>”:
| <link rel=”stylesheet” type=”text/css” href=”http://fonts.googleapis.com/css?family=YOUR-FONT-NAME”> |
Then, in styleshett.css, asign font-family to your elements.
or you can also try this method to define your own fonts:
| @font-face { font-family: yourfont; src: url(‘yourfonturol/yourfont.ttf’); } |