InsaneJournal

Tweak says, "INCONCEIVABLE!"

run. run, you clever boy. and remember. (souffle) wrote in rp_tutorials,
@ 2011-10-30 15:47:00

with some layouts I know people like have minicons replacing the usual (and plain ugly) userinfo/comm icons. and I've managed to transplant the coding for that from one layout to the layout i'm wanting to use (because i'm fairly okay when it comes to modifying most css coding through trial and error).

but i was wondering if anyone here might be able to tell me how to change the icons that denote whether an entry is private or friends only? ...because the eye and lock icons IJ has are ugly :/

thanks for any help :D

edit to make it easier here's the layout code i'm using. :)
edit2 also worded my question a bit better, im not always so good at the explaining/asking of things

FRIENDS_OPT_ITEMS=>10

FRIENDS_WEBSITE<=

<div id="sidebar">
<li><a href="http://crackers.insanejournal.com/">  T H E  M O S T  R E C E N T</a></li>
<li><a href="http://crackers.insanejournal.com/friends/">  T H E  F R I E N D S  P A G E</a></li>
<li><a href="http://crackers.insanejournal.com/calendar/">  T O  T H E  A R C H I V E</a></li>
<li><a href="http://crackers.insanejournal.com/profile">  T O  T H E  P R O F I L E</a></li>
<li><a href="http://crackers.insanejournal.com/profile">  T O  T H E  I C O N S</a></li>
<li><center><img src="http://i40.tinypic.com/9014pf.gif" width="296">
this little jewel, this little quiet bastion of old times
</li></div>

<div> </div>

<=FRIENDS_WEBSITE

DAY_TALK_LINKS<=
<table class="x">
<tr><td class="comments" colspan="2">
<center>
<a href="%%urlread%%">%%messagecount%% comments %%mc-plural-s%%</a> | <a href="%%urlpost%%">reply</a> | <a

href="http://insanejournal.com/editjournal.bml?%%itemargs%%">edit</a> | <a

href=http://www.insanejournal.com/tools/memadd.bml?%%itemargs%%>memories</a> 
</center></div>
</td></tr>
<=DAY_TALK_LINKS

DAY_WEBSITE<=

<div id="sidebar">
<li><a href="http://crackers.insanejournal.com/">  T H E  M O S T  R E C E N T</a></li>
<li><a href="http://crackers.insanejournal.com/friends/">  T H E  F R I E N D S  P A G E</a></li>
<li><a href="http://crackers.insanejournal.com/calendar/">  T O  T H E  A R C H I V E</a></li>
<li><a href="http://crackers.insanejournal.com/profile">  T O  T H E  P R O F I L E</a></li>
<li><a href="http://crackers.insanejournal.com/profile">  T O  T H E  I C O N S</a></li>
<li><center><img src="http://i40.tinypic.com/9014pf.gif" width="296">
this little jewel, this little quiet bastion of old times
</li></div>

<div> </div>

<=DAY_WEBSITE

LASTN_TALK_LINKS<=
<table>
<tr><td class="comments" colspan="2">
<br><center>
<a href="%%urlread%%">%%messagecount%% comments %%mc-plural-s%%</a> | <a href="%%urlpost%%">reply</a> | <a

href="http://insanejournal.com/editjournal.bml?%%itemargs%%">edit</a> | <a

href=http://www.insanejournal.com/tools/memadd.bml?%%itemargs%%>memories</a> 
</center></div>
</td></tr>
<=LASTN_TALK_LINKS

GLOBAL_HEAD<=
<title>TITLE HERE</title>
<style>
<!--
body {
background-color: #000000;
font-family: tahoma;
font-size: 8pt;
color: #C4B5AA;
line-height: 15pt;
margin:0; overflow-x:hidden; }

BODY, TD {
text-align: justify;}

table, tr, xmp, div, td, p {
text-align: justify;}

.shadowed img{display:none; }

table table table table .meta {visibility:hidden;position:absolute;top:1px}
table table table table table .meta {visibility:visible;position:relative;top:1px}

table table .index
{background-color: transparent;
 line-height: 4pt;
 font-size: 7pt;
 font-family: georgia, serif;
 color: #0E0D0C;
 text-align:center;
 padding: 0px;
 width: auto;
}

