PDA

View Full Version : Help with smug mug site

wolfie
Mar-25-2010, 12:58 PM
Help, Please! I am trying to update my site and I am having some difficulties.

http://kidsinactionphotography.smugmug.com/

1)navigation bar- would like to change color from blue to match orange already on site AND it needs to drop down a bit and not be smack against banner
2)slide show needs to be centered and gray box around it gone
3)can I make a different border around slide show pics like drop shadow, etc??

I have tried reading the tutorials but this is as far as I got.

Can anyone walk me through this?

Thanks in advance!
J Allen
Mar-25-2010, 02:57 PM
See if you like this....


Change your custom header box to this:





<div id="my-header">
<div id="my_banner"> </div>
<div id="navcontainer">
<ul>
<li><a href="/">Home</a></li>
<li><a href="/Other/Portfolio/5457222">Portfolio</a></li>
<li><a href="/2009-2010-SPORTS">Galleries</a></li>
<li><a href="/Other/Contact/11615980_dsvbA">Contact</a></li>
</ul>
</div>
</div>









Change your CSS box to this:








/*===== Banner =====*/
#my_banner
{width: 750px;height: 150px;margin: 0 auto;
background: url(/photos/282916168_3VqHj-O.jpg) no-repeat;}






/*===== Nav-Bar =====*/

#navcontainer ul
{list-style-type:none;
text-align:center;
margin:5px auto;
padding:3px;}

#navcontainer ul li
{display:inline;}

#navcontainer ul li a
{text-decoration:none;
color:#fff;
background-color:#F68C1C;
font-size:130%;
padding:.2em 1.2em;}

#navcontainer ul li a:hover
{text-decoration:underline overline;}






/*==== Homepage ====*/
#homepage {padding-top:0;}
.homepage #breadcrumb,
#bioBox .photo
{display:none;}

#userBio {padding:0;}
#userBio {text-align:center!important;}






/*===== Remove Theme Border =====*/
.galleryPage,.boxBottom,
.boxTop,.box
{border:none !important;}






/*===== Remove Theme Background =====*/
.boxBottom,.boxTop,.box
{background:none !important;}




/*===== Header =====*/
#my-header
{width:750px;margin:auto;
background-color:#F68C1C;}








#stylebar {margin-right: 15px !important;}



/* FILMSTRIP VIEWING STYLE */

.filmstrip #sizePicker {display: none;}
.filmstrip #albumNav_bottom {display: none;} .filmstrip #albumNav_top .nav {color: #aaa; font-size:10px; font-family:
Verdana, Arial, Helvetica, sans-serif;}
.filmstrip #albumNav_top .title {color: #aaa; font-size:10px; font-family:
Verdana, Arial, Helvetica, sans-serif;}
.filmstrip .play_slideshow {display: none;}

/* LINES */

.top_border {border-top: none;}
.bottom_border {border-bottom: none;}
.right_border {border-right: none;}
.left_border {border-left: none;}
.journal_entry {border-bottom: none;}

.gallery_11615980 #breadcrumb {display: none;}
.loggedIn .gallery_11615980 #breadcrumb {display: block;}

/* hides no photos text site wide */
.notLoggedIn .nophotos {display: none;}










Add this line to your bio-box slideshow script:



<html>

<script>
var ssConfig = {
AlbumID: '11619003',
imgAlign: 'top',
newWindow: 'false',
transparent: 'true',
splash: 'http://www.smugmug.com/img/ria/ShizamSlides/smugmug_black.png',
showLogo: 'false',
clickToImage: 'true',
showThumbs: 'false',
showButtons: 'true',
crossFadeSpeed: '350',
borderThickness: '8',
borderColor: 'ffffff'
};

SM.flash.insertSlideshow(600, 600, ssConfig, 'transparent');
</script>


</html>







:ear
wolfie
Mar-25-2010, 04:24 PM
Okay, this is great and we are almost there but it got rid of my banner....also that smug mug logo still appears when you first go on the site....any suggestions?








See if you like this....


Change your custom header box to this:





<div id="my-header">
<div id="my_banner"> </div>
<div id="navcontainer">
<ul>
<li><a href="/">Home</a></li>
<li><a href="/Other/Portfolio/5457222">Portfolio</a></li>
<li><a href="/2009-2010-SPORTS">Galleries</a></li>
<li><a href="/Other/Contact/11615980_dsvbA">Contact</a></li>
</ul>
</div>
</div>









Change your CSS box to this:








/*===== Banner =====*/
#my_banner
{width: 750px;height: 150px;margin: 0 auto;
background: url(/photos/282916168_3VqHj-O.jpg) no-repeat;}






/*===== Nav-Bar =====*/

#navcontainer ul
{list-style-type:none;
text-align:center;
margin:5px auto;
padding:3px;}

#navcontainer ul li
{display:inline;}

#navcontainer ul li a
{text-decoration:none;
color:#fff;
background-color:#F68C1C;
font-size:130%;
padding:.2em 1.2em;}

#navcontainer ul li a:hover
{text-decoration:underline overline;}






/*==== Homepage ====*/
#homepage {padding-top:0;}
.homepage #breadcrumb,
#bioBox .photo
{display:none;}

#userBio {padding:0;}
#userBio {text-align:center!important;}






