View Full Version : I Need Some Step by Step Instruction
RustingInPeace
Jul-31-2007, 02:15 PM
OK, I have my banner, nav bar and slideshow pretty much the way I want them (thanks to everybody that helped).
Now I want to set up some other pages. I really like the layout of http://www.moonriverphotography.com/. I would like to set up a few pages:
A page for Art Prints (a page with several galleries)
A page for client proofs (galleries for each client)
A text page where I can detail my services and fee structure
A Bio pageRight now if you click on my portfolio button it takes you into 1 gallery. It would be nice if I could have a page that had several galleries to cover diverse subject matter. Also right now when you go to that page it also displays my slideshow from the home page. I would rather it only show up on the main page.
I guess I am not really trying to reinvent the wheel here. I just can't seem to locate any step by step instructions. If someone could point to the right place I would be very appreciative.
Sincerely,
Chris
Allen
Jul-31-2007, 02:38 PM
... click on my portfolio button it takes you into 1 gallery. It would be nice if I could have a page that had several galleries to cover diverse subject matter. Also right now when you go to that page it also displays my slideshow from the home page. I would rather it only show up on the main page....
First lets get your show on the right pages.
Add the bold below, the second one exists so just edit to add the bold.
#mySlideshow {
display: none;}
.homepage #mySlideshow {
display: block;
margin: 0 auto;
width: 700px;
height: 500px;
background: #333;
border: 8px ridge #ccc;
}
Allen
Jul-31-2007, 02:57 PM
...
A text page where I can detail my services and fee structure
A Bio page... For both of these pages create a new gallery for each and make them private. Supply a
link back here to each gallery. The info, text and graphics/photos can then be put in the
gallery description using html. To start, create the info and put in each gallery
description. Then we can see it and using html format it. If you want any photos/images in
there just add (photo #1 here) in the text and provide a link to the photo. This page (http://allen-steve.smugmug.com/gallery/2320726) basically
describes how it will be done.
I would suggest that you create a category called something like "site stuff"
and add these new galleries under that. Same with your banner and any
misc. images you're using that so they will not be exposed to anyone thru
browsing. All the galleries will be private and then won't show.
Allen
Jul-31-2007, 03:06 PM
...
A page for Art Prints (a page with several galleries)
A page for client proofs (galleries for each client)...
I would create a category for both of these. Then your nav link would go to a page with the galleries and/or sub-cats. You could create sub-categories under each to further divide the types of photos.
Art Prints
gallery 1
gallery 2
Client Proofs
Weddings
Smith's
Jones
Portraits
Smith's
Jones
Is this something that you'd like to try?
RustingInPeace
Jul-31-2007, 03:14 PM
For both of these pages create a new gallery for each and make them private. Supply a
link back here to each gallery. The info, text and graphics/photos can then be put in the
gallery description using html. To start, create the info and put in each gallery
description. Then we can see it and using html format it. If you want any photos/images in
there just add (photo #1 here) in the text and provide a link to the photo. This page (http://allen-steve.smugmug.com/gallery/2320726) basically
describes how it will be done.
I would suggest that you create a category called something like "site stuff"
and add these new galleries under that. Same with your banner and any
misc. images you're using that so they will not be exposed to anyone thru
browsing. All the galleries will be private and then won't show.
Thanks, you're a lifesaver or at least sanity saver.
RustingInPeace
Jul-31-2007, 09:33 PM
I would create a category for both of these. Then your nav link would go to a page with the galleries and/or sub-cats. You could create sub-categories under each to further divide the types of photos.
Art Prints
gallery 1
gallery 2
Client Proofs
Weddings
Smith's
Jones
Portraits
Smith's
Jones
Is this something that you'd like to try?
OK. I think I have most of it. Somehow I have got all of the text increased in size and in a font I don't like. It seems to be being applied to all pages except the homepage. I am unsure of where to look for the offending code.
Allen
Jul-31-2007, 10:11 PM
OK. I think I have most of it. Somehow I have got all of the text increased in size and in a font I don't like. It seems to be being applied to all pages except the homepage. I am unsure of where to look for the offending code.
In your header code remover the red. The h1 is changing all your fonts.
<br>
<br>
<h1 align="center"><div id="mySlideshow"></div>
<br>
<br>
Add the red here in CSS to get add a gap between show and navbar.
.homepage #mySlideshow {
display: block;
margin: 0 auto;
margin-top: 20px;
width: 700px;
height: 500px;
background: #333;
border: 8px ridge #ccc;
}
Check back here later, have a few more changes for you.
Allen
Jul-31-2007, 10:28 PM
Add this to your CSS, it formats your about me gallery.
/* START about me gallery */
.gallery_3238999 #galDescImg {
position: relative;
height: 300px;
width: 195px;
margin-top: 20px;
margin-left: 60px;
border:4px double #cccccc;
}
.gallery_3238999 #galDescText {
position: relative;
font-size: 1.2em;
font-weight: bold;
color: #ccc;
text-align: justify;
width: 340px;
margin-top: -310px;
margin-left: 320px;
}
/* remove stuff for clean page look */
.gallery_3238999 #breadcrumb {display: none;}
.gallery_3238999 .journal_entry {display:none;}
.gallery_3238999 #albumNav_top {display: none;}
.gallery_3238999 #albumNav_bottom {display: none;}
.gallery_3238999 .play_slideshow {display: none;}
/* END about me gallery */
Here's an option for ya. makes some nice navbar buttons. Change red.
#navcontainer ul li a {
text-decoration: none;
padding: .2em 1em;
color: #fff;
background-color: #666;
border: 2px ridge #ccc;
}
#navcontainer ul li a:hover {
color: #fff;
background-color: #444;
}
This will change the green border of your comments button.
Add this to your CSS.
.smbuttons {border-color: #ccc;}
Allen
Jul-31-2007, 10:32 PM
Add these to your CSS to remove Christopher Clark (C2-Photo)'s home
from below your slideshow.
/* hides your name (including any 's) */
#userName {display: none;}
/* hides the word home */
#userHome {display: none;}
RustingInPeace
Aug-01-2007, 08:59 AM
Add these to your CSS to remove Christopher Clark (C2-Photo)'s home
from below your slideshow.
/* hides your name (including any 's) */
#userName {display: none;}
/* hides the word home */
#userHome {display: none;}
Again MANY thanks for all of your help!
I did have one question. When I removed the h1 align=center code my slide show moved off center in the frame. What do I need to add back to get the pictures recentered in the frame?
Allen
Aug-01-2007, 09:04 AM
Again MANY thanks for all of your help!
I did have one question. When I removed the h1 align=center code my slide show moved off center in the frame. What do I need to add back to get the pictures recentered in the frame?
Add the bold in your CSS to center show.
.homepage #mySlideshow {
text-align: center;
display: block;
margin: 0 auto;
margin-top: 20px;
width: 700px;
height: 500px;
background: #333;
border: 8px ridge #ccc;
}
Did you see this is a previous post? It pretties up your nav buttons.
#navcontainer ul li a {
text-decoration: none;
padding: .2em 1em;
color: #fff;
background-color: #666;
border: 2px ridge #ccc;
}
#navcontainer ul li a:hover {
color: #fff;
background-color: #444;
}
RustingInPeace
Aug-01-2007, 10:06 AM
:D I got it re-centered.
RustingInPeace
Aug-01-2007, 10:07 AM
Add the bold in your CSS to center show.
.homepage #mySlideshow {
text-align: center;
display: block;
margin: 0 auto;
margin-top: 20px;
width: 700px;
height: 500px;
background: #333;
border: 8px ridge #ccc;
}
Did you see this is a previous post? It pretties up your nav buttons.
#navcontainer ul li a {
text-decoration: none;
padding: .2em 1em;
color: #fff;
background-color: #666;
border: 2px ridge #ccc;
}
#navcontainer ul li a:hover {
color: #fff;
background-color: #444;
}
:D :D :D YOU THE MAN
vBulletin® v3.8.5, Copyright ©2000-2012, Jelsoft Enterprises Ltd.