table table table td.meta
{padding: 1px;
 line-height: 4pt;
 font-size: 7pt;}

.entrybox .meta
{background-color: transparent;
text-align:center;
}

tr.caption{display:none }

.shadowed td div{
visibility: hidden;
position: absolute;
top: 1px }

/*YOUR SIDEBAR*/
#sidebar{
position:absolute !important;
top: 15px !important;
left: 100px !important;
width: 300px !important;
height: auto;
visibility: visible;
z-index:1;
font-family: tahoma;
font-size: 8pt;
color: #FFFFFF;
line-height: 15pt; }

html>body #sidebar{
position:absolute !important;
top: 20px !important;
left: 100px !important;
width: 300px !important;
height: auto;
visibility: visible;
z-index:1;
font-family: tahoma;
font-size: 8pt;
color: #FFFFFF;
line-height: 15pt; }

#sidebar img{display:inline; }

/*YOUR ENTRIES*/
table, tr, td, .shadowed {
background-color: transparent;  
font-family: arial;
font-size: 8pt;
color: #FFFFFF; 
line-height: 10pt;}

body {margin-top:-10px !important; margin-top:-15px; }

.content {background-color: #0E0D0C; }

table { 
width: 540px; 
margin-left:450px !important;
margin-right:100%;
font-family: tahoma;
font-size: 8pt;
color: #C4B5AA;
line-height: 15pt; }

table table {width:100% !important; margin:0 !important; background-color:#0E0D0C;} 
table table table {width:auto !important; background-color:transparent;} 
table td {border:0px solid #FFFFFF;}
table, table table td {border:none; padding:1px; background-color: #0E0D0C;}

.shadowed img
/* icons */
{color:#E3DECB; border:none;}
.entrybox 
/* entry border */
{border:0px solid #3F2FB0;  }
.entrybox .index 
/* hiding bracket */
{color:#F6BF96; }

u {text-decoration:none; font-weight: bold; border-bottom:1px solid #8D639A; }
b {color:#8d639a;}

ul
{
list-style-type: none;
padding: 0;
margin: 0;
text-align: center;
width: 300px;
}

li {display:block; background-color: #0E0D0C; text-decoration: none; margin: 0 0 .2em 0;}

a:link, a:active, a:visited{color: #83786E; text-decoration:none;}
a:hover{color:#695D51; background-color:#0A0A09}

td.caption, .subject { 
background-color: #0E0D0C;
font-family: "times new roman", georgia;
font-size:25px; 
color: #C0AEA0;
line-height:25px; 
letter-spacing: 2px;
font-family: georgia, serif;  }

p table table td.caption, .head{ 
line-height:25px; 
font-size: 20px; 
letter-spacing: 2px;
font-family: georgia, serif; }

.comments {
font-size:5pt;
font-family:"georgia";
text-transform:uppercase;
letter-spacing: 2px;
}

.entrybox td.index, .index3 {display: none;}
.index2 {font-style:normal; }

.ljuser img[src="http://www.insanejournal.com/img/userinfo.gif"] {
width: 0;
height: 0;
background-repeat: no-repeat !important;
background-image: url(http://i55.tinypic.com/2gxn3t0.jpg) !important;
padding: 6px 10px 6px 1px !important;
}

.ljuser img[src="http://www.insanejournal.com/img/community.gif"] {
width:0;
height: 0;
background-repeat: no-repeat !important;
background-image: url(http://i53.tinypic.com/2z7kg8j.jpg) !important;
padding: 9px 11px 3px 1px !important;
}

.entry-userpic img[src="http://www.insanejournal.com/img/userinfo.gif"] {
width: 0;
height: 0;
background-repeat: no-repeat !important;
background-color: transparent !important;
background-image: url(http://i55.tinypic.com/2gxn3t0.jpg) !important;
padding: 7px 10px 8px 1px !important;
}

.entry-userpic img[src="http://www.insanejournal.com/img/community.gif"] {
width:0;
height: 0;
background-repeat: no-repeat !important;
background-color: transparent !important;
background-image: url(http://i53.tinypic.com/2z7kg8j.jpg) !important;
padding: 7px 9px 3px 1px !important;
}

-->
</style>
<=GLOBAL_HEAD

FRIENDS_TALK_LINKS<=
<table>
<tr><td class="comments" colspan="2">
<div align="right">
<right>
<a href="%%urlread%%">%%messagecount%% comments %%mc-plural-s%%</a> | <a href="%%urlpost%%">reply</a> | <a

href="http://insanejournal.com/editjournal.bml?%%itemargs%%">edit</a> | <a

href=http://www.insanejournal.com/tools/memadd.bml?%%itemargs%%>memories</a> 
</right>
</div>
</td></tr>
<=FRIENDS_TALK_LINKS

LASTN_OPT_ITEMS=>10

CALENDAR_WEBSITE<=

<div id="sidebar">
<li><a href="http://crackers.insanejournal.com/">  T H E  M O S T  R E C E N T</a></li>
<li><a href="http://crackers.insanejournal.com/friends/">  T H E  F R I E N D S  P A G E</a></li>
<li><a href="http://crackers.insanejournal.com/calendar/">  T O  T H E  A R C H I V E</a></li>
<li><a href="http://crackers.insanejournal.com/profile">  T O  T H E  P R O F I L E</a></li>
<li><a href="http://crackers.insanejournal.com/profile">  T O  T H E  I C O N S</a></li>
<li><center><img src="http://i40.tinypic.com/9014pf.gif" width="296">
this little jewel, this little quiet bastion of old times
</li></div>

<div> </div>

<=CALENDAR_WEBSITE

LASTN_WEBSITE<=

<div id="sidebar">
<li><a href="http://crackers.insanejournal.com/">  T H E  M O S T  R E C E N T</a></li>
<li><a href="http://crackers.insanejournal.com/friends/">  T H E  F R I E N D S  P A G E</a></li>
<li><a href="http://crackers.insanejournal.com/calendar/">  T O  T H E  A R C H I V E</a></li>
<li><a href="http://crackers.insanejournal.com/profile">  T O  T H E  P R O F I L E</a></li>
<li><a href="http://crackers.insanejournal.com/profile">  T O  T H E  I C O N S</a></li>
<li><center><img src="http://i40.tinypic.com/9014pf.gif" width="296">
this little jewel, this little quiet bastion of old times
</li></div>

<div> </div>

<=LASTN_WEBSITE

(Read comments) - (Post a new comment)

	forsythia 2011-10-30 03:47 pm UTC (link)
	On my end, it appears that you successfully changed the images. Are the changes still not showing to you? If not, then are you by chance using Internet Explorer? I ask because I've seen some additional coding floating around in some layouts that seems redundant but claims to be fixing a bug to make the changes stick in IE. (Reply to this) (Thread)

	souffle 2011-10-30 03:54 pm UTC (link)
	the icons for the journal links work fine yeah. but i mean ones that denote whether an entry is private or friends only. (Reply to this) (Parent) (Thread)

forsythia
2011-10-30 04:21 pm UTC (link)

Wow, I misread the life out of that, didn't I? xD Sorry!

Make sure you're adding the code under the GLOBAL_HEAD<= section, beneath the style and comment (with the !--) tags. Then use this, which is the same as the code given by the first user but with the class changed to accommodate S1.

If you have any trouble with it afterward, shoot me the code including the images you want to use and I'll give it a test drive on a character journal using the same layout to see what needs changing. :)

(Reply to this) (Parent) (Thread)

	souffle 2011-10-30 04:33 pm UTC (link)
	It's cool. Like I said in my edit i'm not always the best at explaining. Ah i did figure it was something to do with being s1 ... (Reply to this) (Parent)

	souffle 2011-10-30 04:48 pm UTC (link)
	It works great! I did have to tweak the padding, but apart from that it works awesomely. Thanks so much for the help on this and the other problem I had. Tis very much appreciated. :D (Reply to this) (Parent)

	souffle 2011-10-30 04:53 pm UTC (link)
	Ta-da! very very happy with my layout now. thanks to you. (Reply to this) (Parent) (Thread)

	forsythia 2011-10-30 05:01 pm UTC (link)
	That looks great! Glad I could help. :) Now to head over to Dean's journal and fancy up the default images. You've inspired me not to leave the ones that don't match. ♥ (Reply to this) (Parent) (Thread)

	souffle 2011-10-30 05:07 pm UTC (link)
	lol. have fun with that :) (Reply to this) (Parent)

(Read comments) -