Changing my nav bar code from the custom CSS menu

  • 1
  • Question
  • Updated 7 years ago
  • Answered
I just finished implementing a new menu for my site. What I did was copy/paste the code on every page. Now, if I want to make changes to the menu that means I have to copy/paste again to all the pages. I know I can use the edit custom CSS option but I am not sure what part of my code I can leave up there and what part has to stay on every page.

It would be great if I can control every aspect of the menu from the Edit CSS option!

Here is the code I am using for the majority of my pages.

<style type="text/css">

#topbar {


border: 0;

padding: 10px;

background-color: #8E7F57; /*Color of bar - if transparent (left blank) it will only display text and may not look right*/





width: 100%;

z-index: 100;





#topbar a {
/*Link color in top bar*/


<script type="text/javascript">


* Floating Top Bar script- © Dynamic Drive (

* Sliding routine by Roy Whittle (

* This notice must stay intact for legal use.

* Visit for full source code


var persistclose=0 //set to 0 or 1. 1 means once the bar is manually closed, it will remain closed for browser session

var startX = 0 //set x offset of bar in pixels

var startY = 0 //set y offset of bar in pixels

var verticalpos="fromtop" //enter "fromtop" or "frombottom"

function iecompattest(){

return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body


function get_cookie(Name) {

var search = Name + "="

var returnvalue = "";

if (document.cookie.length > 0) {

offset = document.cookie.indexOf(search)

if (offset != -1) {

offset += search.length

end = document.cookie.indexOf(";", offset);

if (end == -1) end = document.cookie.length;

returnvalue=unescape(document.cookie.substring(offset, end))



return returnvalue;


function closebar(){

if (persistclose)




function staticbar(){


var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;

var d = document;

/* function ml(id){

var el=d.getElementById(id);

if (!persistclose || persistclose && get_cookie("remainclosed")=="")"visible"



el.x = startX;

if (verticalpos=="fromtop")

el.y = startY;


el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;

el.y -= startY;


return el;*/


/* window.stayTopLeft=function(){

if (verticalpos=="fromtop"){

var pY = ns ? pageYOffset : iecompattest().scrollTop;

ftlObj.y += (pY + startY - ftlObj.y)/8;


var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;

ftlObj.y += (pY - startY - ftlObj.y)/8;


ftlObj.sP(ftlObj.x, ftlObj.y);

setTimeout("stayTopLeft()", 10);


ftlObj = ml("topbar");



if (window.addEventListener)

window.addEventListener("load", staticbar, false)

else if (window.attachEvent)

window.attachEvent("onload", staticbar)

else if (document.getElementById)



<div id="topbar">

<span style="float:left;padding-left:7px;">


<span style="float:right;padding-right:7px;">

<a href="" target="_self"><b>HOME</b></a>&nbsp;&nbsp;

<a href="" target="_self"><b>BIO</b></a>&nbsp;&nbsp;

<a href="" target="_self"><b>CONTACT ME</b></a>&nbsp;&nbsp;

<a href="" target="_self"><b>IHTSB</b></a>&nbsp;&nbsp;

<a href="" target="_self"><b>INTERVIEWS</b></a>&nbsp;&nbsp;

<a href="" target="_self"><b>PLAYLISTS</b></a>&nbsp;&nbsp;

<a href="" target="_self"><b>RADIO SHOWS</b></a>&nbsp;&nbsp;

<a href="" target="_self"><b>RESOURCES</b></a>&nbsp;&nbsp;


Photo of Randy


  • 643 Posts
  • 8 Reply Likes
  • confident there must be a way!

Posted 7 years ago

  • 1
Photo of Sanja

Sanja, Official Rep

  • 10698 Posts
  • 495 Reply Likes
Hello Randy,

The only thing that can go into your Site CSS are the CSS codes. So anything between the style tags can go in there.

Let us know if you have further questions!