I got rid of the smugmug logo on top left and replaced with my text logo. If clicked it links back to my homepage. When I tried to ad the navbar css info and the html info I only get 3 lines on top left by the search box. Also, my text logo no longer links to my homepage but links to smugmug homepage. I have removed the navbar changes until I get an answer.
Ideally, I would like a navbar that has a link to the my Gallery homepage (theelegantwindow.smugmug.com) and another link that will link back to my website (www.elegant-window.com (http://www.elegant-window.com)). Can this be done?
Thank you for any assistance.
Amy
Welcome to Dgrin :wave
Remove this javascript from your CSS and put in your footer javascript.
function delHover() {
oLst = YD.getElementsBy(function(el) {return (YD.hasClass(el,'imgBorder') || YD.hasClass(el,'imgBorderOn'))},'img');
for (i=0; i < oLst.length ; i++) {
if (oLst[i].title && oLst[i].title != '') oLst[i].title = '';
if (oLst[i].alt && oLst[i].alt != '') oLst[i].alt = '';
}
}
YE.onContentReady('bodyWrapper', function() {if (!YD.hasClass(document.body, 'smugmug_ajax')) delHover()});
onPhotoShow.subscribe(function(){YE.onAvailable('m ainImage', delHover)});
/* turn off the cart link on the minifooter */
.cartlink_footer {
display: none;
}
// fix the pesky pipes
YE.onAvailable("cobrand_footer", function() {this.innerHTML = this.innerHTML.replace(/\||what are feeds\?/gi, '');});
Change the height in this to 50px, the bottom of your logo is being clipped off.
.smuglogo {
width: 200px !important;
height: 50px !important;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (enabled=true,
sizingMethod=image src='http://www.smugmug.com/photos/399528904_KTvs6-M.png') !important;
}
This will get you a nav lined up under your search box.
Add this to your header box, not head tag or javascript.
<div id="navcontainer">
<ul>
<li><a href="/">Home</a></li>
<li><a href="http://www.elegant-window.com/">My Other Site</a></li>
</ul>
</div>
Change your navcontainer CSS to this. Changes highlighted in bold.
#navcontainer {
position: relative;
margin: 0 auto;
width: 200px;
left: 257px;
}
#navcontainer ul {
margin: 0;
padding: 0;
list-style-type: none;
text-align: center;
}
#navcontainer ul li {
display: inline;
}
#navcontainer ul li a {
text-decoration: none;
padding: .2em 1em;
color: #fff;
background: none;
font-size: 120%;
}
#navcontainer ul li a:hover {
color: #ccc;
background: none;
}