/*===== Remove Theme Border =====*/
.galleryPage,.boxBottom,
.boxTop,.box
{border:none !important;}






/*===== Remove Theme Background =====*/
.boxBottom,.boxTop,.box
{background:none !important;}




/*===== Header =====*/
#my-header
{width:750px;margin:auto;
background-color:#F68C1C;}








#stylebar {margin-right: 15px !important;}



/* FILMSTRIP VIEWING STYLE */

.filmstrip #sizePicker {display: none;}
.filmstrip #albumNav_bottom {display: none;} .filmstrip #albumNav_top .nav {color: #aaa; font-size:10px; font-family:
Verdana, Arial, Helvetica, sans-serif;}
.filmstrip #albumNav_top .title {color: #aaa; font-size:10px; font-family:
Verdana, Arial, Helvetica, sans-serif;}
.filmstrip .play_slideshow {display: none;}

/* LINES */

.top_border {border-top: none;}
.bottom_border {border-bottom: none;}
.right_border {border-right: none;}
.left_border {border-left: none;}
.journal_entry {border-bottom: none;}

.gallery_11615980 #breadcrumb {display: none;}
.loggedIn .gallery_11615980 #breadcrumb {display: block;}

/* hides no photos text site wide */
.notLoggedIn .nophotos {display: none;}










Add this line to your bio-box slideshow script:



<html>

<script>
var ssConfig = {
AlbumID: '11619003',
imgAlign: 'top',
newWindow: 'false',
transparent: 'true',
splash: 'http://www.smugmug.com/img/ria/ShizamSlides/smugmug_black.png',
showLogo: 'false',
clickToImage: 'true',
showThumbs: 'false',
showButtons: 'true',
crossFadeSpeed: '350',
borderThickness: '8',
borderColor: 'ffffff'
};

SM.flash.insertSlideshow(600, 600, ssConfig, 'transparent');
</script>


</html>







:ear
wolfie
Mar-25-2010, 04:34 PM
Well I figured out what I did wrong and got the banner back but the smugmug logo still is there and I don't know how to reduce the space between the photos and footer. THanks so much for your help!! THis is exciting.
J Allen
Mar-25-2010, 05:35 PM
Well I figured out what I did wrong and got the banner back but the smugmug logo still is there and I don't know how to reduce the space between the photos and footer. THanks so much for your help!! THis is exciting.


Where exactly are you seeing the SM logo at?
J Allen
Mar-25-2010, 05:40 PM
Try this also in your CSS box...it'll turn the background color a jet black, to help blend your banner in more:





body {background-color:#000000 !important;}








Also, for your wufoo form, you can turn that into a black so it blends in a little nicer with your site, by going to your wufoo account and opening the theme editor and changing setting there.
wolfie
Mar-25-2010, 05:40 PM
before the photos load it comes up on the home page and once the photos are there it goes away. Is that standard?
J Allen
Mar-25-2010, 07:46 PM
before the photos load it comes up on the home page and once the photos are there it goes away. Is that standard?


Remove this line from your bio-box :




<script>
var ssConfig = {
AlbumID: '11619003',
imgAlign: 'top',
newWindow: 'false',
transparent: 'true',
splash: 'http://www.smugmug.com/img/ria/ShizamSlides/smugmug_black.png',
showLogo: 'false',
clickToImage: 'true',
showThumbs: 'false',
showButtons: 'true',
crossFadeSpeed: '350',
borderThickness: '8',
borderColor: 'ffffff'
};

SM.flash.insertSlideshow(600, 600, ssConfig, 'transparent');
</script>
wolfie
Mar-26-2010, 02:23 AM
GREAT!! Thanks so much! I embedded my blog on the site but do you know if there is anyway to get rid of this which appears at the top:

kidsinactionphotography > Blog > My Blog

AND the header for the blog page itself????

Follow Share Report Abuse Next Blog» wolfx4@comcast.net New Post Customize Sign Out
J Allen
Mar-26-2010, 02:34 AM
GREAT!! Thanks so much! I embedded my blog on the site but do you know if there is anyway to get rid of this which appears at the top:

kidsinactionphotography > Blog > My Blog

AND the header for the blog page itself????

Follow Share Report Abuse Next Blog» wolfx4@comcast.net New Post Customize Sign Out


See if you can follow this thread...I think you'll like the outcome better for your blog page:


http://www.dgrin.com/showthread.php?t=101262
wolfie
Mar-26-2010, 06:35 AM
Joe,
THanks so much for all of your help. One more question if you don't mind....how do I speed up the slide show on the home page???
J Allen
Mar-26-2010, 12:15 PM
Joe,
THanks so much for all of your help. One more question if you don't mind....how do I speed up the slide show on the home page???






Try adding this line to your bio-box SS:






<script>
var ssConfig = {
AlbumID: '11619003',
imgAlign: 'center',
setSpeed: 'fast',
newWindow: 'false',
transparent: 'true',
showLogo: 'false',
clickToImage: 'true',
showThumbs: 'false',
showButtons: 'true',
crossFadeSpeed: '350',
borderThickness: '6',
borderColor: 'ffffff'

};

SM.flash.insertSlideshow(600, 600, ssConfig, 'transparent');
</script>




You can use slow/med/fast...more info HERE (http://wiki.smugmug.net/display/SmugMug/Flash+Slideshow)