View Full Version : centering cover page
rhdesigns
Mar-11-2009, 05:37 AM
Hi
i am trying to center everything on my cover page so that everything is visible. I need help trying to relocate some of the images.
my website is
rhdesigns95s.smugmug.com
thanks
ryan
Allen
Mar-11-2009, 06:02 AM
Hi
i am trying to center everything on my cover page so that everything is visible. I need help trying to relocate some of the images.
my website is
rhdesigns95s.smugmug.com
thanks
ryan
Put all that in your biobox and it'll only show on the homepage. Then center
the biobox contents.
What "some images"?
rhdesigns
Mar-11-2009, 08:34 AM
what do i have to put into my bio box? both the css and header information?How would i enter it? Here is what i have for it:
custom header box
Code:
<div id="my_banner"></div><div id="navcontainer"><ul><li><a href="/galleries"><img src="/photos/487640078_eGY43-S.png" border="0"></a></li><li><a href="/gallery/7230743_Zptf5"><img src="/photos/487640102_SpFHV-S.png" border="0"></a></li><li><a href="/gallery/7230650_Nj9Kf"><img src="/photos/487640095_4ZWX5-S.png" border="0"></a></li><li><a href="/gallery/7208788_EsEDP"><img src="/photos/487640092_tdsLh-S.png" border="0"></a></li><li><a href="/gallery/7208889_ZvZn6"><img src="/photos/487640098_oL3Rj-S.png" border="0"></a></li><li><a href="/gallery/7230666_DRLU3"><img src="/photos/487640080_T4MUN-S.png" border="0"></a></li></ul></div><div id="myquote"><img src="/photos/488154167_UKHu7-M.jpg"border="0"></div> <div id="myflag"><img src="/photos/488447533_rqh8d-M.gif"border="0"></div> <div id="myflag2"><img src="/photos/488447533_rqh8d-M.gif"border="0"></div> <div id="my95s"><img src="photos/488151176_CmKyG-M.jpg"border="0"></div> <div id="mylogo"><img src="/photos/485635442_mhqG6-M.jpg"border="0"></div> <div id="enterbutton"><a href="http://rhdesigns95s.smugmug.com/galleries"><img border="0" src="/photos/488151172_otMgi-M.gif"></a></div>
CSS Box:
Code:
/*=====Enter Page=====*/.homepage #bioBox,.homepage #my_banner,.homepage #navcontainer{display:none ;}.galleries #my_banner,.galleries #navcontainer{display:block;}.galleries #myflag2,.galleries #myflag,.galleries #mylogo,.galleries #my95s,.galleries #myquote,.galleries #enterbutton{display:none !important;}.homepage #myflag2,.homepage #myflag,.homepage #mylogo,.homepage #my95s,.homepage #myquote,.homepage #enterbutton{display:block;}
Allen
Mar-11-2009, 10:24 AM
what do i have to put into my bio box? both the css and header information?How would i enter it? Here is what i have for it:
custom header box
Code:
<div id="my_banner"></div><div id="navcontainer"><ul><li><a href="/galleries"><img src="/photos/487640078_eGY43-S.png" border="0"></a></li><li><a href="/gallery/7230743_Zptf5"><img src="/photos/487640102_SpFHV-S.png" border="0"></a></li><li><a href="/gallery/7230650_Nj9Kf"><img src="/photos/487640095_4ZWX5-S.png" border="0"></a></li><li><a href="/gallery/7208788_EsEDP"><img src="/photos/487640092_tdsLh-S.png" border="0"></a></li><li><a href="/gallery/7208889_ZvZn6"><img src="/photos/487640098_oL3Rj-S.png" border="0"></a></li><li><a href="/gallery/7230666_DRLU3"><img src="/photos/487640080_T4MUN-S.png" border="0"></a></li></ul></div>
<div id="myquote"><img src="/photos/488154167_UKHu7-M.jpg"border="0"></div> <div id="myflag"><img src="/photos/488447533_rqh8d-M.gif"border="0"></div> <div id="myflag2"><img src="/photos/488447533_rqh8d-M.gif"border="0"></div> <div id="my95s"><img src="photos/488151176_CmKyG-M.jpg"border="0"></div> <div id="mylogo"><img src="/photos/485635442_mhqG6-M.jpg"border="0"></div> <div id="enterbutton"><a href="http://rhdesigns95s.smugmug.com/galleries"><img border="0" src="/photos/488151172_otMgi-M.gif"></a></div>
CSS Box:
Code:
/*=====Enter Page=====*/.homepage #bioBox,.homepage #my_banner,.homepage #navcontainer{display:none ;}.galleries #my_banner,.galleries #navcontainer{display:block;}.galleries #myflag2,.galleries #myflag,.galleries #mylogo,.galleries #my95s,.galleries #myquote,.galleries #enterbutton{display:none !important;}.homepage #myflag2,.homepage #myflag,.homepage #mylogo,.homepage #my95s,.homepage #myquote,.homepage #enterbutton{display:block;}
Those divs from your header html can be put in your biobox like this.
<html>
<div id="myquote">
<img src="/photos/488154167_UKHu7-M.jpg"border="0">
</div>
<div id="myflag"><img src="/photos/488447533_rqh8d-M.gif"border="0"></div>
<div id="myflag2"><img src="/photos/488447533_rqh8d-M.gif"border="0"></div>
<div id="my95s"><img src="/photos/488151176_CmKyG-M.jpg"border="0"></div>
<div id="mylogo"><img src="/photos/485635442_mhqG6-M.jpg"border="0"></div>
<div id="enterbutton">
<a href="/galleries"><img border="0" src="/photos/488151172_otMgi-M.gif">
</a>
</div>
</html>
Formatting the biobox
/*====Position Enter Page====*/
#myflag {
float: left;
position: relative;
left: 60px;
}
#myflag2 {
float: right;
position: relative;
left: -60px;
}
#myquote {
margin: 40px auto;
}
#mylogo {
margin: 40px auto;
}
#my95s {} /* not needed at this time */
#enterbutton {} /* not needed at this time */
#bioBox {
display: block !important;
background: none;
text-align: center;
}
All this would not be needed
.galleries #myflag2,
.galleries #myflag,
.galleries #mylogo,
.galleries #my95s,
.galleries #myquote,
.galleries #enterbutton
{display:none !important;}
.homepage #myflag2,
.homepage #myflag,
.homepage #mylogo,
.homepage #my95s,
.homepage #myquote,
.homepage #enterbutton
{display:block;}
rhdesigns
Mar-11-2009, 10:39 AM
i posted those two sets of codes in the bio box.
how can i add my slideshow back to the home page, the code was in the bio box.
Allen
Mar-11-2009, 10:54 AM
i posted those two sets of codes in the bio box.
how can i add my slideshow back to the home page, the code was in the bio box.
You had the show hidden so figured you didn't want it. You can add the show
script also to the bio, Just keep it all surrounded by the html tags.
rhdesigns
Mar-11-2009, 11:49 AM
so if i want to have a cover page, and then a slideshow on the homepage after the cover, i would add this code to the bio box?
or is there more to it or am i putting in the wrong place?
<html>
********>
var ssConfig = {
AlbumID: '7167639',
newWindow: 'false',
transparent: 'true',
splash: 'http://www.smugmug.com/img/ria/ShizamSlides/smugmug_black.png',
showLogo: 'false',
clickUrl: 'http://www.smugmug.com',
showThumbs: 'false',
showButtons: 'true',
borderThickness: '20',
borderColor: 'ffffff',
crossFadeSpeed: '350'
};
SM.flash.insertSlideshow(600, 600, ssConfig, 'transparent');
</********
</html>
Allen
Mar-11-2009, 02:17 PM
so if i want to have a cover page, and then a slideshow on the homepage after the cover, i would add this code to the bio box?
or is there more to it or am i putting in the wrong place?
...
This is you homepage
http://rhdesigns95s.smugmug.com/
This is a duplicate of our homepage called galleries.
http://rhdesigns95s.smugmug.com/
Both have all the same boxes and CSS can toggle on/off what's on each.
Try this.
Change your bio to this.
<html>
<div id="HPOnlyStuff">
<div id="myquote">
<img src="/photos/488154167_UKHu7-M.jpg"border="0">
</div>
<div id="myflag"><img src="/photos/488447533_rqh8d-M.gif"border="0"></div>
<div id="myflag2"><img src="/photos/488447533_rqh8d-M.gif"border="0"></div>
<div id="my95s"><img src="/photos/488151176_CmKyG-M.jpg"border="0"></div>
<div id="mylogo"><img src="/photos/485635442_mhqG6-M.jpg"border="0"></div>
<div id="enterbutton">
<a href="/galleries"><img border="0" src="/photos/488151172_otMgi-M.gif">
</a>
</div>
</div> <!-- closes HPOnlyStuff -->
<script>
var ssConfig = {
AlbumID: '7167639',
newWindow: 'false',
transparent: 'true',
splash: 'http://www.smugmug.com/img/ria/ShizamSlides/smugmug_black.png',
showLogo: 'false',
clickUrl: '/gallery/7230666_DRLU3',
showThumbs: 'false',
showButtons: 'true',
borderThickness: '20',
borderColor: 'ffffff',
crossFadeSpeed: '350'
};
if (YD.hasClass(document.body,'galleries') && !YD.hasClass(document.body,'homepage')) {
SM.flash.insertSlideshow(600, 600, ssConfig, 'transparent');
}
</script>
</html>
Add this to your CSS
.galleries #HPOnlyStuff {display:none;}
Remove the red from your CSS
#homepage#bioBox .boxTop {display:none;}
#bioBox{background: none;}
.galleries #bioBox {display: none;}
.homepage #bioBox,
.homepage #my_banner,
.homepage #navcontainer
{display:none ;}
vBulletin® v3.8.5, Copyright ©2000-2012, Jelsoft Enterprises Ltd.