where is the CSS
sjvrensburg
Registered Users Posts: 2 Beginner grinner
Hi there,
This is probably a stupid question, but how do I get to a place where I can view and change my site's CSS? I used to be able to this with the old SmugMug, you just navigated to some section of the customization options.
While I love the new SmugMug, I find that all the fonts are too small (even XL) and I want to change that via CSS / HTML.
Any help, whatsoever, would be greatly appreciated.
Stefan
This is probably a stupid question, but how do I get to a place where I can view and change my site's CSS? I used to be able to this with the old SmugMug, you just navigated to some section of the customization options.
While I love the new SmugMug, I find that all the fonts are too small (even XL) and I want to change that via CSS / HTML.
Any help, whatsoever, would be greatly appreciated.
Stefan
0
Comments
Go to any page and click customize > customize site.
In the right flyout you'll see "homepage", "entire site", "all folders" and "all galleries".
As you highlight each of these, out on the page will be a CSS block. If not you can add one.
So you can add CSS to apply to any level.
If you just want to customize a single page click "Make this .... Custom"
It will then have a CSS block for "Just this page". If you're adding blocks or editing existing blocks
make sure the correct area is highlighted on the right. Like "all galleries" or "Just this ..."
When I mention "page" above it could be a folder or gallery or page.
My Website index | My Blog
Though I know little, to place CSS code to effect your entire site: Click on Customize, then Customize Site... when there in the right hand panel at the top you'll see Entire Site, Homepage, All Folders, All Galleries. Click on Entire Site which will be all in Red. Above your footer you should see at the left side CSS APP Placeholder. Hover to turn red and then click on the wrench. Now you can place your CSS code to effect your entire site.
You must first drag a CSS block from the HTML section of content to the location where you want to place the CSS.
As Allen noted above, you can place CSS in many places. I have most of my CSS in my theme. Some folks have chosen to add a CSS block to Entire site and place it there. Others have CSS scattered throughout their sites.
--- Denise
Musings & ramblings at https://denisegoldberg.blogspot.com
filled with CSS from above (flow down?). I delete all that and only add in CSS that overrides the higher
level CSS. Not sure if this is the correct way but works for me.
My Website index | My Blog
Thanks everyone for helping out... Now lets see if I can remember how CSS works! :-P
Not sure what I'm doing wrong....
What code are you using? Is it the code from here - http://www.smugocity.com/CSS/Text-Replace/Custom-Right-Click-Protection?
--- Denise
Musings & ramblings at https://denisegoldberg.blogspot.com
That is the code I'm using, Denise. I thought I had it in the right place, but it doesn't seem to show up. Will it not work while in Preview mode, maybe?
I'm in the Entire Site tab, then I've selected the theme, advanced CSS and entered to code there. I put it after the CSS code I used to change "The Question" text on my Contact form. Should it go before that?
Here's what I have in my CSS:
/* Set the The Question text to your own wording */
.sm-contact-pro-form:before {
content: "Please type your question below.";
position: absolute;
top: 215px;
left: 200px;
}
/* Hack to hide the The Question */
.sm-contact-pro-form .sm-form-contents .sm-form-field-overhead:nth-child(4) label {
visibility: hidden;
}
.sm-right-click-message:after {
content: 'All images are © Alice A. Thompson. All rights reserved. Please contact me if you want to use this image.';
}
.sm-right-click-message .sm-tooltip-content {
display: none;
}
My Website index | My Blog
That was it, Allen! Thanks! I had forgotten that the Galleries are actually inside Folders. It was the Folders that didn't have the CSS. Once I added that to the theme on the Folders, it seems to be fine now. Thanks for your help!
Is there a way to get the custom message to "fade" off after a few seconds? I'm not sure what the CSS for that would be. I like the way the box looks (css below), but would like the message to fade away after it appears instead of making it remain visible (until the user clicks off of it).
.sm-tooltip.sm-right-click-message {
background-color: #fff;
border-radius: 7px;
border: 2px solid #00c4ff;
box-shadow: -4px 5px 10px #000;
color: #000;
padding: 10px;
}