Post by Boy_Wonder on Jul 22, 2013 21:29:59 GMT -8
Okay I'm not going to lie. This was a massive pain in the rear end to set up. This is just how I have mine set up, Awards isn't perfectly placed and I can't move it around myself. However you have to do some work before hand.
So first of all you'll need to go to your advanced styles & css option, move down or find mini-profile, and change it to something similar to this:
You HAVE to leave the !important at the end of the height.
Following this you'll need to go to Layout Templates - Thread - Post List. Copy and replace the code there with this
Done all that? Good. That's the set up point complete. To finish this off and give you your horizontal mini profile you finally need to copy and paste this into mini-profile:
Note this is only the 'bare bones'. It will give you a decent looking horizontal mini-profile similar to this
However I've also added my own twist on that one as it was one I made specifically for site. I know people have been asking for something like this however so here it is. I will not be releasing the code I use on SHIELD in its exact entirety.
So first of all you'll need to go to your advanced styles & css option, move down or find mini-profile, and change it to something similar to this:
.mini-profile { color: @mini_text_color; font: @mini_text_font; background: @mini_background; border: @mini_border; text-align: @mini_text_align; overflow: hidden; padding: 3px; width: Total width of the posting area here in px or % (note I don't know how % will work); height: Height here, I advise if you're using Todges award code it gets adjusted to 180px !important; }
You HAVE to leave the !important at the end of the height.
Following this you'll need to go to Layout Templates - Thread - Post List. Copy and replace the code there with this
{foreach $[post]}
<tr id="$[post.content_id]" class="$[post.content_class]{if $[post.even]} even{/if}{if $[viewing_recent_posts]} recent{/if}">
<td class="$[post.unblocked_class]">
<table role="grid">
<tr>
<td class="content">
<div class="left-panel">
$[post.created_by_user.miniprofile]
</div>
<div class="content">
<article>
<div class="content-head ui-helper-clearfix">
<div class="info">
$[post.thread]
<span class="date">$[post.date]</span>
{if $[post.how_posted]}
<span class="post-method">via $[post.how_posted]</span>
{/if}
$[post.likes]
</div>
<div class="controls">
$[post.quote_button]
$[post.edit_button]
$[post.likes.button]
$[post.select_options]
</div>
</div>
<h3 class="title aria-hidden">Post by $[post.created_by_user.name] on $[post.date]</h3>
<div class="message">$[post.message]</div>
</article>
<hr style="border: 1px dashed #E6861A; opacity: 0.6;">
{if $[post.edited]}
<div class="edited_by"><span class="italic">Last Edit:</span> $[post.edited.date] by $[post.edited.by_user]{if $[post.edited.reason]}: $[post.edited.reason]{/if}</div>
{/if}
{if $[post.created_by_user.signature]}
<div class="signature">$[post.created_by_user.signature]</div>
{/if}
</div>
<br style="clear: both;" />
</td>
</tr>
</table>
</td>
{if $[post.is_blocked]}
<td class="$[post.blocked_class] content center">
<div class="message note pad-bottom">This post is hidden</div>
$[post.display_blocked_post_button]
</td>
{/if}
</tr>
{/foreach}
{if !$[post]}
<tr class="last"><td class="last center" colspan="1">No posts were found.</td></tr>
{/if}
Done all that? Good. That's the set up point complete. To finish this off and give you your horizontal mini profile you finally need to copy and paste this into mini-profile:
<div class="$[miniprofile_class]" style="border-bottom: 1px Can change to Solid #Colour here;">
<table><tr><td>{if $[user.avatar]}
<div class="avatar">$[user.avatar]</div><br />
{/if}
</td><td vAlign="top">
<b>Name: $[user]</b><br />
{if $[user.is_guest]}Guest<br />{/if}
{if $[user.group]}
$[user.group.name]<br />$[user.group.stars]<br />
{elseif $[user.rank]}
$[user.rank.name]<br />
{if $[user.rank.stars]}
$[user.rank.stars]<br />
{/if}
{/if}
{if $[user.custom_title]}$[user.custom_title]<br />{/if}
$[user.warning.bar]
<br />
{if $[user.personal_text.message]}
<font size="12px">$[user.personal_text]</font><br />
{/if}
{if $[user.gender]}Gender: $[user.gender.text] $[user.gender.image]{/if}
</td>
<td vAlign="top">
{if $[user.is_member]}
<div class="info" style="font-size: 11px !important;">
<b>Posts:</b> $[user.posts]<br />
{foreach $[user.mini_custom_field]}
<br /><span class="$[user.mini_custom_field.content_class]">$[user.mini_custom_field.name]: $[user.mini_custom_field.value]</span>
{/foreach}
{if $[user.is_online]}<br /><span class="italic">Member is Online</span>{/if}
</div><br />
{/if}
{if $[user.miniprofile_badge]}
<div class="$[user.miniprofile_badge_container_class]">
{foreach $[user.miniprofile_badge]}
$[user.miniprofile_badge.icon]
{/foreach}
</div>
{/if}
</td>
</tr>
</table>
</div>
Note this is only the 'bare bones'. It will give you a decent looking horizontal mini-profile similar to this
However I've also added my own twist on that one as it was one I made specifically for site. I know people have been asking for something like this however so here it is. I will not be releasing the code I use on SHIELD in its exact entirety.