Board index PBase HTML and Style Sheets Share your style sheets and/or HTML

HTML and Style Sheets

Share your style sheets and/or HTML

Customize your galleries.
wyk
 
Posts: 21

Share your style sheets and/or HTML

Post Sun Apr 26, 2020 1:36 am


I use a super simple stylesheet. I noticed when editing my stylesheet recently that there are not a whole lot of choices in the pbase menus. I thought I would create a thread where we could share our ideas on them since it would be a bit difficult for PBase to add all the versions I have seen on all these pages here. It might be easier to just place them in a thread.

To edit your stylesheet go to 'edit gallery'. Go down to 'stylesheets' and click edit. You'll see 'create a new stylesheet' and a place to name your new SS. Now, you can also choose to edit an existing stylesheet which will be renamed to what you chose when you save it. Like, say, if you want to keep the banner title type from the karen1109 sheet and simply modify the rest of it. I also suggest you visit: https://www.w3schools.com/css/ while we're all on lockdown and spend some time learning CSS. Any HTML and CSS you learn will always be useful, especially on PBASE. I wouldn't go too crazy with them, tho. You want your images to be the show, and the SS to be the production. I designed mine so the images pop out more.

Here's the one I use:

<setvar color1 = #e1eaea>
<setvar color2 = #524d37>
<setvar color3 = #906f5d>
<setvar color4 = #d5ae83>
<setvar color5 = #8FBC8F>
<setvar color6 = #204863>
<setvar color7 = #800000>


DIV,BODY,TD,TH,TR,TABLE,FONT,INPUT,LI,UL,FORM,
BLOCKQUOTE,P,B,I,H1,H2,H3,H4,H5,FONT {
font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
color : <getvar color1>;
background : <getvar color2>;
}


A:link { color : <getvar color3>}
A:active { color : <getvar color4>}
A:visited { color : <getvar color5>}
A:hover { color : <getvar color6>}

.caption {
font-size : 8pt;
color : <getvar color7>;
font-style : italic;
}
img {
border-radius: 9px;
}
img {
margin-right: 9px;
display: block;
float: left;
box-shadow: 12px 12px 6px #2b2921;
}

wyk
 
Posts: 21

Re: Share your style sheets and/or HTML

Post Sun Apr 26, 2020 1:50 am


Some tips for editing this stuff;

Always duplicate your web pages you are editing. Open two copies, edit one of them. This also means opening a copy of the editing page that has the CSS/HTML on it.
This way mistakes are easily fixed, and you can easily see the effect of the changes you have made by simply clicking on the gallery/web page you modified and then tabbing over to the last version you had on screen in another window. You can go back and forth easily to see the differences or if you broke something. If you are paranoid, you can copy your original code and place it somewhere else, or simply name your old SS 'oldcode0123' and save it.

If you need a code for colour, open a google window and type in 'hex color' or 'hex colour' and the colour picker should pop up.

If you want to change a colour ever so slightly, it's easy enough to just put the hex code in google and google will show you the picker with gradients of the color you searched for.

I also suggest you consult this page for color schemes: https://www.w3schools.com/colors/colors_schemes.asp

Want to play with HTML? I suggest: https://www.w3schools.com/html/default.asp

cprphotography
 
Posts: 14
Location: New York

Re: Share your style sheets and/or HTML

Post Fri May 22, 2020 9:49 pm


is neat, like . I don,t know coding is it possible to integrate paypal?

wyk
 
Posts: 21

Re: Share your style sheets and/or HTML

Post Sat Nov 13, 2021 4:37 pm


My most recent stylesheet:

<setvar color1 = #ffffff>
<setvar color9 = #fa8764>
<setvar color7 = #382f2a>
<setvar color4 = #edc598>
<setvar color2 = #877456>
<setvar color5 = #59a2d4>
<setvar color8 = #638082>
<setvar color3 = #474228>
<setvar color10 = #454033>
<setvar color6 = #5a8db0>
<setvar color11 = #2b2921>


/* WYK stylesheet */

DIV,BODY,TD,TH,TR,TABLE,FONT,INPUT,LI,UL,FORM,
BLOCKQUOTE,P,B,I,H1,H2,H3,H4,H5,FONT {
font-family: garamond, serif;
font-style: italic;
font-weight: 100;
font-variant: small-caps;
color : <getvar color1>;
background : <getvar color2> ;
font-stretch: ultra-expanded;
font-size: 20px
}


A:link { color : <getvar color3>}
A:active { color : <getvar color4>}
A:visited { color : <getvar color5>}
A:hover { color : <getvar color6>}

h2
{
font-style: oblique;
font-size: 20pt;
font-weight: regular;
text-align: left;
letter-spacing: -2px;
padding-top: 33px;
padding-bottom: 4px;
padding-left: 7px;
padding-right: 20px;
margin-left: 10px;
margin-right: 10px;
background-color: <getvar color8>;
color: <getvar color9>;

}
h2
{
border-radius: 3px;
}
h2
{
font-variant: small-caps;
}
h2
{
margin-top 10px
margin-right: 9px;
display: block;
float: left;
box-shadow: 4px 4px 2px <getvar color10>;
}
.caption {
font-size : 12pt;
color : <getvar color7>;
font-style : italic;
}
img {
border-radius: 1px;

}

img {
margin: 10px;
display: block;
float: top;
box-shadow: 7px 7px 6px <getvar color11>;
border: 5px solid #ffffff;
}

bbernstein
 
Posts: 5

Re: Share your style sheets and/or HTML

Post Thu Mar 31, 2022 1:31 am


Very helpful information, thanks. The original forum thread hasn’t been updated in years and the links are all stale. You’ve given me inspiration.


Board index PBase HTML and Style Sheets Share your style sheets and/or HTML

Who is online

Users browsing this forum: No registered users and 1 guest

cron