bloggish: twitter

[mightystache]

Not sure if anyone would be interested in this other than myself, but it's just something I whipped up for RPing and random fun so I thought I'd share.



(static and live preview available within)



Twitter







Preview
Friends EntriesIT'S ALIVE! (opens in new window)

SPOTLIGHTTitle: Twitter
Style S2 Bloggish
Compatability: Tested on Firefox and IE.
Features: Functioning link, tag and userpic modules.
Disabled: Entry title, metadata, user icon, privacy indicator, calendar, page summary and syndicate modules.

The Pseudointellectual's GuideTHE BASIC

1. Customise Journal » Style System: S2. Save.
   
2. Look and Feel » Layout: Bloggish. Theme: None. Save.
   
3. Custom Options » Layout Type: Two Columns (Sidebar Right). Base Weblog: Yes. Custom Stylesheet: Copy and Paste the Following Code. Save.
   

(RIGHT-CLICK » SELECT ALL » COPY)/* 'TWITTER' by ~poirot@ij */
/* Designed for S2 Bloggish, Two Column (Sidebar Right) */

/* body */

body {
font-family: 'Lucida Grande', helvetica, arial, sans-serif;
font-size: 12px;
}

a { color: #066db2; text-decoration: none; text-decoration:none; font-weight:normal; }
a:visited { color: #066db2; }
a:hover { color: #066db2; text-decoration:underline; }

h1, h2, h3, h4, h5, h6 {
font-family: 'Lucida Grande', helvetica, arial, sans-serif;
}

blockquote {
background:transparent;
padding:20px;
color:#444;
border-left:9px solid #066db2;
text-align:justify;
}

textarea {
background:transparent;
padding:20px;
color:#444;
border:1px dotted #066db2;
text-align:justify;
}

.entry ul
{
list-style-type: none;
padding: 0px;
margin: 0px;
}
.entry li
{
list-style-type: none;
background-image: url(insertimagehere); /* bullet.png */
background-repeat: no-repeat;
background-position: 0px 5px;
padding-left:10px;
line-height:13px;
}

/* page layout */

body {
min-width: 800px;
color: #000;
background: #DDEEF6 url(insertimagehere) center center no-repeat; /* YOUR BACKGROUND OF CHOICE */
background-attachment:fixed;
}

#container {
width: 800px;
background:transparent;
margin:0 auto;
}

#container-inner {
margin:0;
padding:20px;
}

#container, #container-inner, #pagebody, #pagebody-inner { display:block; position:relative; }

/* header */

#banner {
width:600px;
height:55px;
background:#f7f7f7;
padding:5px 10px;
-moz-border-radius: 7px;
overflow:visible;
z-index:2000;
}
#banner-inner {

}

#banner-header {
position:absolute;
top:90px;
left:105px;
color: #000;
font-size: 26pt;
font-weight: bold;
text-align:left;
z-index:3000;
}

#banner-description {
color: #33CCFF;
font-size: 22pt;
font-weight: normal;
text-align:left;
}

/* two column sidebar left */

#pagebody { margin-top:34px; background: transparent url(insertimagehere) top center repeat-y; width:800px; } /* bg.png */
#alpha { margin-top:-14px; width: 620px; background: #f7f7f7; -moz-border-radius-topleft: 14px; float:left !important; }
#alpha-inner { margin-top:85px; padding:10px; }
#beta { margin-top:-14px; width: 159px; background:#C0DEED; -moz-border-radius-topright: 14px; padding:10px; border-left:1px solid #8BC3DF; float:right !important; }

/* entries */

