![[personal profile]](https://www.dreamwidth.org/img/silk/identity/user.png){kind=small}
Happy Birthday ![[livejournal.com profile]](https://www.dreamwidth.org/img/external/lj-userinfo.gif){kind=small}
thirdgorchbro and jetpackmonkey!
Hope you both have fantastic days!
And sorry for this - for bellatemple who asked for advice on how to add images with links to the sidebar on the 3Column layout on LJ. This is not my coding, it's tweaked from this tutorial by geisha_doll
So here's one for the pictures on the left hand side of the page under the 'blurb' text:
Create a layout-specific 'theme' in the 'advanced customisation area, name it '3col center' and hit 'Edit'. Copy and paste the below coding into the box (overwriting what's in there already) and change the relevant parts (marked in blue). If you don't want it to open in a new window, just delete the target="_blank" from the link.:
layerinfo "type" = "theme";
layerinfo "name" = "3col center";
function Page::print_custom_head() {
"""
<style media="screen" type="text/css">
body
{text-align:center;
}
#shrink{
position:relative;
margin:0 auto 0 auto; padding:0;
text-align:left;
width:750px; /*Change this width to match the width of your banner*/
background:transparent;
}
</style>
""";
}
function Page::print () {
var string title = $this->title();
"""
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>$title</title>
""";
$this->print_head();
"""
<link rel="stylesheet" href="$.stylesheet_url" type="text/css" />
</head>
<body>
<a name="top"></a>
<div id="shrink">
<div id="header"></div>
<div id="container">
<div id="entries"><div>
""";
$this->lay_print_subnav();
$this->print_body();
$this->lay_print_subnav();
"""
</div></div>
<div id="rightbar">
<div class="sidebox">
<h2>$*nav_title</h2><ul class="links">
<li class="links"><a href="$*SITEROOT/userinfo.bml?user=$.journal.username">$*t_view_userinfo</a></li>
<li class="links"><a href="$*SITEROOT/users/$.journal.username">$*t_view_recent</a></li>
<li class="links"><a href="$*SITEROOT/users/$.journal.username/calendar">$*t_view_archive</a></li>
<li class="links"><a href="$*SITEROOT/users/$.journal.username/friends">$*t_view_friends</a></li>
</ul>
</div>
""";
$this->print_linklist();
"""
</div>
<div id="leftbar">
<div class="sidebox">
<h2>$*about_title</h2>
<div align="center">
""";
$this->lay_print_userpic();
"""
<br />
<span class='ljuser' style='white-space:nowrap;'><a href='$*SITEROOT/userinfo.bml?user=$.journal.username'><img src='http://stat.livejournal.com/img/userinfo.gif' alt='userinfo' width='17' height='17' style='vertical-align:bottom;border:0;' /></a><a href='$*SITEROOT/users/$.journal.username/'><b>$.journal.username</b></a></span>
<br />
<a href="$*SITEROOT/friends/add.bml?user=$.journal.username"><img src="http://stat.livejournal.com/img/btn_addfriend.gif" alt="Friend Me" title="Friend Me" width="22" height="20" style="border: 0;" /></a>
<a href="$*SITEROOT/todo/?user=$.journal.username"><img src="http://stat.livejournal.com/img/btn_todo.gif" alt="My To-do List" title="My To-do List" width="22" height="20" style="border: 0;" /></a>
<a href="$*SITEROOT/tools/memories.bml?user=$.journal.username"><img src="http://stat.livejournal.com/img/btn_memories.gif" alt="Memories" title="Memories" width="22" height="20" style="border: 0;" /></a>
</div></div>
<div class="sidebox">
<h2>$*blurb_title</h2>
<div class="blurb">
$*blurb_text
<br/>
<a href="http://www.link1.com" target="_blank"><img src="http://www.image1.com"></a><br/>
<a href="http://www.link2.com" target="_blank"><img src="http://www.image2.com"></a><br/>
</div>
</div>
""";
$this->lay_print_calendar();
"""
</div>
<div style="clear: both"></div>
</div>
</div>
</body>
</html>
""";
}
And for the other side of the page with the images and links appearing under the userinfo etc section:
layerinfo "type" = "theme";
layerinfo "name" = "3col center";
function Page::print_custom_head() {
"""
<style media="screen" type="text/css">
body
{text-align:center;
}
#shrink{
position:relative;
margin:0 auto 0 auto; padding:0;
text-align:left;
width:750px; /*Change this width to match the width of your banner*/
background:transparent;
}
</style>
""";
}
function Page::print () {
var string title = $this->title();
"""
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>$title</title>
""";
$this->print_head();
"""
<link rel="stylesheet" href="$.stylesheet_url" type="text/css" />
</head>
<body>
<a name="top"></a>
<div id="shrink">
<div id="header"></div>
<div id="container">
<div id="entries"><div>
""";
$this->lay_print_subnav();
$this->print_body();
$this->lay_print_subnav();
"""
</div></div>
<div id="rightbar">
<div class="sidebox">
<h2>$*nav_title</h2><ul class="links">
<li class="links"><a href="$*SITEROOT/userinfo.bml?user=$.journal.username">$*t_view_userinfo</a></li>
<li class="links"><a href="$*SITEROOT/users/$.journal.username">$*t_view_recent</a></li>
<li class="links"><a href="$*SITEROOT/users/$.journal.username/calendar">$*t_view_archive</a></li>
<li class="links"><a href="$*SITEROOT/users/$.journal.username/friends">$*t_view_friends</a></li>
</ul>
<br/>
<a href="http://www.link1.com" target="_blank"><img src="http://www.image1.com"></a><br/>
<a href="http://www.link2.com" target="_blank"><img src="http://www.image2.com"></a><br/>
</div>
""";
$this->print_linklist();
"""
</div>
<div id="leftbar">
<div class="sidebox">
<h2>$*about_title</h2>
<div align="center">
""";
$this->lay_print_userpic();
"""
<br />
<span class='ljuser' style='white-space:nowrap;'><a href='$*SITEROOT/userinfo.bml?user=$.journal.username'><img src='http://stat.livejournal.com/img/userinfo.gif' alt='userinfo' width='17' height='17' style='vertical-align:bottom;border:0;' /></a><a href='$*SITEROOT/users/$.journal.username/'><b>$.journal.username</b></a></span>
<br />
<a href="$*SITEROOT/friends/add.bml?user=$.journal.username"><img src="http://stat.livejournal.com/img/btn_addfriend.gif" alt="Friend Me" title="Friend Me" width="22" height="20" style="border: 0;" /></a>
<a href="$*SITEROOT/todo/?user=$.journal.username"><img src="http://stat.livejournal.com/img/btn_todo.gif" alt="My To-do List" title="My To-do List" width="22" height="20" style="border: 0;" /></a>
<a href="$*SITEROOT/tools/memories.bml?user=$.journal.username"><img src="http://stat.livejournal.com/img/btn_memories.gif" alt="Memories" title="Memories" width="22" height="20" style="border: 0;" /></a>
</div></div>
<div class="sidebox">
<h2>$*blurb_title</h2>
<div class="blurb">
$*blurb_text
</div>
</div>
""";
$this->lay_print_calendar();
"""
</div>
<div style="clear: both"></div>
</div>
</div>
</body>
</html>
""";
}
Obviously you could add as many images and links as you wanted - just make sure to add <br/> after each one. :)
I hope that helps!
geeky