MGoBlog Stylish Theme for Widescreen folks.
MGoBlog is freakin' awesome but the contents look cramped and all the real estate in widescreen monitors are left to waste. The resulting page looks like this -
http://img145.imageshack.us/img145/291/widescreenrw9.jpg
And the comments are well indented.
http://img401.imageshack.us/img401/81/commentsindentft6.jpg
- Download the Stylish Firefox extension ( Theme only works in Firefox ). Go to https://addons.mozilla.org/en-US/firefox/addon/2108
- Restart Firefox and go to mgoblog.com Click on the Notebook icon in the lower right hand corner of your screen. Select Write Style->For mgoblog.com..
- Paste the following inside the curly braces ( { } )
#banner, #container, #headercontainer, #header-region-container, #footer-region-container, #suckerfish-container {
width: 1400px !important;
}
#page-right, #round-right {
width: 1400px !important;
}
#mainContent {
width: 980px !important;
padding-left: 10px !important;
padding-right: 10px !important;
}
#inside-content {
width: 1400px !important;
}
body {
font-family : Liberation Sans, sans-serif !important;
font-size : 16px !important;
}
.indented{
margin-left:50px !important;
}
.title{
font-family : Georgia, serif !important;
font-size : 32px !important;
}
- Give the description as "mgoblog widescreen" or something
- Profit!
( If you have a wider screen, change the 1400s and the 980 to whatever value which is good for your screen )
Here's another great addition to remove sigs:
div.user-signature{display:none;}
This is what I was trying, and it doesn't work:
div.site-logo{
background-image: url("http://bp3.blogger.com/_l4ZZFzs7VIs/SEjPTwaSp3I/AAAAAAAABDo/ep_9pW0F9kY…");
}
div.site-logo img{
visibility:hidden;}
You're right, it's because Blogger does not currently allow hotlinking of images. If someone would kindly host naked man photo on their web space, we could all have the naked man banner with the following code:
div.clear-block#headercontainer{background:url("[your site here]/tobias-hopp.jpg") no-repeat;
}
div.site-logo img{visibility:hidden;}
Just host off imageshack. Should be fine. My new banner code:
div.site-logo{
background-image: url("http://img55.imageshack.us/img55/9439/anthonytschernefq3.jpg") !important;
background-position: left top !important;
background-repeat: no-repeat !important;
}
div.site-logo img{
visibility:hidden !important;}
Comments