.entry { margin:0 10px; width:580px; background:#f7f7f7; }

.date-header {
float:left !important;
margin-left:-145px;
min-width:120px;
width:120px;
max-width:120px;
color: #000;
font-size:24pt;
font-weight: bold;
text-align:right;
width:100%;
line-height:20pt;
margin-bottom:-90px;
}

.entry-header {
display:none;
}

.entry-body {
background:transparent;
color: #333;
text-align:justify;
font-size:12pt;
}

.entry-content {
padding:10px;
border-bottom:2px solid #eeeeec;
}
.entry-content:hover {
background:#f1f1f1;
}

.entry-userpic {
float:left !important;
width:100%;
text-align:left;
display:block;
margin:0;
padding:0;
line-height:0;
font-size:0;
}
.entry-userpic img {
display:none !important;
float:left !important;
margin:0;
padding:0;
line-height:0;
font-size:0;
}
p.poster {
padding:0 5px;
text-align:left;
color:#000;
font-size:12pt;
line-height:14pt;
font-weight: normal;
}
p.poster a {
color: #066db2;
font-weight:normal;
text-decoration:none;
}
p.poster a:hover {
text-decoration:underline;
}

.entry-footer {
margin:0;
padding:0;
color: #999;
font-weight: normal;
font-size:8pt;
text-transform:lowercase;
text-align:left;
line-height:30pt;
}
.entry-footer a {
color: #999;
text-decoration:none;
padding:0;
}
.entry-footer a:hover {
text-decoration:underline;
}

.content-nav {
position:absolute;
top:-55px;
right:-185px;
display:block;
padding:5px 10px;
-moz-border-radius: 7px;
background:#f7f7f7;
z-index:4000;
font-size:0;
color:#f7f7f7;
}
.content-nav a{
width:100px;
color:#066db2;
text-transform:capitalize;
text-align:center;
font-size:10pt;
text-decoration:none;
padding:0 10px;
}
.content-nav a:hover {
text-decoration:underline;
}

.metadata, .ljtags {
display:none;
}

/* modules */

.module-viewlinks {
width:160px;
text-align:left;
border-bottom:1px solid #8BC3DF;
}
.module-viewlinks a, .module-viewlinks a:visited {
color:#066db2;
font-size:10pt;
text-decoration:none;
text-align:left;
font-weight:normal;
text-transform:capitalize;
}
.module-viewlinks li a:hover {
text-decoration:underline;
}

.module-typelist {
width:160px;
text-align:left;
border-bottom:1px solid #8BC3DF;
margin-top:10px;
}
.module-typelist a, .module-typelist a:visited {
color:#066db2;
font-size:10pt;
text-decoration:none;
text-align:left;
font-weight:normal;
text-transform:capitalize;
}
.module-typelist li a:hover {
text-decoration:underline;
}

.module-categories {
width:160px;
text-align:left;
margin-top:10px;
}
.module-categories li {
display:block;
}
.module-categories a, .module-categories a:visited {
display:block;
color:#066db2;
font-size:8pt;
text-decoration:none;
text-align:left;
font-weight:bold;
text-transform:lowercase;
}
.module-categories li a:hover {
text-decoration:underline;
}

.module-syndicate {
width:160px;
height:50px;
text-align:left;
padding-top:10px;
border-top:1px solid #8BC3DF;
}
.module-syndicate .module-content:before {
color:#444;
font-size:8pt;
text-decoration:none;
text-align:left;
font-weight:normal;
content: "layout by http://poirot.insanejournal.com";
}
.module-syndicate img {
display:none;
}

.module-photo {
position:absolute;
left:-650px;
}
.module-photo img {
width:75px;
height:75px;
}

.module-pagesummary {
position:absolute;
top:-11px;
left:-590px;
width:21px;
height:11px;
background:transparent url(insertimagehere) top left no-repeat; /* arr2.gif */
}
.module-pagesummary .module-content {
display:none;
}

.module-header, .module-calendar, .module-powered {
display:none;
}

/* icons */

.entry-header img[src="http://www.insanejournal.com/img/icon_protected.gif"]{
width:0;
height:0;
padding:42px 42px 0px 0px !important;
background:transparent url(http://i48.tinypic.com/2pq0zm9.png) center center no-repeat !important;
margin-bottom:-20px !important;
}

.entry-header img[src="http://www.insanejournal.com/img/icon_private.gif"]{
width:0;
height:0;
padding:42px 42px 0px 0px !important;
background:transparent url(http://i48.tinypic.com/2pq0zm9.png) center center no-repeat !important;
margin-bottom:-20px !important;
}

.ljuser img {
display:none;
}
.ljuser:before {
content: "@";
}
WHAT YOU NEED

1. bg.png, bullet.png, arr2.gif
   
2. DO NOT HOTLINK TO THESE. Save and upload them to your own server » locate /* imagename */ comments throughout the code and paste corresponding image links into url(insertimagehere) on the same line.

CUSTOMISING BACKGROUND IMAGE

1. Locate /* YOUR BACKGROUND OF CHOICE */ comment and paste background image link into url(insertimagehere) on the same line.

CUSTOMISING TEXT

1. Customise Journal » Journal Title (for Twitter UN) and Subtitle (for Twitter Status). Save.

CUSTOMISING LINKS

1. Customise Journal » Linklist. Enter links as needed. Save.

CREDIT

1. Please add a link to http://poirot.insanejournal.com (see CUSTOMISING LINKS above).
   
2. Alternatively, link to ~poirot somewhere on your profile page.
   
3. Please note that credit is hard-coded into the calendar module, however, IE does not support this property and therefore it will not show up in all browsers. You may remove this if you so desire, but please credit by one of two methods above. You may not remove the header comment.

'magic click' code inspired by rp_tutorials

Please watch ~poirot for updates!