logo placement

Permalink Browser Info Environment
How could I adjust the logo (sitewide) to the top of the page? Also, how could I add a gradient image to top area instead of solid color?

Type: Discussion
Status: New
SiteQwester
View Replies:
gumptech replied on at Permalink Reply
gumptech
SQ, You must do it in css.
packages/theme_silence/themes/silence/styles.css

I made an override folder/file in the public_html root css folder. So updates don't kill my changes
css/silence/styles.css

I copied line 205 in silence's main styles.css and pasted into the new override styles.css
Here is what I have with my /*notes*/ so I remember what it is for and what I've done. Seb's styles.css does not have the post-it notes. :)
I also added the margin-right and padding-left
So if you want to use mine you can remove all /*bla bla bla*/ notes
and copy to you new override styles.css.


/*the padding-top changes the padding of logo to top of screen -line205 from main styles*/
#logo {
height:100px; /* orig 145px set to100*/
padding-top:35px; /* orig 50px set to 15, to35 7-8-13*/
margin-right: 20px; /* this gives room to move logo right, moves nav over, without this nav drops*/
padding-left: 15px; /* this moves logo to right*/
}

Here is the styles.css area to change
#logo {
  height:145px;
  padding-top:50px;
SiteQwester replied on at Permalink Reply
SiteQwester
gumptech, you're awesome! Thanks for your response. All worked well except the override stuff...
I made the root/css/silence/style.css file but it doesn't effect the final outcome, is there a "switch" somewhere that tells C5 to override the original theme's css ???

I too do not want updates to wipe out my changes.

Thanks again, Mike
gumptech replied on at Permalink Reply 1 Attachment
gumptech
Mike if I read your post right... you don't make make a folder called root or css. Root is a reference term to the directories (folders) and files right under your www or public html i.e. root of c drive on computer is all folders/files directly below c-drive.
You will find a folder already named css there, it's blank by default. Make a folder in there called silence and then place a blank styles.css file in there, then insert the css.
See my attachment for files.

If you paste below in the new blank styles.css it overrides themes default css.
You can adjust px, click save (if you have file manager in cpanel) and keep testing until you get it the way you want. Good thing is you don't have to mess with the original styles.css.
Don't forget the } on the end down there, I have left it out in copy/paste.... doesn't work ;)

#logo {
height:100px;
padding-top:35px;
margin-right: 20px;
padding-left: 15px;
}
SiteQwester replied on at Permalink Reply
SiteQwester
I've got the folders as... -root- /css/silence/style.css in the same location as:
blocks
concrete
config
controllers
css

I've also tried both style.css and styles.css (I think it's style.css)
to no avail. My custom css is:
#logo {
   height:145px;
   padding-top:0px; /* orig 50px*/
   margin-top:-40px; /* orig blank*/
    }

which works great in -root- /packages/theme_silence/themes/silence/style.css

~Sorry to be such a nuisance... any other ideas?
gumptech replied on at Permalink Reply
gumptech
To change the the top you would go to Silence's CP (control panel) Backgrounds -Page Background -Custom Pattern
Then upload a gradient you've made in .PNG. The height needs to match what you have the Top page color height slider's > px < set to in the above CP.

So make a linear gradient in .png ...say 250px tall and 50px wide (50x250).
The narrow 50px png will tile from left to right on the top.
If your image has variations in the horizontal pattern the tile effect may not work, because of mismatch or a faint line.
It may take some experimenting.

concrete5 Environment Information

Browser User-Agent String

Hide Post Content

This will replace the post content with the message: "Content has been removed by an Administrator"

Hide Content

Request Refund

You have not specified a license for this support ticket. You must have a valid license assigned to a support ticket to request a refund.